Pourquoi Apple utilise-t-il des images de texte pour les en-têtes?
Je viens de remarquer que Apple utilise des images pour les en-têtes de texte simples. Je suppose que c'est pour améliorer la lisibilité, mais je ne comprends toujours pas pourquoi les images?
Vérifiez cela - http://www.Apple.com/why-mac/
Rubrique - "Effectuez la mise à niveau ultime. Vers un Mac." est une image.
Y a-t-il une raison valable d'utiliser une image au lieu du texte pour cet en-tête?
Je suppose que c'est ainsi que le texte s'affiche de manière cohérente dans tous les navigateurs. Tous les navigateurs ne prennent pas en charge face de la police . Les images sont donc le seul moyen d'avoir un contrôle total sur l'expérience.
De nombreux visiteurs de cette page peuvent avoir un ancien PC. Donc plutôt que de risquer de faire détruire la page par un rendu incorrect, ils montrent une image. Pour que le site transmette leur message que "les Mac sont beaux et fonctionnent tout simplement".
Ils se concentrent sur la cohérence visuelle, au prix de l'accessibilité. Ce n'est pas ainsi que le Web est censé fonctionner, mais ce n'est pas vraiment une surprise que Apple adopte cette position, compte tenu de leurs campagnes marketing extrêmement réussies.
La police d'entreprise d'Apple est Myriad. Myriad est probablement trop cher pour quelqu'un à l'échelle de Apple pour obtenir une licence pour servir sur son site Web. De plus, Apple ne veut probablement pas payer Adobe) des tonnes d'argent juste pour soutenir ses décisions de conception pour ses sites Web de marketing. Il rend également le site plus rapide avec moins de téléchargement.
Quant à l'accessibilité; l'image a un attribut alt avec exactement le même texte. Ainsi, les navigateurs sans image rendraient simplement le texte comme normal. C'est parfaitement accessible.
En outre, Apple veut probablement éviter le flash de contenu dépourvu de style avant le chargement de la police. Et une petite image en noir et blanc est beaucoup moins qu'une police de taille. Cette image particulière fait 8 Ko.
Il y a probablement des raisons héritées pour cette décision qui devraient être considérées, mais il y a au moins quelques explications raisonnables auxquelles je peux penser:
Les images permettent un contrôle complet sur les détails typographiques tels que tracking , crénage , ligatures et contextuel suppléants
CSS ne fournit aucun contrôle d'auteur sur le crénage ou les alternatives contextuelles, un support très grossier pour le changement de suivi, et seulement un contrôle global sur les ligatures.
La seule véritable option qu'ils fournissent esttext-rendering: optimizeLegibility, qui respecte les paires de crénage déclarées dans la police et active toutes les ligatures (bien qu'apparemment, seul Firefox utilise des ligatures, même avec cette option activée).
Tout cela ajoute simplement plus de contrôle pour le concepteur.Le verrouillage du titre par rapport à l'imagerie est important pour Apple
L'un des avantages d'un titre basé sur une image est que vous n'avez pas à céder le contrôle de l'habillage du texte au navigateur. Si (pour une raison quelconque) le navigateur ne peut pas charger la police de titre réelle, la copie instantanée d'Apple pourrait malheureusement être emballée, ce qui pourrait conduire à orphelins . Imaginez le titre de votre exemple:Faites l'ultime
améliorer. À un
Mac.Il permet à Apple de styliser le texte d'une manière qui n'est pas encore possible avec CSS
Par exemple, regardez le remplissage dégradé sur le texte "Pourquoi vous aimerez un Mac" dans le titre de la page. Pour l'instant, il n'y a aucun moyen de le faire sans certaines techniques délicates/hacky en CSS.La police (Myriad Pro) est uniquement sous licence publique pour être hébergée par Typekit (un service Adobe)
Il est peu probable qu'Apple soit content de laisser une grande partie de son identité dépendre d'un service distant hors de son contrôle, en particulier pour le texte sur sa page d'accueil. Bien qu'il soit possible qu'ils puissent s'adresser à Adobe eux-mêmes pour obtenir une licence pour héberger tous les différents poids de Myriad Pro qu'ils utilisent, cela ne résoudrait toujours pas les problèmes décrits ci-dessus.
Fait intéressant, le h3 les éléments de cette page (les en-têtes de chaque bloc sous l'en-tête principal) utilisent également Myriad Pro, mais déclarez-le en CSS (sans @font-face déclaration). Ils utiliseront Myriad Pro si l'utilisateur l'a installé, sinon il retombera sur Lucida Grande (la police système OS X), puis Lucida Sans Unicode, puis Helvetica, Arial et enfin la police par défaut sans empattement du navigateur. Ils croient clairement que le texte ça peut se permettre d'être affiché dans d'autres polices si nécessaire.
Pour 90% des sites Web utilisant des images pour le texte, la raison est une raison technique très basique. Pour qu'une police s'affiche correctement dans un navigateur Web, la police doit être stockée sur l'ordinateur client. Si ce n'est pas le cas, une autre police (par défaut) sera utilisée (ce qui Apple ne veut évidemment pas). Il existe maintenant 2 solutions pour le problème qui deviennent de plus en plus populaires , mais bien que la plupart des navigateurs les prennent en charge, tous ne le font pas, il est donc courant de voir des images utilisées à la place du texte. Les solutions de contournement sont les suivantes:
- https://typekit.com - Vous permet d'utiliser la police de leur bibliothèque de polices sur votre site Web. (Également accessible gratuitement pour tous les abonnés Adobe Creative Cloud).
- Visages de police - Vous pouvez intégrer votre propre visage de police en utilisant CSS (tant que vous avez le droit légal de le faire, bien sûr). Un bon endroit pour transformer des polices en faces de police est: http://www.fontsquirrel.com/fontface/generator/generator
Grande discussion ici. Selon mes recherches jusqu'à présent, Myriad a été initialement conçu pour la presse écrite. Ainsi, le rendu n'est pas aussi net en ce qui concerne le Web. Apple étant connu pour ces petites touches, a donc opté pour des images avec du texte alternatif (Accessibilité).
Je ne pense pas que la raison serait le prix/tout ce qui est lié à l'achat auprès d'Adobe en tant que Apple étant l'une des sociétés les plus riches, le prix serait la dernière chose à se soucier.
Mais la question suivante était - POURQUOI PAS DE SPRITES CSS? Après tout, Apple étant connu pour utiliser plusieurs images haute résolution par page Web, pourquoi ajouter une demande http supplémentaire inutile?
La réponse est très simple - Accessibilité car il n'y a pas de texte alternatif pour les images d'arrière-plan.
Explication détaillée - Les images d'arrière-plan CSS qui sont par définition uniquement de valeur esthétique - pas le contenu visuel du document lui-même. C'est-à-dire - les images en CSS ne sont que des extras visuels, pas du contenu de page, donc elles n'ont jamais besoin de texte alternatif . "Coin arrondi" ou "dégradé argenté" n'aide personne en tant que texte alternatif - au contraire, il agace les utilisateurs finaux.