Variable fonts : le futur de la typographie sur le web

Grâce aux web fonts, nous pouvons dĂ©jĂ  utiliser des polices plutĂ´t complètes, avec diffĂ©rents niveaux de graisses et d’italique. Seul bĂ©mol, cela requiert Ă©normĂ©ment de fichiers, car chaque style typographique pour une police donnĂ©e nĂ©cessite son propre fichier. Pour des raisons de performance, les dĂ©veloppeurs ont tendance Ă  n’embarquer que le strict minimum, au dĂ©triments du style et de l’intention typographique. A titre d’exemple, inclure toutes les variantes de la police Open Sans reprĂ©sente 549ko (18 fichiers). Septembre 2016 : introduction du format Variable Fonts Ce nouveau format de la famille OpenType change la façon d’utiliser les polices sur le web. Gif Variable Fonts Il permet :
  • d’avoir un seul fichier par police, contenant tous les styles de typographie (italique, graisse, etc).
  • de faire des transition en douceur entre les diffĂ©rents styles.
  • Vous l’aurez compris, le principal avantage des variable fonts est de pouvoir accĂ©der Ă  tous les styles de typographie d’une police, sans alourdir la page. Comparaison d'une page avec et sans variable fonts Comparaison d’une page avec et sans variable fonts. Adoption du format Variable Font Les principaux navigateurs prennent tous en charge ce nouveau format (Firefox depuis quelques jours). Au niveau des outils de design, les variable fonts sont dĂ©jĂ  utilisables dans Photoshop et Illustrator, mais pas encore dans inDesign, Figma ou Sketch. Les mots vĂ©hiculent un sens. La typography l’amplifie ou le dilue. Jason Pamental, (web) typographer Si le sujet vous intĂ©resse, je vous recommande la captation vidĂ©o de la keynote de Jason Pamental lors de la confĂ©rence WebU 2017. On y apprend plein de choses intĂ©ressantes sur la typographie en gĂ©nĂ©ral, et plus particulièrement sur les variable fonts. « Variable Fonts and the Future of Web Design », par Jason Pamental, lors de la confĂ©rence WebU 2017


    Hello.
    Mon nom est Vincent Ballut, je suis développeur web freelance basé à Paris. J'ai aussi un site pro, un github, et je tweet de temps en temps. Si vous souhaitez me contacter, je réponds plus facilement sur linkedin ou par email.

    Ajouter un commentaire

    Laisser un commentaire

    Hello.
    Je m'appelle Vincent Ballut,
    développeur web
    freelance.

    Je publie des articles accessibles et pédagogiques sur tout ce qui touche au développement web et à ses problématiques.

    Dans la vraie vie, je suis développeur web freelance basé à Paris, spécialisé dans le développement frontend (Angular, React, VueJS, etc).

    J'ai aussi un site pro, un github, et je tweet de temps en temps. Si vous souhaitez me contacter, je réponds plus facilement sur linkedin ou par email.

    Derniers articles