Meilleures polices pour améliorer l'expérience de lecture

Je construis un site Web dont le but principal est de servir du contenu (législatif) et je veux donner la meilleure expérience de lecture aux utilisateurs. Vous pouvez jeter un oeil à la page d'exemple à:

http://iura.cl/cc/44

Comme vous pouvez le voir, j'ai supprimé tout ce qui, en ce moment, j'utilise la police Web Telex. J'ai également une option pour la lecture de nuit qui devrait réduire l'éblouissement:

http://iura.cl/cc/44?estilo=nocturno

Je me demande ce que je dois considérer à propos de la police que je choisis pour m'assurer qu'elle est lisible, s'il y a un guide à respecter?

En fait, il existe des principes assez simples si votre critère numéro un est une police à haute lisibilité pour un site Web .

1. Pensez mainstream. Merci à @font-facevous pouvez choisir parmi des milliers et des milliers de polices - mais les polices moins populaires ou plus récentes ont souvent des problèmes de rendu entre les navigateurs et les systèmes d'exploitation, parfois même quand elles proviennent de fondateurs respectables. Si la lisibilité est votre priorité et que vous ne voulez pas effectuer de tests massifs sur plusieurs navigateurs, vous voudrez peut-être jouer en toute sécurité et utiliser une police de confiance éprouvée. Les anciennes polices Web sécurisées comme VerdanaetGeorgia sont des paris sûrs car elles sont si largement utilisées qu'elles auront été testées même dans des configurations de navigateur / OS plus rares. De plus, la familiarité facilite la lisibilité.
2. Hauteur x élevée et large. Vous ne savez pas quelle est la qualité ou la densité de pixels de l'écran de votre lecteur, donc, si vous priorisez la lisibilité, assurez-vous que les caractéristiques distinctives importantes des lettres sont très claires. Les polices conçues pour la lisibilité du Web, comme Verdanaet Georgia, utilisent autant que possible leurs pixels pour la hauteur x où se trouvent les détails clés d'une lettre, et utilisent un minimum de pixels sur les ascendants ou descendants où une bosse d'un ou deux pixels suffit pour facilement distinguer un bd'un oou d'un p.
3. Pas trop léger. Le type de lumière a fière allure sur les écrans imprimés ou à haute densité de pixels - mais il y a une bonne raison pour laquelle il était rarement utilisé sur les écrans jusqu'à ios7 et était encore controversé: si le spectateur ne regarde pas dans des conditions optimales, comme un écran de haute qualité en mode stable l'éclairage intérieur, il risque la lisibilité. Optez pour une police avec un bon poids régulier solide - ai-je mentionné Verdanaet Georgia?

Il existe de nombreuses polices qui répondent à ces critères autres que VerdanaetGeorgia , bien sûr, et ces deux sont parfois considérés comme un peu ennuyeux parce que jusqu'en 2009 ou alors quand @fontface est devenu largement utilisé, ils étaient les polices de référence pour une grande partie du Web .

Mais vous ne pouvez vraiment pas vous tromper avec eux - ils ont été conçus pour être lisibles sur le Web, et chaque combinaison de navigateur et de système d'exploitation aura été testée pour bien les afficher.

Edit: Lorsque les vendeurs de types Web et les fondateurs se donnent la peine de tester la bonne lisibilité, ils sont susceptibles de le crier dans leur marketing. Par exemple, la série Web «Reading Edge» (pointe du chapeau à Chris Burton qui l'a mentionné ici ). Pourtant, testez largement.

Ok, je vais aller de l'avant et donner mon avis à ce sujet. Il n'y a pas de «meilleure police» ultime et il ne peut pas y en avoir car le choix d'une police dépend de nombreux aspects différents. Ce qu'il peut y avoir est une «meilleure méthode pour choisir une police».

Donc, les choses à considérer pour vous aider à choisir la meilleure police pour votre projet;

Média: Comment la police sera-t-elle affichée, papier, toile, en ligne, appareil portable, etc. Vous voulez vous assurer que vous choisissez une police appropriée au média sur lequel elle sera affichée, par exemple un bloc de Times New Roman peut convenir à un document imprimé mais, à l'écran (surtout un petit écran), un bloc de Times New Roman peut être assez difficile à lire. Vous voulez également voir ce qui est à votre disposition si vous êtes limité aux polices Web, des ressources telles que les polices Google pourraient vous aider ici. (Tiré de Wikipédia: «Polices Web sécurisées Les polices Web sécurisées sont des polices susceptibles d'être présentes sur un large éventail de systèmes informatiques et utilisées par les auteurs de contenu Web pour augmenter la probabilité que le contenu s'affiche dans la police choisie. Si un visiteur d'un site Web le site n'a pas la police spécifiée, leur navigateur essaie de sélectionner une alternative similaire, basée sur les polices de secours et les familles génériques spécifiées par l'auteur ou il utilise la substitution de polices définie dans le système d'exploitation du visiteur. ")

Public: Pensez à qui le lira. Un jeune enfant pourrait faire mieux sans une police à empattement ou une seule histoire «a» par opposition à une double histoire «a» . Cependant, s'il s'agissait d'une invitation à un mariage, des polices telles que Edwardian Script sont ce qui est très populaire dans ce contexte, car avouons-le plus Serif, plus décoratif, mieux c'est - selon certaines mariées, c'est;) bien que les éléments décoratifs soient encore utilisé principalement pour les titres plutôt que pour le contenu entier. Comme un sage ol

Contraste / Couleur: Encore une fois, c'est quelque chose à considérer en termes de votre projet. Bien sûr, vous ne voulez pas aveugler les gens en raison d'un contraste terriblement élevé, ou leur donner des rides en plissant les yeux sur quelque chose qui a un contraste terriblement faible - cette partie est évidente. Mais selon votre schéma de couleurs, vous voudrez peut-être jouer avec les paramètres de luminosité et de contraste. Vous remarquerez que GD.SE par exemple n'est pas complètement noir et complètement blanc (comme demandé et répondu ici ) - il a un contraste plus faible que cela, par conséquent, il est assez facile de regarder ce site Web pendant de très longues périodes de temps en comparaison à regarder quelque chose avec un contraste beaucoup plus élevé - vos yeux se fatiguent!

Poids: en général, les polices lestées plus légères sont un peu plus lisibles que certaines plus lourdes, ceci est discuté plus loin ici avec d'autres aspects de lisibilité que vous pouvez trouver utiles.

Combien: en fonction de votre média, de votre audience et de votre contenu, vous pouvez choisir plusieurs polices. Je suggère de me méfier de cela. Vous ne voulez certainement pas confondre le contenu. L'intérêt de la police est de communiquer quelque chose, ce que vous cherchez, c'est la façon de le faire le plus efficacement possible. Trop de polices peuvent prêter à confusion, bien qu'une seule police puisse parfois être ennuyeuse. Généralement, cela se produit en termes de gras / italique et de taille avec peut-être deux polices. L'appariement des polices est discuté un peu plus ici .

Ce sont quelques-uns des aspects que vous devez affiner si vous vous éloignez d'une liste vierge, mais bien qu'il y ait beaucoup à considérer quand il s'agit vraiment, ce n'est pas si mal. La valeur de choisir la bonne police / les polices au début d'un projet n'a aucune comparaison! Il y a plus sur les facteurs à considérer lors du choix d'une police ici.

Une bonne analogie est que c'est comme s'habiller, un concept simple qui est discuté ici .

Donc, comme le format de ma réponse est tombé naturellement, vous voulez d'abord savoir à qui il s'adresse et ce qu'il a à dire - ensuite vous voulez comprendre les moyens de communication, quelle police :) et puisque ce ne serait pas un Jenna-Answer sans une abondance de liens, ceci est discuté plus en détail ici .

Je vous suggère fortement de lire les liens que j'ai fournis, ils sont très utiles et vous aideront à choisir la bonne police pour votre projet, c'est ce qui améliorera l'expérience du lecteur. Il ne s'agit pas seulement de la lisibilité, mais aussi de tout le contexte auquel la police contribue, sans parler de l'esthétique qu'une police suffisamment lisible pourrait retirer complètement d'un design quand et tout aussi lisible mais plus appropriée pourrait passer inaperçue et donc faire la conception et l'information les choses les plus importantes. Prendre le temps de le faire est à mon avis tout à fait essentiel.

J'espère que j'ai aidé et que je n'ai pas trop discuté, je suis un peu passionné par la bonne police :) Bonne chance avec votre projet.

Je crois que les polices Serif ont tendance à être plus agréables pour les yeux pendant de plus longues périodes de lecture. Pour une meilleure expérience de lecture, je pense qu'une police serif comme Adobe Garamond fonctionne bien. Ce n'est pas aussi "bla" que Times. Il y a quelques courbes intéressantes dans les empattements qui aident à le rendre un peu plus «pur» en ce qui concerne les polices empattements.

Voici un article sur le sujet avec lequel j'ai tendance à être d'accord:

Serif vs Sans: la bataille finale

Voici deux bonnes polices de lecture disponibles via le plan personnel de Typekit:

Nimbus Sans https://typekit.com/fonts/nimbus-sans

Adelle Sans https://typekit.com/fonts/adelle-sans