Leçon 7Polices de caractères, couleurs et durabilité sur le Web
- Notion 41 - Types de polices.
- Notion 42 - Impact de la police sur le chargement de la page.
- Notion 43 - Choix de polices pour l'accessibilité et la durabilité.
- Notion 44 - Palettes de couleurs éco-énergétiques.
- Notion 45 - Trouvez un équilibre entre efficacité énergétique et palette de couleurs accessibles.
- Notion 46 - Révision/évaluation
Notion 43
Choix de polices pour l'accessibilité et la durabilité.
Compétences ciblées
Découvrez la liste des polices les plus populaires et leurs principales caractéristiques.
Dans l'une des notions précédentes (41), nous avons vu quelques exemples des polices web les plus populaires.
Dans cette notion, nous vous fournissons la liste des polices système les plus courantes.
Polices système
- Georgia est une police Serif, ce qui signifie que les lettres ont la particularité d'être à empattement. "Cette police a été créée pour Microsoft afin d'assurer une bonne visibilité sur les écrans à faible résolution. Elle est donc facile à lire aussi bien sur un ordinateur que sur un appareil mobile.
- Helvetica est une police sans empattement. Elle est plus moderne que celles à empattement. Elle est également considérée comme l'une des polices les plus faciles à lire.
- L'Open Sans est particulièrement lisible en raison de l'espacement entre les lettres, également appelé "crénage".
Selon Google, "elle est superbe sur le Web, ainsi que sur les imprimés et les interfaces mobiles, et sa lisibilité est excellente grâce à la forme de ses lettres".
- Quicksand est une police sans empattement créée par Google, basée sur des formes géométriques. Elle a la particularité d'être très lisible sur les appareils mobiles.
- Verdana, spécialement créée pour les écrans d'ordinateur, fait partie de la catégorie des polices sans empattement. Elle est à utiliser de préférence si votre site contient beaucoup de texte.
Quelques autres exemples de polices web et de polices web personnalisées
- Rooney est considérée comme une police personnalisée. Selon Jan Fromm, son créateur, "ses formes arrondies et ses courbes délicates donnent une impression de proximité et de douceur".
- Karla est l'une des polices dites "sans Serif", caractérisée par sa simplicité. Google l'a qualifiée de "populaire et excentrique".
- Roboto est décrite comme "audacieuse, moderne et accessible". Créée par Google pour son système d'exploitation Android. Également utilisé par Chrome.
- Ubuntu est décrit comme ayant un style "humaniste".
- Lato est décrite comme conviviale, solide, fiable et stable. Elle est considérée comme la police de choix pour la conception de sites Web professionnels.
- Futura est considérée comme une police propre et pure et assure une bonne lisibilité.
Quelques conseils pour une conception durable des polices
Afin de limiter l'empreinte carbone de votre site web, voici quelques paramètres à prendre en compte lors de la conception de la police :
- Privilégiez les polices dites standard, qui sont celles installées par défaut avec les systèmes d'exploitation, par opposition aux polices spéciales. Les polices standard les plus courantes sont Arial, Verdana, Times New Roman ; Georgia ; Tahoma, etc.
- Si vous choisissez d'utiliser des polices spéciales, utilisez-les pour les titres ou le menu du site ;
- Limitez le nombre de variantes ;
- Supprimez les caractères inutiles ;
- Et compressez au format WOFF2. Il vous permettra de réduire le poids de la police d'au moins 30%.