![Formulaire Word interactif : liste déroulante, case à cocher, zone de texte à remplir [TutorielWord]](https://i.ytimg.com/vi/6Thinm8iow0/hqdefault.jpg)
Contenu
La typographie sur le Web a parcouru un long chemin. Il y a environ dix ans, il était encore terriblement sous-utilisé et très mal fait - une expérience utilisateur néfaste. Le texte n'était pas très lisible en ligne et les mêmes polices de caractères étaient utilisées maintes et maintes fois. Les gens lançaient leurs mains en l'air, affirmant que vous ne pouviez pas bien faire de la typographie sur le Web.
Mais il y a un homme qui a essayé de convaincre les gens du contraire et c'est Richard Rutter, co-fondateur de l'influent cabinet de conseil en UX Clearleft. Il y a maintenant une véritable vague d'enthousiasme à propos des polices Web et de la typographie et il est au centre de tout cela.
L'un des plus grands changements de jeu à l'heure actuelle est l'avènement des polices variables, une technologie qui permet à un seul fichier de polices de se comporter comme plusieurs polices. «Il est vraiment intéressant de voir à quelle vitesse cela est sorti de nulle part», explique Rutter.
«Adobe, Microsoft, Apple et Google ont tous jeté leur poids collectif derrière des polices variables et ils ont tous leurs raisons légèrement différentes. Google sera particulièrement performant, car vous pouvez économiser énormément d'espace.
Vous pouvez réduire radicalement la taille du fichier, car vous pouvez avoir un régulier et un gras enveloppés ensemble
«Si vous traitez en particulier les langues chinoises, japonaises et coréennes, les fichiers de polices auront une taille de quelques mégaoctets par opposition aux fichiers de polices latins, qui sont beaucoup plus petits», poursuit Rutter. "Vous pouvez réduire radicalement la taille de ces fichiers, car vous pouvez avoir un format standard et un gras regroupés. Vous n'avez qu'un seul fichier de police pour un nombre infini de variations. Il sera également très intéressant de voir comment taper les concepteurs proposeront des variations stylistiques dans leurs polices qui sont vraiment inhabituelles et que nous n'aurions jamais vues auparavant. »
Les polices variables peuvent maintenant être utilisées dans de vrais projets. La prise en charge des navigateurs a atteint plus de 65%. Safari et Chrome prennent déjà en charge les polices variables et Firefox et Edge suivront sous peu. Les dernières versions de Photoshop et d’Illustrator les prennent également en charge et sont également incluses dans les derniers systèmes d’exploitation Windows et Mac. La police système d’Apple San Francisco utilise largement les variations de polices.
Clearleft a utilisé une police variable sur le site Web de Ampersand, la conférence sur la typographie Web. C’est l’un des premiers sites commerciaux à faire une telle chose, quelque chose que Rutter explore dans son article, comment utiliser des polices variables dans le monde réel.
«Nous avons défini le mot« Ampersand »en six poids différents», se réjouit Rutter. «Chaque lettre individuelle est définie à un poids légèrement différent pour lui donner une sensation légèrement plus dessinée à la main. Vous n’auriez jamais fait cela dans le passé! Vous l'auriez servi sous forme de SVG, mais maintenant c'est du vrai texte, et nous pouvons le faire avec une police variable, qui est de petite taille car elle a un très petit jeu de caractères. Il contient l’alphabet complet et très peu d’autres, mais c’est tout ce dont nous avions besoin pour un mot. »
Rutter a d'abord étudié le génie chimique et, bien avant de fonder Clearleft avec Andy Budd et Jeremy Keith en 2005, a commencé sa carrière en concevant des morceaux de plates-formes pétrolières. Il a découvert son amour pour la typographie pour la première fois au milieu des années 1990. Le Web est arrivé et n'importe qui pouvait créer une page Web s'il pouvait taper du HTML simple. Rutter a trouvé cela très gratifiant, alors il s'est lancé dans le design et avec cela est venu la typographie.
«Lors de mon premier véritable travail de designer dans une agence à Londres, j'ai découvert le livre de Robert Bringhurst, The Elements of Typographic Style», se souvient Rutter. «C'était une révélation. J'étais fasciné par la façon dont il composait les pages et les processus de réflexion qui les sous-tendent. J'ai réalisé - et j'en suis tombé amoureux - des détails subtils qu'il mettait dans son travail. Cela a vraiment résonné avec moi. Il y a une merveilleuse geekiness là-dedans.
"Il y a beaucoup de détails minuscules, apparemment dénués de sens, que parfois seuls vous ou d'autres typographes pouvez voir. C'est en quelque sorte votre propre code spécial, mais si vous en avez assez, alors le tout s'unit pour devenir quelque chose de beau et agréable. Ils améliorent tous l'expérience de lecture. "
Il y a beaucoup de petits détails, apparemment dénués de sens, que parfois seuls vous ou d'autres typographes pouvez voir
La découverte du livre de Bringhurst a incité Rutter à commencer à écrire sur la typographie sur le Web. Il voulait montrer aux gens comment appliquer les directives de Bringhurst en utilisant des techniques disponibles en HTML et CSS et est devenu un évangéliste autoproclamé de la typographie Web. En fin de compte, cela a conduit au propre livre de Rutter, Web Typography, un manuel pour concevoir une typographie responsive belle et efficace.
À l'origine, il devait être co-écrit par Mark Boulton et son collègue typographe Jon Tan, avec qui Rutter a cofondé le service de polices Web pionnier Fontdeck (maintenant fermé). Il allait également être publié par le biais des Five Simple Steps de Boulton, qui a fermé ses portes lorsque son agence a été rachetée par Monotype. Malgré les revers, Rutter s'est engagé dans le projet et a décidé d'aller de l'avant seul, sans éditeur et avec l'aide de Kickstarter; sa campagne a atteint son objectif en moins de 48 heures.
La typographie Web s'adresse à la fois aux concepteurs et aux développeurs et allie la théorie typographique aux aspects pratiques et techniques. Rutter a essayé d'inclure tout ce à quoi il pouvait penser et qui serait pertinent pour la typographie Web. L'une des théories qu'il aborde est de savoir comment vous ne pouvez pas avoir une bonne expérience utilisateur sans une bonne typographie.
«Regarder les mots est la grande majorité de ce que nous faisons sur le Web», souligne-t-il. «Des millions de personnes le font chaque jour et le type est l'expérience la plupart du temps, c'est pourquoi il est si important de bien faire.
Il y a quelques années, une étude réalisée par Microsoft en collaboration avec le MIT a tenté de comparer la différence entre ce qui était considéré comme une bonne et une mauvaise typographie. Il n'y avait pas de différence significative en termes de vitesse de lecture, de rétention d'informations ou même de compréhension. La chose principale qu'ils ont trouvée était qu'avec une bonne typographie, la vitesse de lecture était plus rapide et il y avait un sentiment général de détente et de plaisir. Avec une mauvaise typographie, les gens fronçaient davantage les sourcils, ils ont donc essentiellement trouvé qu'une bonne typographie vous mettait de bonne humeur. Si ce n’est pas l’expérience utilisateur ultime, je ne sais pas ce que c’est! »
Cet article a été initialement publié dans le numéro 308 de rapporter, le magazine le plus vendu au monde pour les concepteurs et développeurs Web. Acheter le numéro 308 ou alors abonnez-vous au net.
Vous souhaitez en savoir plus sur la manière de tirer le meilleur parti de la typographie en ligne?
Richard Rutter a un amour et une fascination pour la typographie et a cofondéFontdeck, un service de polices Web pionnier. En tant qu'évangéliste autoproclamé de la typographie Web, Richard est l'organisateur en chef de Clearleft.Esperluette conférences de typographie Web.
Lors de Generate London 2018, son atelier vous aidera à créer des sites Web avec une typographie Web attrayante, appropriée, distinctive, expressive et lisible, qui s'adapte aux écrans de toutes formes et tailles. Vous apprendrez à combiner un artisanat vieux de plusieurs siècles avec une technologie de pointe - y compris des polices variables - afin de concevoir et de développer les meilleures expériences pour vos lecteurs.
Generate London aura lieu du 19 au 21 septembre 2018.Obtenez votre billet maintenant.
