Share
Depuis que Hoefler & Frere-Jones a annoncé sa percée dans le monde des polices Web, Internet regorge de réjouissances de la part des concepteurs et des typographes. Enfin, l’une des fonderies de caractères les plus populaires a publié son concurrent tant attendu aux services de polices Web de la dernière minute.!
Vous pouvez déjà voir le nouveau service utilisé sur des sites tels que Rdio, le site Web de Jessica Hische et CSS-Tricks. Mais que signifie cette nouvelle offrande pour vous et moi? Eh bien, les concepteurs et les développeurs ont beaucoup à attendre du service. Regardons de plus près.
Commençons par rafraîchir nos esprits avec une brève leçon de l'évolution du type sur le Web. À l'époque de CSS 2, (OK, donc pas cette loin en arrière), notre sélection de polices Web a été quelque peu limitée. Nous avons pu utiliser une petite sélection de polices adaptées au Web, qui figureront certainement sur (presque) tous les appareils visités - Verdana, Arial, Georgia et Times New Roman - ou nous avons sélectionné une police telle que Helvetica, ce serait "mieux vu" sur des plates-formes spécifiques. Pas idéal. Et puis il y avait les techniques de remplacement d'image, où nous créions des images du texte dans n'importe quelle police dont nous disposions, et remplaçions des chaînes de texte en utilisant CSS. Enfin, il y avait Sifr; une technique qui a utilisé Adobe Flash pour remplacer le texte. Ces deux techniques de remplacement étaient inaccessibles, une mise en œuvre difficile et une expérience désagréable sur toutes les plateformes..
Peu nous avons su, une spécification pour réal les polices Web étaient en cours: @ font-face. Ceux qui connaissent @ font-face savent que ce n’est pas la chose la plus facile à mettre en oeuvre au monde. Nous nous tournons donc vers des services de polices Web de haute qualité, tels que Google Web Fonts, Typekit et Fontdeck, pour nous permettre de faire le gros du travail. Ces services, ainsi que le nouveau service de H & FJ, gèrent l'hébergement, les licences et l'optimisation des polices Web. Cependant, chaque service n’est pas sans compromis; tous ces services manquent de contrôle précis sur les polices que nous obtenons. Des choses comme les ligatures, les petites majuscules et d’autres fonctionnalités OpenType sont souvent difficiles à implémenter sans affecter sérieusement les performances des polices..
C'est la partie excitante. H & FJ a créé un service de polices Web pour les typographes et les développeurs.
Faisons le plus difficile. Le service cloud.typography de H & FJ commence à 99 $ par an. Ce prix vous achète 250 000 pages vues par mois. Pour 50 $ de plus, vous obtenez 1 million de pages vues, et pour 299 $, vous obtenez le double.
Chacun de ces plans vous offre également cinq familles de polices gratuites: une bonne affaire si vous considérez que ces familles de polices de haute qualité coûtent environ 200 USD seulement, ainsi que tous vos achats antérieurs auprès de la fonderie, des domaines illimités et dix projets maximum. ”, Livraison SSL et 1 Go de bande passante de développement. Des plans plus grands sont disponibles, ainsi que des projets supplémentaires.
La bibliothèque de H & FJ est petite comparée à celle de Typekit, mais elle élève le niveau de qualité. La fonderie propose plus de trente familles, dont dix ont été complètement repensées, repensées et optimisées pour une utilisation sur le Web et les appareils à écran. Un nombre considérable de ces familles ont des ensembles étendus, comprenant des variantes condensées et étendues, des poids allant du ultra-léger au ultra-noir, des petites majuscules, des ligatures, des swashes et des jeux de caractères internationaux. En gros, vous obtenez des polices de très haute qualité.
Les cinq premières familles que vous choisissez sont entièrement gratuites et, ensuite, leur prix est calculé individuellement. Toutes les licences de bureau sont également livrées avec une licence d'utilisation Web. Vous pouvez ainsi emporter les polices H & FJ déjà achetées, ainsi que bénéficier de nombreuses offres de licences de bureau et de logiciels Web pour la création de marques unifiées. La police de caractères la plus excitante est probablement Gotham, considéré par beaucoup comme l’ancêtre le plus raffiné de Proxima Nova..
Il existe des différences subtiles entre Gotham et Proxima Nova; à savoir, l'espacement et la largeur plus généreux des lettres de Gotham, et l'alphabet alternatif «a» de Proxima Nova. Un aspect important des polices Web est leur fonctionnement sur les périphériques d’écran. Il faut beaucoup d'optimisation pour s'assurer que les polices, en particulier celles conçues à l'origine pour être imprimées, fonctionnent bien sur les écrans. H & FJ a fait tout son possible pour optimiser certaines de ses polices de caractères et a souvent redessiné complètement les familles et les personnages pour leur donner une apparence exceptionnelle à l'écran et sur le Web..
Sentinel (en haut) et Sentinel Screensmart (en bas) à 18px. Les lettres les plus hautes et les plus larges dans la version screensmart en font l'outil idéal pour les petites tailles et les copies de corps.. Le processus d’optimisation a été confié à «ScreenSmart» par la fonderie. De leur site web:
Les polices ScreenSmart sont conçues pour le texte Web. Conçues dès le départ comme familles de polices pour l'écran, elles sont conçues autour des propriétés naturelles des pixels et conçues pour produire des résultats précis partout..
C'est sous-vendre leur travail. La fonderie a redessiné ses polices dans le navigateur, en utilisant une suite d'outils basés sur Webkit. De nouveaux poids entiers ont été spécialement conçus pour être utilisés à l'écran, et chaque police est optimisée sur divers navigateurs et plates-formes pour une lisibilité parfaite..
Compte tenu de la qualité - et par conséquent de la taille du fichier - des polices, cette chose est vite. Cloud.typography utilise un agent de distribution pour gérer les demandes de polices Web, détecter les exigences du navigateur et ne livrer que les polices nécessaires à ce navigateur. Il met également en cache tous les fichiers demandés et les distribue sur un CDN global, ce qui signifie que la livraison de ces fichiers est toujours extrêmement rapide..
L'agent de livraison fonctionne différemment selon le statut de votre projet et de ses polices. En mode développement, les fichiers de polices sont hébergés sur les serveurs de H & FJ et distribués à partir du CDN. Pour chacun de vos projets, vous obtenez 1 Go de bande passante de développement par mois; une allocation assez importante. Lorsque vous passez en mode de production, vous informez H & FJ de l'emplacement des polices sur votre propre serveur, vous téléchargez un fichier zip de grande taille et vous le collez sur votre serveur. Après cela, il n'y a pas besoin de changer le lien CSS ou de faire autre chose; le fichier CSS pointe vers les polices sur votre propre serveur, mais le réseau de distribution fait toujours le gros effort pour déterminer quelles polices sont nécessaires, ce qui évite à votre utilisateur un temps d'attente important.
Après le passage en mode de production, la seule limite est la marge d'affichage de page pour votre plan..
Une autre chose à noter concernant les performances de Cloud.typography est le fait qu’il n’utilise pas de chargeur JavaScript comme Typekit et Google Web Fonts. Un chargeur JavaScript présente des avantages évidents lorsqu'il s'agit de s'adapter de manière dynamique aux besoins du navigateur, mais il a également un coût; Requêtes HTTP supplémentaires, certains renifleurs de navigateur de bas niveau et un délai supplémentaire pendant que le script ajoute le CSS au document.
Une chose qui m'a vraiment intéressée a été une amélioration assez subtile de la performance. Si vous consultez les règles CSS pour l’ajout de polices à votre site, Cloud.typography ne spécifie pas une, mais deux noms de police. Par exemple, la règle CSS de Hoefler Text ressemble à ceci:
famille de polices de caractères: "Hoefler Text A", "Hoefler Text B";
En demandant deux fichiers de police, les polices peuvent être téléchargées simultanément (bien que ce ne soit pas le cas dans tous les navigateurs). En théorie, il est plus rapide de télécharger deux fichiers de 200 Ko simultanément que de télécharger un fichier unique de 400 Ko. Les polices A et B contiennent toutes deux la moitié des jeux de caractères. Par conséquent, les caractères manquants dans le fichier A utilisent le fichier B. Smart ou quoi.?
L’intention réelle de diviser les fichiers de cette manière (selon Reed de H & FJ) est "d'empêcher l'utilisation abusive occasionnelle des polices", mais c'est tout de même intéressant..
Cela dit, les fichiers de polices peuvent rapidement devenir volumineux. Les polices sont ajoutées à votre projet en fonction du poids et du style, chaque poids ou style représentant en moyenne environ 40 kb. Cela signifie que si vous voulez une famille de polices unique avec des poids normaux et gras, avec des italiques et des petites majuscules pour chacune d’elles, vous pouvez vous attendre à une taille totale de 320 Ko..
Cloud.typography offre un niveau de contrôle très compétitif sur les polices que vous sélectionnez. Ces options indiquent clairement un service de polices Web non seulement pour les concepteurs et les développeurs, mais également pour les utilisateurs. typographes. Par défaut, toute famille de polices que vous ajoutez à un projet obtient les polices de caractères standard, italic, bold et bold italic, avec la ponctuation et le crénage standard..
Voici où cela devient intéressant (ou obsessionnel limite). Une fois que vous avez ajouté une famille de polices à votre projet, vous pouvez également ajouter tous les autres poids disponibles (jusqu'à neuf) et styles, vraies petites capitales, ligatures contextuelles et discrétionnaires, swashes, styles de numéro différents, jeux de caractères étendus, signes de ponctuation et caractères mathématiques..
De plus, vous pouvez également définir des jeux de caractères personnalisés. Par exemple, si vous utilisez uniquement une certaine police de caractères pour le logo de votre site, vous pouvez indiquer à Cloud.typography de ne fournir que les caractères nécessaires, ce qui enregistre des téléchargements sérieux pour les utilisateurs..
Il est bon de rappeler que chacune des fonctionnalités typographiques supplémentaires que vous ajoutez ajoutera plus de poids aux polices, et que la prise en charge du navigateur peut être un peu inégale, en particulier sur les anciens IE..
Espérons que vous constaterez que H & FJ a fait un effort supplémentaire en offrant un contrôle sans précédent sur les polices que vous avez choisies pour vos sites. Bien que la taille des fichiers continue d'augmenter, ce niveau de contrôle a rendu les concepteurs du monde entier (le vôtre vraiment inclus) incroyablement enthousiasmés. Quoi qu'il en soit, le lancement de Cloud.typography pourrait marquer le début d'une évolution des autres services de polices Web actuellement disponibles. Nous ne pouvons qu'attendre et voir! N'oubliez pas d'en apprendre davantage sur le nouveau service directement depuis la bouche du cheval.
Accentsconagua