Comment choisir la famille de polices à utiliser pour la conception Web

Regardez n'importe quelle page Web en ligne aujourd'hui, quelle que soit la taille du site ou le secteur auquel elle est destinée, et vous verrez qu'une chose qu'elles partagent toutes est le contenu textuel.

L'un des moyens les plus simples d'affecter la conception d'une page Web consiste à utiliser les polices que vous utilisez pour le contenu textuel de ce site. Malheureusement, de nombreux concepteurs de sites Web en début de carrière deviennent un peu fous en utilisant trop de polices sur chaque page. Cela peut créer une expérience confuse qui semble manquer de cohésion de conception. Dans d'autres cas, les concepteurs essaient d'expérimenter avec des polices virtuellement illisibles, en les utilisant simplement parce qu'elles sont « cool » ou différentes. Ce sont peut-être des polices sympas, mais si le texte qu'elles sont censées transmettre ne peut pas être lu, alors le "la fraîcheur" de cette police s'estompera lorsque personne ne lira ce site Web et partira à la place pour un site qu'ils peuvent traiter!

Quelques règles de base

1. N'utilisez pas plus de 3 à 4 polices sur une même page. Rien de plus que cela commence à sembler amateur - et même 4 polices peuvent être trop nombreuses dans certains cas !
2. Ne pas changer la police au milieu d'une phrase, sauf si vous avez une très bonne raison.
3. Utilisez des polices sans empattement ou des polices avec empattement pour le corps du texte afin de faciliter la lecture de ces blocs de contenu.
4. Utilisez des polices à espacement fixe pour le texte de la machine à écrire et le bloc de code pour distinguer ce code de la page.
5. Utilisez des polices script et fantasy pour les accents ou les gros titres avec très peu de mots.

N'oubliez pas que ce ne sont que des suggestions et non des règles strictes. Cependant, si vous envisagez de faire quelque chose de différent, vous devez le faire avec intention, et non par accident.

Les polices sans empattement sont la base de votre site

Polices sans empattement sont ces polices qui n'ont pas de "empattements” - le traitement de conception peu ajouté sur les extrémités des lettres.

Si vous avez suivi des cours de conception d'impression, on vous a probablement dit que vous ne devriez utiliser les polices serif que pour les titres. Ce n'est pas vrai pour le web. Les pages Web sont destinées à être consultées par navigateurs Web sur les écrans d'ordinateur et les appareils mobiles et les moniteurs et écrans d'aujourd'hui sont assez bons pour afficher clairement les polices serif et sans-serif. Certaines polices à empattement peuvent devenir un peu difficiles à lire dans des tailles plus petites, en particulier sur les écrans plus anciens, vous devez donc toujours soyez conscient de votre public et assurez-vous qu'il peut lire les polices serif avant de prendre la décision de les utiliser pour votre corps texte. Cela étant dit, la plupart des polices à empattement d'aujourd'hui sont conçues pour la consommation numérique et elles fonctionneront bien comme corps de texte tant qu'elles sont définies sur une taille de police raisonnable.

Voici quelques exemples de polices sans empattement:

• Arial
• Genève
• Helvetica
• Lucida Sans
• Trébuchet
• Verdana

Utilisez les polices Serif pour l'impression.

Bien que les polices serif puissent être difficiles à lire en ligne pour les écrans plus anciens, elles sont parfaites pour l'impression et bonnes pour les titres des pages Web. Si tu as imprimable versions de votre site, c'est l'endroit idéal pour utiliser des polices serif. Les empattements, en version imprimée, facilitent la lecture, car ils permettent aux gens de différencier plus clairement les lettres. Et parce que l'impression a une résolution plus élevée, elle peut être vue plus clairement et ne semble pas se brouiller.

Quelque exemples de polices serif sont:

• Garamond
• Géorgie
• Fois
• Times New Roman

Les polices à espacement fixe occupent le même espace pour chaque lettre

Même si votre site ne concerne pas l'informatique, vous pouvez utiliser le monospace pour fournir des instructions, donner des exemples ou impliquer du texte dactylographié. Les lettres à espacement fixe ont la même largeur pour chaque caractère, elles occupent donc toujours le même espace sur la page. Les polices à espacement fixe fonctionnent particulièrement bien pour les exemples de code.

Les machines à écrire utilisaient généralement des polices à espacement fixe, et leur utilisation sur votre page Web peut vous donner l'impression de ce contenu dactylographié.

Voici quelques exemples de polices à espacement fixe:

• Courrier
• Courrier Nouveau
• Console Lucide
• Monaco

Les polices Fantasy et Script sont difficiles à lire

Les polices de fantaisie et de script ne sont pas aussi répandues sur les ordinateurs et, en général, peuvent être difficiles à lire en gros morceaux. Bien que vous puissiez aimer l'effet d'un journal ou d'un autre dossier personnel que l'utilisation d'une police cursive pourrait donner, vos lecteurs pourraient avoir des problèmes. Cela est particulièrement vrai si votre public comprend des locuteurs non natifs. De plus, les polices fantastiques et cursives n'incluent pas toujours des caractères accentués ou d'autres caractères spéciaux qui limitent votre texte à l'anglais.

Utilisez des polices fantastiques et cursives dans les images et comme titres ou légendes. Gardez-les courts et sachez que quelle que soit la police que vous choisissez ne sera probablement pas sur la majorité des ordinateurs de vos lecteurs, vous devrez donc les fournir utiliser des polices Web.

Voici quelques exemples de polices fantastiques:

• Plaque de cuivre
• Desdémone
• Impacter
• Kino

Voici quelques exemples de polices de script:

• Pomme Chancellerie
• Bande dessinée sans MS
• Écriture Lucida