L'importance de la typographie sur le Web

Faites attention à la lisibilité

Cela t'es déjà arrivé? Regarder très près de l'écran parce que la police est si petite ? Je me retrouve souvent à zoomer sur des pages Web parce que je ne peux pas lire le texte. C'est extrêmement ennuyeux.

La lisibilité du texte sur votre site Web ou votre communication en ligne joue un rôle déterminant dans la façon dont les gens le lisent. Ce n'est pas seulement votre choix de mots - une police de caractères standard appropriée a également un rôle important à jouer à cet égard. La taille de la police, la longueur des lignes et l'interligne affectent également la lisibilité de votre texte.

La typographie en ligne et imprimée n'est pas la même

Lorsque je suis passé de l'imprimé à l'en ligne, je dois admettre qu'il m'a fallu un certain temps pour m'habituer au fait que tout sur le Web peut être légèrement plus grand. J'ai commencé dans le monde des journaux, où une taille de police de 9 ou 10 px est tout à fait normale pour le corps principal du texte. Je me souviens encore de ma première publication en ligne : une taille de police énorme pour le rubriques et une petite police pour le corps principal du texte. C'était complètement une mauvaise idée. Le corps du texte principal aurait dû être deux fois plus grand, au moins 16 px. Et, bien sûr, les titres pourraient aussi être plus subtils. Au début, je trouvais ça bizarre, mais maintenant je m'y suis totalement habitué.

Il y a une logique derrière cela car les proportions sont très différentes sur le web. Pensez-y : vous vous asseyez souvent plus loin de votre écran qu'un journal, brochureou magazine. Dans une publication Web, vous avez donc besoin d'une taille de police plus grande, car la distance rend la police plus petite. Mais ce n'est pas tout. La longueur des lignes est également importante, tout comme l'espacement des lignes. Mais comment décidez-vous de la taille de police, de la longueur de ligne et de l'espacement idéaux ? Je pense que cela varie selon les polices car elles diffèrent pas mal au niveau de leurs dimensions. Je ne sais pas s'il existe un idéal lignes directrices, mais après avoir fait quelques recherches, j'ai trouvé la liste suivante

importance de la typographie web

Directives typographiques

Taille de la police : 16 pixels ou plus
Longueur de ligne : 45 à 75 caractères
Interligne : 1.4 fois la taille de la police

Les tailles ci-dessus sont des tailles moyennes, mais si votre police est petite ou étroite, vous devriez vous sentir libre d'opter pour un pixel plus haut.

Fluidité de traitement : attractive ou lisible ?

Temps pour un peu de science. Notre cerveau est sensible aux changements dans un message. Vous pensez peut-être que je fais référence à votre choix de vocabulaire, mais la police que vous choisissez joue également un rôle important. Si vous voulez encourager votre lecteur à continuer à lire, assurez-vous d'utiliser la bonne police. La fluidité du traitement, c'est-à-dire la facilité avec laquelle notre cerveau traite l'information, est extrêmement importante à cet égard. Choisir une bonne police pour votre travail en ligne peut sembler une banalité, mais cela affecte en réalité notre façon d'agir, même si nous n'en sommes pas conscients.

Une police a une influence sur la lisibilité du texte. Par exemple, les polices faciles à lire comme Helvetica et Verdana peuvent être traitées en une fraction de seconde. On ne peut pas en dire autant des polices plus créatives (comme les styles manuscrits) qui sont plus difficiles à lire.

Mais le choix d’une police créative et manuscrite a en réalité un autre impact positif sur la lisibilité d’un texte. Cela apparaît comme plus personnel et rend le sens du message plus crédible. Alors faut-il opter pour un format attractif ou lisible ? Choisissez le meilleur des deux mondes – en d’autres termes, une police claire et lisible comme Arial, Helvetica ou Verdana et intercalez-la avec des polices créatives, de manière Devis, Par exemple.

"Une citation peut fournir un endroit où se reposer dans le texte."

Mais cela ne commence même pas à explorer toutes les différentes polices que vous pourriez utiliser ! L'émergence d'outils tels que Typekit et Google Fonts signifie désormais que d'innombrables nouvelles polices Web ont commencé à apparaître aux côtés des polices classiques. Elles ont tendance à être un peu plus fraîches que les polices classiques, donnant à votre publication ou site Web un aspect légèrement plus léger.

L'installation de l'outil Skyfonts pour Windows ou Mac OSX permet de télécharger des polices Web à partir de Google Fonts en un clic de souris. Il est facile d'ajouter des polices en cliquant sur le signe plus et elles seront soigneusement stockées dans l'outil. L'avantage ultime de Skyfonts est qu'après leur installation, vous pouvez utiliser les polices immédiatement dans les projets sur lesquels vous travaillez. Vous connaissez probablement le problème : si vous installez une nouvelle police séparément, vous devez commencer par la rechercher dans les téléchargements avant de l'ouvrir dans votre bibliothèque de polices et de l'enregistrer. Il y a aussi le problème de devoir enregistrer séparément toutes les versions régulières, en gras et en italique, alors qu'avec Skyfonts, vous pouvez enregistrer des familles de polices complètes qui fonctionnent immédiatement. Qu'est-ce qui pourrait être mieux? Il y a l'avantage supplémentaire que les sites Web Fonts.com, Linotype, Monotype et My Fonts sont tous affiliés à Skyfonts, ce qui vous permet également d'ajouter des polices payantes.

Attention à vos mots !

les mots comptent

Enfin, votre choix de mots compte. Nous n'avons probablement pas besoin de vous le dire, mais tout le monde ne s'assure pas que les textes qu'ils écrivent sont réellement adaptés au lecteur cible. Vous devriez adopter un style plus léger pour les jeunes lecteurs, mais être plus élaboré lorsque vous vous adressez à des lecteurs plus âgés qui ont besoin de plus de profondeur. Gardez à l'esprit votre public cible, car ce sont les personnes que vous souhaitez attirer. Si vous réussissez, le lecteur est susceptible de revenir pour plus.

Tenez compte de votre conception réactive

Vous avez sans doute remarqué qu'un changement est en cours dans la conception Web, à la suite de quoi presque toutes les productions, sites Web et autres choses sur le Web sont devenues sensible. Cela signifie que tout le contenu d'une page se redimensionne, ce qui lui permet également d'être visualisé aussi bien sur votre tablette que sur votre smartphone. Cela a des répercussions sur la typographie dans une conception Web et signifie que vous devez tenir compte des couleurs, des polices et des tailles de police. Créer un design réactif est important, mais prend du temps à réaliser.

Avec l'outil Foleon, il est facile de l'appliquer dans votre publication en ligne. Comme il est possible d'adapter les couleurs, les types de police et les tailles de police pour mobile dans le style de thème général ainsi que le style de page et le style d'élément au niveau de la page, vous pouvez définir vos pages comme réactives en un rien de temps.

Vous aimerez aussi:

Auteur bio

Ritesh SheombarRitesh est un responsable du marketing numérique avec des années d'expérience dans la stimulation de la croissance. Il est actuellement directeur de inbound marketing à Foléon. Vous pouvez en savoir plus sur lui sur son Profil LinkedIn.

Maîtrisez l’art du marketing vidéo

Des outils basés sur l'IA pour Créez, optimisez et amplifiez !

  • Stimuler la créativité: Libérez les idées vidéo, les scripts et les accroches les plus efficaces avec nos générateurs d'IA.
  • Optimiser instantanément: améliorez votre présence sur YouTube en optimisant les titres, les descriptions et les balises des vidéos en quelques secondes.
  • Amplifiez votre audience: Créez sans effort des médias sociaux, des e-mails et des textes publicitaires pour maximiser l'impact de votre vidéo.