Typekit : une librairie de polices pour vos sites web
Tweet
Au regard des dernières tendances en terme de webdesign, il est évident de constater que l’usage de la typographie sur le web s’est vu fortement transformé ces dernières années. Les webdesigners ne sont plus confinés à l’utilisation des typos « standards » et ont aujourd’hui à leur disposition de multiples solutions pour diversifier leurs choix typographiques. Parmi ces solutions : Typekit, une librairie pratique et exhaustive de polices pour vos pages web.
Présentation de Typekit
La solution Typekit est une solution en ligne qui vous permet d’accéder à un catalogue de polices issues de nombreuses fonderies typographiques à travers le monde (Adobe, FontFont, Veer,…). En souscrivant à des abonnements de différents niveaux (gratuit jusque 100$/an), vous profitez ainsi d’un répertoire de très bonne qualité, que Typekit s’applique à faire grossir au fil du temps.
Basée sur la propriété @font-face qui permet à l’internaute de visualiser sur un site internet, des polices qui ne sont pas installées sur son poste, la solution Typekit s’appuie sur un hébergement relativement musclé des polices pour assurer un affichage rapide et permanent sur vos sites.
TypeKit, une réponse aux problèmes de droits d’auteurs
Le fait de s’appuyer sur @font-face pour afficher des polices n’est pas nouveau, et certains me diront que Typekit ne fait que reproduire ce que tout intégrateur ou webdesigner est capable de faire tout seul. L’intérêt premier de Typekit réside dans la gestion des licences et la protection des droits d’auteurs.
Pour rappel ou pour les moins avisés, l’utilisation de @font-face consiste à placer le fichier correspondant à votre police sur un serveur, et d’indiquer ensuite dans votre feuille de style le chemin du fichier. Une solution idéale certes, mais qui pose le problème des droits d’exploitation des polices, et de leur protection : en affichant dans la feuille de style le chemin d’accès au fichier de votre police, vous permettez à n’importe qui de la télécharger et ainsi de se la procurer, gratuitement. Pour garantir la protection des droits d’auteurs, Typekit se charge de sécuriser toutes les polices constituant leur catalogue, en ne permettant aucun accès au fichier hébergé. C’est aussi grâce à cet argument que Typekit obtient la collaboration de nombreuses fonderies et enrichit son catalogue en permanence.
Comment utiliser TypeKit dans vos sites web ?
Vous devez vous créer dans un premier temps un compte sur le site, puis renseigner les sites sur lesquels vous souhaitez utiliser Typekit (pas de panique, vous pourrez ajouter d’autres sites sans difficulté plus tard). Vous aurez alors quelques lignes de javascript à mettre en place dans la balise <head> de chacun de vos sites.
Une fois ceci fait, vous pouvez accéder au catalogue de polices, les visualiser instantanément avec les styles (bold, italic, etc) et le corps que vous souhaitez, et ceci avec votre propre texte. Les polices sont classées de manière à faciliter et accélérer votre recherche : vous pouvez effectuer un tri par famille de polices (serif, sans-serif, script, decorative), par tags, par utilisation (si c’est une police dédiée à des paragraphes ou plutôt des titres), ou par fonderies. Vous pouvez également voir pour chaque police, son rendu sur les différents navigateurs.
Une fois votre police sélectionnée, celle-ci sera ajoutée à votre kit. Vous pourrez définir une classe css pour cette police, que vous associerez à l’élément concerné dans votre code html (n’oubliez pas d’insérer les deux lignes de javascript comme indiqué plus haut dans l’article).
Pour vous permettre de découvrir leur service, Typekit propose un accès gratuit pendant un mois. Celui-ci vous permet d’utiliser deux polices de leur catalogue parmi une sélection restreinte et sur un seul site. Les formules payantes oscillent entre 25 et 100$ par an, le prix variant en fonction du nombre de polices mises à disposition, du nombre de sites sur lesquels vous les utilisez et du nombre de visites moyens sur ces sites.
Une solution adaptée au web, avec toutefois quelques inconvénients
TypeKit est une belle solution pour permettre à tout webdesigner d’exploiter librement un catalogue de polices de qualité, sans se ruiner. Quelques inconvénients subsistent malgré tout :
- le fonctionnement de Typekit repose sur du code javascript. Votre police ne fonctionnera donc pas sur les postes d’internautes ayant désactivé l’interprétation du Javascript sur leur navigateur. Veillez à indiquer des alternatives à vos polices Typekit dans votre feuille de style, en choisissant des polices websafe (polices standards tel qu’Arial, Helvetica, etc).
- L’utilisation de Typekit risque de rendre vos pages plus lourdes et plus longues à charger. Le poids de chaque police est indiqué en bas de votre kit. Attention donc à ne pas surcharger vos pages (et au delà de ça, n’abusez pas de la typographie. Utiliser plus de 2 à 3 polices différentes sur une même page nuira à la lisibilité de votre contenu).
- Typekit ne permet qu’une utilisation des polices sur le web. Pour vos maquettes, optez donc pour… le système D ! (Bon ok on ne peut pas tout avoir, cela aurait été trop beau !). TypeKit vous aide toutefois en fournissant pour chaque police un lien vers une page où vous pourrez en effectuer l’achat.
Conclusion
Pour un coût loin d’être démesuré, Typekit met à disposition un catalogue relativement fourni de typographies qualitatives pour le web. Utilisé par plus de 250 000 clients à travers le monde, dont de grandes pointures du web telles que Twitter ou The New York Times, Typekit est sans doute devenu la meilleure solution pour résoudre les problèmes de droits d’auteur et de sécurisation des polices sur le web, tout en favorisant la créativité des webdesigners.
Tweet
A propos de l'auteur
Emeline Bulcourt est directrice artistique au sein d'une web agency lilloise, et co-fondatrice du collectif ikomeo. Passionnée de graphisme et de web et constamment à l'affût des dernières actualités et tendances du milieu, elle partage son expérience et son analyse à travers ikomeo Design.
Continuez votre lecture
Pendant longtemps, l'utilisation de polices sur le web était restreinte aux quelques Arial, Gen ...
Marre des polices système sur vos sites web ? Vous avez essayé divers outils un peu dans tous le ...
L'avènement de la typographie sur le web La typographie n'a jamais été aussi présente sur le we ...
Les comportements de lecture à l'écran sont très différents d'une lecture sur papier. En effet, ...
Petit billet rapide pour vous faire découvrir un outil on ne peut plus simple, mais qui peut s'a ...
Fubiz
Make Better Websites
Pattern Tap
Presse-Citron
Smashing Magazine
Fitéo
