Loading AI tools
La typographie sur le Web désigne le choix des polices de caractères, la mise en page et l'intégration de nouvelles fontes sur les sites web et leurs pages Web.
Lors du choix des polices de caractères, un concepteur Web se tourne vers celles conçues pour une bonne lecture à l’écran et qui se retrouvent sur la majorité des plateformes. Pour plusieurs, l’originalité de ces fontes s’est transformée en conformisme tant elles sont populaires[1]. C’est pourquoi l’idée d’aller au-delà de ces limites a fait son chemin depuis les débuts du Web.
Différentes techniques permettent d’afficher à l’utilisateur une police qu’il ne possède pas, toutes ayant des avantages et des désavantages, que ce soit au niveau de la syntaxe ou de la sémantique. En général, le procédé se résume à transformer un élément texte en élément graphique. Ainsi, le navigateur n’a pas à mettre en page le texte car il est décodé comme un tout, une image, une animation, etc. Outre ces compromis, il existe un code de mise en page qui indique l’emplacement d’une police puis la télécharge sur le poste du visiteur. Ce principe existe depuis plus de dix ans sur Internet Explorer mais n’a pas été adopté en raison de l’absence d’uniformité dans son interprétation et des risques d’atteinte à la propriété intellectuelle.
La standardisation est un enjeu majeur dans le monde du Web. Un produit multimédia dit standard répond autant du point de vue fonctionnel que visuel pour différentes résolutions, différentes générations de navigateurs, des vitesses de connexion lentes et extrêmement rapides. C’est dans cette optique que fut développé le format WOFF. Il ne s’agit pas d’une fonte en soi mais plutôt d’une valise pour la transporter et l’identifier. Ce fichier est téléchargé dans l’historique du navigateur mais ne peut être utilisé par aucun autre document ou logiciel. Cette limitation au visiteur assure au créateur que son œuvre ne se retrouvera pas réutilisée à d’autres fins[2]. Les plus récentes générations de navigateurs ont rapidement adopté ce format. En parallèle, ils ont implémenté le support de l’importation via la règle font-face tel que standardisé par CSS. Voilà le point de départ pour l’utilisation à grande échelle de cette méthode.
Formats de fontes
Les fontes supportées par les navigateurs varient. Les formats de fontes les plus courants sont TrueType-OpenType (TTF) ou CFF-OpenType (OTF), leurs formats compressés Web Open Font Format (WOFF) ou EOT, et SVG Fonts (SVG). Les développeurs des principaux navigateurs se sont mis d'accord sur l'utilisation du format Web Open Font Format comme standard.
Le format EOT est le premier format dédié au Web, utilisable déjà dans Internet Explorer 6, mais il utilise des algorithmes de compression avancés limitant son utilisation sous réserve de licences. En 2010, ces restrictions seront levées lorsque le format est proposé comme format standard pour le Web[3]
Les formats de fontes TrueType ou CFF peuvent être utilisés comme fontes sur le Web et sont les mêmes que ceux utilisé pour les fontes numériques traditionnelles.
Le format WOFF, lui aussi dédié au Web, est développé comme format gratuit et ouvert, utilisant une compression relativement simple permettant de compresser les différents formats de fontes OpenType.
Les fontes SVG (SVG Fonts), défini comme sous-ensemble des spécifications SVG 1.1[4] en 2002, permettent d'utiliser des fontes en plusieurs couleurs[5] ou animées[6]. Les fontes SVG sont un format indépendant supporté en par la majorité des navigateurs, sauf IE et Firefox, et déprécié dans Chrome (et donc Chromium)[7]. Elles sont maintenant plus généralement dépréciées en faveur des différents formats OpenType (TrueType-OpenType, CFF-OpenType ou SVG-OpenType).
Les fontes SVG-OpenType, un nouveau format OpenType (donc inclus dans le Web Open Font Format) ou les contours de glyphes peuvent être représentés par le format SVG à la place de contours TrueType ou CFF[8],[9], est développée en 2011 en parallèle aux nouveaux formats OpenType à couleurs TrueType ou ceux basés sur les images. Firefox supporte le format SVG-OpenType, depuis la version 26.
Le format WOFF 2.0 présenté en 2014, est une amélioration de WOFF en proposant une meilleure compression des informations des fontes, et officialise le support des fonts SVG OpenType[10].
Jusqu’à maintenant, différents modèles de mise en marché ont été proposés aux concepteurs Web[11]. Dans le but de contrôler leur produit, la majorité des distributeurs ont pris sur leur compte d’héberger les fontes. Ainsi, le concepteur n’a jamais le fichier en sa possession. De même, ils offrent leurs services en forfaits. Les prix varient selon la durée de l’entente, le nombre de polices utilisées et l’achalandage sur les sites qui les affichent. D’autres ont plutôt choisi de distribuer chacune des familles de caractères à l’unité. L’hébergement est laissé aux soins de l’acheteur qui, une fois la vente effectuée, n’a plus à débourser pour cette fonte.
Grâce à ces progrès, les typographes doivent considérer le marché de la typographie à l’écran au même titre que celui de l’imprimé. Pour l’instant, les fontes disponibles en ligne sont majoritairement optimisées pour l’impression. Bien que plusieurs éléments de mise en page Web aient été empruntés au monde de l’édition, il reste plusieurs différences techniques à considérer lors de la création d’une fonte. Tout d’abord, le support n’est pas le même. Au lieu de choisir un papier ou une surface bien précise sur lequel le rendu sera uniforme, la fonte sera mise à l’épreuve à travers différentes résolutions et méthodes de rendu. D’un navigateur à l’autre, le lissage d’une police peut différer suffisamment pour changer l’esthétique d’un site. Pour Jason Smith de Fontsmith, ces complications ne sont pas un obstacle pour le développement de nouvelles polices car les principes de base restent les mêmes. « Ce qui nous importe, c’est la lisibilité et comment la lumière et les couleurs l’affectent et non le procédé d’intégration des fontes »[12]. Selon Colin Jenkinson de Cogapp, le vrai défi des prochaines années sera de renverser la culture qu’ont amenée les limitations et d’établir un nouveau standard de qualité en mettant en pratique les bons principes de la typographie[12].
Différents sites proposaient déjà des services d'hébergement de fontes depuis plusieurs années, comme le populaire Dafont, mêlant fontes à usage commercial payantes ou gratuites depuis 2000[13], le site de fontes libres et open sources Open Font Library depuis 2006 et le plus récent Font Squirrel (2009), dédié aux fontes libres de droit.
Depuis 2010, plusieurs compagnies offrent également des services d’hébergement de fontes, permettant d'inclure directement le téléchargement vers le poste utilisateur dans le CSS d'un site afin d'en améliorer la présentation sans avoir à héberger ces fontes. On peut citer parmi les plus gros acteurs de ce domaine, Google Fonts, Edge Web Fonts et Typekit d’Adobe, et enfin SkyFonts de Monotype. En pratique il est possible d'héberger directement les fontes sur le serveur servant les pages, l'avantage principal des services de CDN de fontes étant d'augmenter les chances d'utiliser les fontes déjà en cache dans le navigateur, étant utilisé par de nombreux sites.
Exemples de polices WOFF (ainsi que TTF, EOT et SVG) : police tifinagh (écriture touareg) (Hapax berbère) et une police latine d'aspect médiéval (Chantelli Antiqua). Ces deux polices qui ne sont probablement pas sur votre ordinateur devraient cependant s'afficher correctement avec la plupart des navigateurs relativement récents.
Wikiwand in your browser!
Seamless Wikipedia browsing. On steroids.
Every time you click a link to Wikipedia, Wiktionary or Wikiquote in your browser's search results, it will show the modern Wikiwand interface.
Wikiwand extension is a five stars, simple, with minimum permission required to keep your browsing private, safe and transparent.
