web-dev-qa-db-fra.com

Pourquoi la police Arial 13px est-elle la norme Web?

Si vous utilisez l'une des applications de Google, de la recherche à Gmail, vous trouverez que la police de base utilisée pour la plupart des choses est Arial 13px.

font-family: arial, sans-serif;
font-size: 13px;                       

J'ai toujours pensé que les polices de 16 pixels étaient plus faciles à lire pour les "masses". Cependant, Google semble être en désaccord - et ils ne sont pas seuls. Bootstrap de Twitter projet et beaucoup d'autres utilisent également des polices 13px. Même le texte de ce site même n'est que 1px plus grand.

Les navigateurs Web ont-ils tort, la taille de police standard éprouvée est-elle vraiment de 13 pixels et non de 16 pixels? Qu'en est-il des appareils mobiles - qui fonctionnent le mieux sur eux?

Remarque: les polices Serif (Géorgie) nécessitent des tailles plus grandes que Sans-Serif (Arial). Cependant, la plupart des gens conviennent que Sans-Serif est plus agréable à regarder au format numérique tandis que Serif est plus facile à lire dans les médias imprimés.


Edit : Existe-t-il des recherches ou des tests d'utilisabilité qui soutiennent 13px? Quelles preuves soutiennent cette tendance? Où puis-je en savoir plus sur les avantages/inconvénients ou les États applicables à cette taille?

12
Xeoncross

Tout d'abord, 13px Arial n'est pas une norme. Arial est couramment utilisé pour, je suppose, pour deux raisons:

  1. C'est décent en matière de lisibilité (même si les gens ont tendance à être en désaccord, comme dans cette discussion Typophile )
  2. C'est une police sans empattement simple souvent traitée comme un équivalent à large diffusion de
    Helvetica
  3. C'est assez vieux (début des années 80)
  4. Il est conditionné sur Windows depuis le début des années 90 et est disponible sur Mac depuis Mac OS X (bien que, comme toujours, il y ait une différence de rendu)

Pourquoi le 13px semble-t-il être plus utilisé que différentes tailles? Aucune idée. Mais veuillez noter qu'une plus grande taille de police n'équivaut pas toujours à une meilleure lisibilité. Dans certains cas, il peut même réduire la lisibilité du texte.

Pendant que nous lisons, nos yeux bougent grâce aux mouvements saccadés et s'arrêtent toutes les 25-30 millisecondes pour une fixation qui dure environ 200 millisecondes. Dans une fixation, nous pouvons inconsciemment percevoir et traiter des signes visibles dans la fovéa, qui mesure environ 1,5 cm de large. Vous devez trouver une combinaison parfaite de nombres de signes adaptés à la fovéa et très lisibles. Donc 16px n'est pas toujours mieux que 13px.

Lorsqu'il s'agit d'adultes, la lecture est un processus descendant, de sorte que le sens sémantique est dérivé de quelques lettres, des mots précédents et de la construction grammaticale d'une phrase.

Huh ... des trucs durs.

Bien sûr, personne ne procède à une telle analyse. C'est uniquement pour les nerds de la psychologie cognitive qui aiment la typographie;).

J'espère que cela vous a aidé d'une manière ou d'une autre.

15
marcintreder

Il y a quelques années, comme en 1998 ou 1999, on examinait la taille des pixels (appelée pas de point ) lors de l'achat d'un moniteur. Selon les normes d'aujourd'hui (et encore moins ces écrans Retina), les pixels étaient alors assez gros. Par exemple, les moniteurs étaient du type VGA, arborant 640 pixels horizontalement. La taille habituelle était de 14 pouces. Désormais, les écrans des ordinateurs portables mesurent également environ 14 pouces, mais ils affichent 1280 ou 1600 pixels au lieu des 640 de VGA, à peu près de la même taille.

Cela signifie que de nos jours, les pixels sont beaucoup plus petits. Si 1280px sont affichés dans (environ) la même chose que là où nous avons vu 640px, cela signifie que la taille est maintenant ¼ de l'original (la moitié de la longueur du côté, ¼ de la surface). À 640 × 480, les polices serif semblaient moches, car le moniteur n'était pas en mesure de restituer ces minuscules conseils avec suffisamment de détails. L'anticrénelage est venu plus tard et a beaucoup aidé, mais le texte ne semblait toujours pas net . Ainsi, nous avons tous préféré les polices sans serif.

Microsoft a publié Verdana comme police pour les écrans. Il est légèrement plus grand que les autres polices et a également une taille x supérieure bien adaptée à sa largeur qui le rend tout à fait lisible. Donc, tout le monde est passé aux polices sans empattement, et les pages définies dans le IE par défaut Times New Roman paraissaient obsolètes. En revanche, de nombreux @media print les feuilles de style spécifiaient toujours Times car les résolutions d'imprimante (en DPI) étaient beaucoup plus élevées, et le sont toujours.

IE a spécifié les mêmes polices par défaut que Netscape, pour éviter de casser les mises en page. Mozilla a fait de même plus tard. Et tous les autres navigateurs. Personne ne prend le risque de faire le changement, et cela n'a pas d'importance car de nos jours presque tout le monde définit la famille de polices et la taille de leurs sites.

Donc, IMO, nous obtenons un défaut de 13px pour des raisons historiques.

Choisir Arial est une décision intelligente. Vérifiez ceci statistiques sur les polices Web : Arial est dans presque tous les ordinateurs. Il vient avec Windows et je pense qu'avec les Mac aussi. Il existe des polices équivalentes pour Linux. Arial est infaillible pour une entreprise qui veut fournir son service avec le moins de soucis pour l'utilisateur.

En ce qui concerne les tests de polices et de tailles de polices pour le Web, j'ai beaucoup appris en lisant le bulletin d'information de Human Factors International . Ils ont effectué des tests de lisibilité sur différentes tailles de police et longueurs de ligne. Mais, comme Mikko l'a indiqué à juste titre, cela dépend aussi de la distance de lecture.

7
Juan Lanus

Il n'y a pas de norme éprouvée. La taille des polices sur le Web, du moins pour l'instant, n'est toujours pas corrélée aux mesures statiques du monde réel.

Par exemple, la taille de police: 16px variera en taille physique réelle en fonction de:

  • les styles de police particuliers installés sur l'ordinateur de l'utilisateur final
  • interprétation du navigateur
  • le dpi de l'écran

Espérons que cela changera éventuellement si nous pouvons utiliser des mesures physiques réelles et assumer un certain niveau de cohérence entre les appareils et les plates-formes.

Quant à savoir pourquoi Google est allé avec 13px pour leurs polices intégrées, je ne sais pas, bien que les théories pourraient inclure:

  • comme beaucoup de designers, ils estiment que 16 pixels est tout simplement trop grand
  • les polices intégrées, pour des raisons que je ne comprends pas bien, ont tendance à être rendues à des tailles plus petites par rapport aux mêmes paramètres mais avec une police non intégrée.
2
DA01

Mon point de vue est que les gens d'abord "standardisés" autour de 12px et à un moment donné ont pensé, "hmm, cela devrait être juste un peu plus grand." Ou du moins, c'est ce que j'ai fait. :)

1
Rob Flaherty