13mn de lecture
La typographie est souvent négligée sur un site internet, ce qui est une erreur coûteuse. En effet, les choix au niveau de la typographie peuvent faire ou défaire la réputation de votre site internet.Comment utiliser les bonnes typographies sur votre site Web ?
Considérons par exemple que les choix de polices de haute qualité peuvent augmenter la lisibilité mais vous permettre aussi de retenir l’attention de vos lecteurs.
Dans cet article, nous allons d’abord expliquer certains termes typographiques de base afin que vous soyez familiarisé avec. Ensuite, nous allons nous plonger dans les trois actions fondamentales que vous devez prendre en compte pour améliorer la typographie de votre site web et vous montrer les démarches a effectuer.
Ce que vous devez savoir sur la typographie
Etant donné que nous allons explorer plusieurs techniques pour améliorer la typographie de votre site, il est logique de vous présenter quelques termes typographique de base.
Nous allons faire un effort pour éviter les termes trop techniques.
Police et type de famille
Beaucoup de personnes utilisent ces termes, mais il existe une subtile différence. Lors de la conception d’un site Web, une police est techniquement un fichier qui génère un ensemble de caractères dans une police de caractères, alors que le type de famille fait référence aux variations qui conservent un style similaire (par exemple en italique, en gras).
Suivi
Suivi fait référence à l’espace entre les caractères. Par exemple, lorsque vous justifiez un paragraphe pour donner à ces lignes, une longueur uniforme, vous le faite en augmentant le suivi entre les lettres.
Kerning
Kerning fait référence aux distances entre chaque lettre. Il est généralement utilisé pour faire de tel sorte que l’espace entre deux caractères soit compatible avec l’espacement d’une autre paire, dans une police différente.
Ligne de base
La ligne de base est la ligne imaginaire sur lequel votre texte est assis.
Le premier plan
Le premier plan fait référence aux distances entre les lignes de base.
3 façons clés pour améliorer la Typographie sur votre site Web
Bien que la typographie soit un sujet ésotérique, suivant les meilleures pratiques du Web, cela reste relativement simple. Tant que vous suivez les pratiques de base ci-dessous, vous y arriverez.
1. Choisissez la bonne Police
Quand nous parlons de choisir la police parfaite, on se réfère à une police pouvant compléter le style de votre site Web.
Notre blog, par exemple, traite de sujets techniques. Il serait malvenu d’y mettre une police gothique, ce qui irait à l’encontre de l’esthétique de notre blog. Nous avons choisi de ce fait, quelque chose de plus propre et de plus lisible.
Vous pourriez être enclin à penser que le choix de la police n’a pas d’importance tant que cela reste lisible. Malheureusement, c’est une erreur, une nouvelle police peut réviser complètement la sensation d’un site Web.
Le choix de la police parfaite résultera essentiellement de vos propres goûts, mais aussi de certains facteurs à prendre en compte :
- Lisibilité : Votre police doit être facilement lisible, à la fois en petite et en grande taille. Afin de tester, exécutez votre police sur différents navigateurs et appareils.
- Compatibilité : La plupart des sites internet emploient plus d’une police. Assurez-vous que les différentes polices vont bien ensemble. La cohérence est essentielle
- La créativité : Ne pas avoir peur de briser le moule si vous trouver une police fonctionnant bien. Internet a déjà beaucoup de sites internet utilisant la police Helvetica. N’hésitez pas à changer pour une autre, tout en restant éloigné de la police Comic Sans qui est trop utilisée.
2. Mettre en place une hiérarchie visuelle
En ce qui concerne la typographie, une hiérarchie visuelle fait référence à un structure globale. Considérez cet article comme un exemple – il est décomposé en plusieurs sections séparées par des sous-positions, mais tous les sous-titres ont égaux. Certains sont plus grand que les autres, ce qui permet de structurer notre article.
La plupart du temps, nous ne remarquons pas la hiérarchie visuelles sur le Web, mais elle rend l’expérience du visiteur plus agréable. Une hiérarchie visuelle solide permet de trouver les informations dont vous avez besoin plus rapidement.
Il n’y a aucun inconvénient à la mise en oeuvre d’une hiérarchie visuelle logique et typographique. Il existe plusieurs méthodes qui peuvent être utilisés comme :
- Taille : Ceci est la façon la plus simple d’établir une hiérarchie visuelle. Les lecteurs seront attirés par les textes de grandes tailles. La taille doit permettre de désigner des informations critiques et de nouvelles sections dans votre article.
- Couleur et contraste : Les différences de couleur et de contraste servent le même but et attirent le regard.
- Texture : Quand on parle de “texture” dans la typographie, nous faisons référence à des variations visuelles telles que le gras et l’italique. Les deux types sont toujours la même police, mais leurs différences visuelles permettent de différencier le contenu avec facilité.
3. Optimiser les paragraphes
Cette dernière technique est moins “flashy” que ses deux prédécesseurs mais reste très important.
Vous pourriez être surpris d’appendre qu’il y a une longueur de ligne optimale à respecter afin de maximiser la lisibilité. Bricoler avec la longueur de vos paragraphes peu sembler superflu, mais il peut faire la différence.
Si vos paragraphes sont trop grand, les visiteurs pourraient perdre la trace de l’endroit où ils commencent et se terminent. D’autre part, si le paragraphe est trop court, les yeux voyageront trop souvent au début de la ligne suivante. Chacune de ces options rend l’expérience de lecture plus inconfortable que prévu.
La recherche nous a montré que la mesure de l’alinéa idéal repose sur 45 à 90 caractères par ligne maximum. Il ne vous reste plus qu’à mettre en oeuvre cette mesure dans vos conceptions pour améliorer considérablement leur lisibilité.
Typographie site web, pour conclure
Beaucoup de personnes ont tendance à négliger la typographie. Vous n’avez pas besoin d’être un expert dans le domaine, il vous suffit de suivre nos quelques conseils :
- Choisissez la bonne police pour votre site
- Mettez en oeuvre une hiérarchie visuelle
- Optimisez vos mesures de paragraphes
