paint-brush
Comment choisir la police parfaite pour votre site Web et vos publicitéspar@lanamiro
582 lectures
582 lectures

Comment choisir la police parfaite pour votre site Web et vos publicités

par Lana Miro10m2023/02/15
Read on Terminal Reader

Trop long; Pour lire

La typographie est un élément essentiel de tout projet de conception graphique. Les polices peuvent améliorer l'apparence d'un site Web et influencer les émotions et l'humeur de ses utilisateurs. Il est crucial pour un graphiste de connaître la différence entre une police de caractères et une police. De nombreuses caractéristiques de police contribuent à la facilité avec laquelle les lecteurs peuvent décoder les symboles textuels.
featured image - Comment choisir la police parfaite pour votre site Web et vos publicités
Lana Miro HackerNoon profile picture

La typographie est un élément essentiel de tout projet de conception graphique. Les polices peuvent améliorer l'apparence d'un site Web et influencer les émotions et l'humeur de ses utilisateurs. C'est pourquoi il est essentiel de choisir la bonne police de caractères pour un site Web afin d'assurer le succès de la conception graphique.


Cependant, trouver la police parfaite pour un projet peut être un défi. La sélection de la bonne police peut prendre beaucoup de temps. Pour faire le bon choix, il y a quelques points à retenir.

Qu'est-ce qu'une police ?

La police de caractères et la police sont deux termes fréquemment utilisés pour désigner la même signification. En réalité, lorsque la plupart des gens disent police , ils font en réalité référence à une police de caractères . Il est crucial pour un graphiste de connaître la différence entre les deux.


Une police de caractères est un ensemble particulier de glyphes qui partagent des caractéristiques de conception communes, et elle peut être décrite comme une famille de polices avec la même conception sous-jacente.


Un exemple familier est la police de caractères Arial , qui comprend diverses polices qui diffèrent par la taille, le poids et d'autres caractéristiques, mais toutes sont basées sur des conceptions néo-grotesques sans empattement. Ainsi, Arial est une police de caractères, Arial Black 14 points est une police et Arial Regular 14 points est une police différente.

polices arial


Lors de la recherche de combinaisons de polices pour le site Web , n'oubliez pas qu'il est courant d'utiliser des polices appartenant à la même famille.


Pourquoi les polices sont-elles importantes ?

Avant de me livrer à une discussion sur les diverses caractéristiques des polices qui rendent les polices adaptées à différents contextes, décrivons les objectifs de toutes les conceptions de typographie.

Fournir de la lisibilité

La lisibilité du site Web mesure la facilité avec laquelle les visiteurs peuvent lire et comprendre les documents écrits.


Il existe trois types de facteurs contribuant à la lisibilité :


  • les attributs personnels du lecteur (déficiences visuelles et autres facteurs de santé);
  • ce qu'il y a dans le texte (engagement du sujet, grammaire appropriée, complexité de la syntaxe) ;
  • la typographie (le choix de la police de caractères et de ses cadres, c'est-à-dire les polices).


La lisibilité est inévitablement liée mais ne doit pas être confondue avec lisibilité .


La lisibilité est une caractéristique de conception de la police de caractères qui garantit que chaque caractère se distingue des autres. De nombreuses caractéristiques de police contribuent à la facilité avec laquelle les lecteurs peuvent décoder les symboles de texte et, par conséquent, à la lisibilité globale du texte, et nous en discuterons plus en détail plus loin dans l'article.


Les versions très décorées des polices de caractères donnent beaucoup de personnalité à une marque, mais elles sacrifient considérablement la lisibilité du texte.


C'est pourquoi ils sont principalement utilisés pour créer de grands formats autonomes, tels que des logos, des bannières, des imprimés de t-shirts et des en-têtes. N'oubliez pas que la typographie a été créée pour transmettre des messages, donc, dans la plupart des cas, la lisibilité passe avant la conception.


Dénoter les hiérarchies de texte

Une hiérarchie typographique permet de concevoir des divisions hiérarchiques pour diriger les consommateurs vers certains types d'informations en utilisant différentes polices et en créant différentes dispositions de texte.


Le moyen le plus simple d'utiliser la hiérarchie typographique consiste à utiliser différentes tailles de police pour différentes parties de texte : le plus petit type est souvent utilisé pour le contenu du corps, tandis que le plus grand type est utilisé pour les titres et les en-têtes. D'autres méthodes pour distinguer différentes sections d'informations incluent les puces, les espaces blancs, les couleurs de police, etc.


Parce qu'il existe de nombreuses options pour créer des éléments de données visuellement différents, une hiérarchie typographique ne doit pas nécessairement être une solution unique. Utilisez-le plutôt pour créer des conceptions originales qui conviendront le mieux à votre projet tout en augmentant la lisibilité du site Web.


hiérarchie typographique (Source : https://uxcel.com/blog/beginners-guide-to-typographic-hierarchy)


L'une des tâches les plus importantes du concepteur consiste à organiser efficacement le contenu d'une page Web afin qu'il soit facile à consulter. Étant donné qu'une grande partie des données que les concepteurs traitent sont basées sur du texte, il est essentiel d'apprendre comment différents facteurs contribuent à la construction d'une hiérarchie.

Améliorez la navigation sur le site

Si vous avez déjà créé une hiérarchie typographique efficace sur une page, c'est-à-dire paramétrer plusieurs niveaux de hiérarchie, choisir type de police, taille, couleur, etc., pour différencier tous les types de contenus, veillez à appliquer la même méthode partout sur le site .


Lorsque les utilisateurs accèdent à votre plateforme pour la première fois, ils doivent déterminer où se trouvent les outils de navigation , comment le contenu le plus important est indiqué, de quelle couleur sont les liens, etc. Si vous gardez ces aspects cohérents sur toutes les pages du site Web, vous créerez une meilleure expérience utilisateur pour vos lecteurs.

Créer une marque commerciale

Une police est un élément crucial de l'image de marque d'un site Web, qui a un impact considérable sur la façon dont les utilisateurs voient votre site Web. La perception d'une marque par les consommateurs peut être positivement influencée par l'utilisation par son logo de composants typographiques fins, et les descriptions de produits peuvent être rendues plus attrayantes en utilisant des combinaisons de polices esthétiques.

Une typographie efficace retient l'attention des lecteurs sans les distraire de l'essence du contenu. Non seulement cela peut rendre votre site Web plus distinctif, mais cela incite également les visiteurs à commencer à associer votre marque à la police de caractères utilisée sur votre site. À une époque où les utilisateurs accèdent chaque jour à des dizaines de ressources Internet, vous ne pouvez pas trop insister sur la valeur d'une image de marque forte et sur le rôle des polices dans sa création.

Transmettre des humeurs et des émotions

Lors du choix des polices, il est important de se rappeler que l'apparence des caractères peut affecter la perception du contenu par le lecteur. L'une des fonctions de la typographie est de connecter les consommateurs avec le texte à des niveaux émotionnels. Tout comme nous mettons en majuscule toutes les lettres lors d'une conversation pour désigner un cri, différentes polices créent une ambiance et des émotions.


Chaque police a sa propre voix, et bien qu'il soit souvent facile de différencier l'ambiance qu'une police particulière tente de transmettre (en particulier lors de la comparaison de plusieurs polices de caractères), la plupart des gens ne peuvent pas expliquer pourquoi ils ressentent des émotions différentes lorsqu'ils voient différents modèles de lettres.


Une explication trop simplifiée qui n'a pas beaucoup de sens vous dira que nous traitons les polices et les polices de caractères un peu comme nous traitons les stéréotypes . Par conséquent, nous percevons certaines émotions inconsciemment.


Cette réponse n'est pas d'une grande aide pour les concepteurs de sites Web qui doivent être confiants lors de la sélection des polices pour les sites Web afin d'évoquer l'humeur et les émotions souhaitées des lecteurs.


Dans la section suivante, j'examinerai les caractéristiques des polices et leur utilisation pour mieux comprendre quelles polices doivent être utilisées dans quelles conditions.

Principales caractéristiques des formulaires et leur utilisation

En travaillant avec le subconscient, les polices jouent un rôle essentiel dans la formation des humeurs et des émotions des téléspectateurs avant même qu'ils ne commencent à lire. Le nombre de polices disponibles est pratiquement infini, ce qui facilite la création de designs uniques. Cependant, choisir les polices appropriées peut devenir compliqué, surtout si vous ne savez pas par où commencer.


Cette section explique quelles caractéristiques de police rendent les polices mieux adaptées à un contexte ou à un autre.

Lester

Le poids fait référence à l'épaisseur des traits de caractères dans n'importe quelle police. Rendre les lettres plus grasses ou plus fines est un moyen facile de créer une hiérarchie de texte. Les poids de police légers , normaux et gras sont les trois catégories principales, les types de police normaux étant les plus populaires pour la lecture. Les types légers et audacieux transmettent plus d'émotions, telles que la délicatesse et la fragilité d'un côté contre la force et la grossièreté de l'autre.


Les styles de police ultra-fins sont populaires dans l'industrie des cosmétiques et de la beauté car ils transmettent la sensation de soin, de légèreté et de sensibilité. Les caractères gras (en particulier les polices dites noires, qui contiennent encore plus de poids) ne sont pas faciles à lire et sont principalement vus dans des phrases courtes pour la publicité, les jeux ou le show business.

poids de la police (Source : https://medium.com/@ltm/typography-part-1-3c3c98211b5)

Largeur

Comme pour le poids, la largeur est une caractéristique facilement identifiable qui affecte fortement la vitesse de lecture. Les polices condensées occupent moins d'espace horizontal que leurs homologues non condensées et apparaissent lorsqu'il est nécessaire de faire tenir beaucoup de texte dans une petite zone.

Ces polices sont souvent utilisées comme titres d'une ligne dans des colonnes étroites de style journal où vous ne pouvez pas utiliser une police de largeur normale.

Les polices étroites procurent une sensation d'oppression et peuvent même mettre les lecteurs mal à l'aise. Ils ne sont pas faciles à lire car les lignes horizontales des glyphes sont réduites et il est difficile de différencier un caractère d'un autre.


Les styles de police étendus font que même les mots courts paraissent longs et les lecteurs ont tendance à les lire plus lentement. Les mots deviennent plus mémorables et attirent une attention significative. Parce que ces polices utilisent plus de lignes horizontales, elles sont parfaites pour créer des logos et des phrases pour des bannières destinées à être lues sous un angle.

exemple de conception de police étendue (Source : https://commons.wikimedia.org/wiki/File:Logo_Oreo_alt.svg)

Serifs et dalles

Les lignes courtes qui traversent les extrémités des traits dans les lettres sont appelées empattements, et les polices qui utilisent des empattements sont des polices empattées . Pas d'empattement - sans empattement.

Le type Serif a été la première police de caractères créée.

UN théorie populaire dit que dans l'Empire romain, les lettres étaient d'abord peintes sur des pierres avec des pinceaux, puis les ouvriers ciselaient la pierre en suivant des marques de pinceau qui s'évasaient au début et à la fin de chaque ligne, formant des empattements.


Même les petits empattements augmentent le contraste entre les lettres, rendant les polices plus lisibles. C'est pourquoi les polices serif sont populaires dans les grands ouvrages scientifiques et littéraires, en particulier pour les textes imprimés, où la netteté de l'encre peut se dégrader avec le temps.


Étant présentes depuis si longtemps, les polices serif sont une option polyvalente et sûre offrant beaucoup de personnalité et de caractère. Ils donnent une impression d'intemporalité et de tradition à de nombreuses grandes marques dans leurs logos et sont particulièrement populaires dans le journalisme, le droit, la joaillerie, la mode et le cinéma.

polices serif, sans serif et slab serif (Source : https://atelierlks.com/how-to-choose-the-perfect-font-for-your-brand/)


Par rapport aux polices Serif, les polices sans empattements offrent un look moderne et sont favorisées par des designs minimalistes. Ils sont fréquemment employés par des entreprises de technologie, de jeu et d'automobile.


Les empattements deviennent des dalles lorsqu'ils sont droits, rectangulaires et ont la même épaisseur que les traits principaux du caractère. Les polices Slab serif semblent robustes et fiables et ont un aspect naturel sur les sols des usines, les magasins d'outils électriques, les steakhouses et d'autres industries "viriles".

Polices italiques et obliques

Italique et oblique sont deux termes liés mais distincts décrivant les polices angulaires.


Les concepteurs de caractères créent des types de polices italiques pour ressembler à la calligraphie manuscrite ; historiquement, leur but est de mettre en évidence le texte. En raison de l'inclinaison, ces polices ont moins de lignes verticales et des courbes plus élégantes, offrant un ton élégant et agréable. Les polices italiques ou manuscrites transmettent des sentiments personnels et apparaissent dans les salutations et les lettres d'invitation.


Les types de police obliques (parfois appelés faux italique ) apparaissent en obliquant les lettres verticales d'une police de caractères existante. La plupart des polices de caractères modernes incluent des polices obliques aux côtés d'autres types de visage. Ils mettent en évidence des parties du texte et y ajoutent parfois une sensation de rapidité. Les concepteurs signalent que les sans empattements obliques ne ressortent pas autant dans le texte que les empattements obliques.

polices obliques italiques régulières


Contraste

Le contraste de la police est une différence de largeur entre les traits fins et épais d'un caractère. Les polices avec des contrastes moyens et faibles sont préférables pour une lecture longue et n'évoquent pas nécessairement une humeur ou des émotions.


Les polices à poids unique (avec des traits uniformes) ont de bonnes qualités de lisibilité. Ils ont moins de rapport avec l'écriture manuscrite avec des traits irréguliers, ajoutant un sentiment de modernisme et d'industrialisme aux textes.


Les polices à contraste supplémentaire héritent des caractéristiques des polices Classicism. La différence entre les traits fins et épais crée une sensation de dramatisme et permet la création d'en-têtes élégants tout en sacrifiant une certaine lisibilité.

X-hauteur

La hauteur x, ou taille du corps, est la hauteur des lettres minuscules par rapport aux lettres majuscules. Les polices avec de petites tailles de corps (où la hauteur des lettres minuscules est plus de deux fois plus petite que celle des majuscules) offrent un grand contraste entre les lettres d'une police, ce qui permet aux yeux de sauter facilement au début de chaque phrase. Ces polices exigent plus d'espace entre les lignes de texte. Comme ils semblent plus expressifs, ils sont parfaits pour lire des poèmes et des compositions musicales.


Au contraire, les polices avec de grandes hauteurs x produisent des textes uniformes, procurant une sensation de stabilité. Ils permettent également d'insérer plus de lignes de texte dans un espace donné.

x-height en typographie (Source : https://medium.com/8px-magazine/practical-guide-to-font-pairing-da58b9bcd42b)

Coins

Les intersections de lignes droites en lettres forment des coins avec des arêtes vives. Arrondir ces bords fait une énorme différence dans la perception d'une police formant des associations avec des surfaces lisses et agréables au toucher. Les formes arrondies sont également plus répandues dans la nature, il semble donc normal que les polices aux coins arrondis soient populaires dans les industries de l'alimentation et des produits pour bébés.

police avec coins arrondis (Source : https://www.dunkin.co.uk/)

D'autre part, les arêtes vives peuvent exprimer une tension et même un inconfort. Les polices avec une netteté exagérée sont populaires pour créer toutes sortes de logos, et elles sont le choix numéro un pour les groupes de métal.

police tranchante pour les métalleux

Conseils pour choisir la bonne police pour votre conception

Choisir des polices pour votre site Web peut être compliqué pour les concepteurs non formés. Maintenant que vous vous êtes familiarisé avec les principaux éléments de police, vous pouvez mieux analyser les polices et sélectionner celles qui vous conviennent. Voici quelques conseils supplémentaires à prendre en compte :


  • Pensez à la personnalité. Vous souhaitez que votre site paraisse sérieux, ludique, hi-tech ou élégant ? Définissez les attributs de police qui reflètent les caractéristiques de votre site et commencez à rassembler les polices de caractères appropriées.
  • Ne sautez aucune des fonctions principales de la police. Par exemple, n'utilisez pas de polices de caractères décoratives difficiles à lire pour de gros morceaux de texte et évitez les conceptions neutres qui ne transmettent aucun charisme. De plus, des polices inhabituelles peuvent distraire les lecteurs, le choix des polices est donc toujours une question d'équilibre.
  • Gardez le nombre de polices au minimum. L'utilisation de plus de trois polices sur un site Web donne l'impression qu'il n'est pas structuré et qu'il est difficile de se concentrer dessus.
  • N'utilisez pas de polices similaires sur un projet. En utilisant différentes polices, vous pourrez créer une diversité visuelle et un design plus intéressant.
  • Choisissez une famille de polices étendue. Lorsque vous trouvez une police que vous aimez, consultez les autres polices de la famille. Voyez à quoi ressemblent les caractères dans différentes tailles, épaisseurs et autres polices.

Le choix des polices et la création de conceptions graphiques peuvent être difficiles et prendre du temps. Mais j'espère que cet article vous a aidé à vous plonger dans les bases du choix de la bonne police. 😉