Consultez la formation SEO spéciale Wordpress
par WebRankInfo / Ranking Metrics

Messages: 2709

Enregistré le: 1 Juin 2007

Message le Jeu Mai 20, 2010 10:27

Hello tout le monde !

Google a annoncé le lancement de Google Font Directory et de Google Font API.

Image

ça ne vous parle peut être pas, mais il vient directement concurrencer des services tels que Typekit (payant), un service permettant d'intégrer n'importe quel font / police dans une page web.

Image

Ce sera très très utile pour les web designers (notamment).


Liens utiles :
... et devinez quoi ? C'est compatible avec Internet Explorer 6 !!! (si si, même que j'ai testé avec IETester)
Je pensais que seuls les navigateurs récents (et décents) pouvant utiliser les propriétés de CSS3 pourraient afficher correctement les sites utilisant ce genre de technique, mais non, ça ne semble pas nécessaire.

Au passage, je précise qu'il existe plusieurs techniques pour afficher des polices différentes des polices traditionnelles (Verdana, Arial, Georgia, Helvetica...). Google se base sur la technique la plus "accessible" et la plus compatible qui existe actuellement (à ma connaissance) : @font-face. Il n'est pas l'inventeur de cette technique / propriété, et n'offre, à travers ce service, que ses compétences dans l'hébergement (les fonts/polices sont hébergé(e)s dans le cloud, sorte de CDN : des serveurs très puissants pour simplifier) et dans la technique (il ne suffit que d'ajouter une ligne de code à sa page HTML).
Haut
13 Réponses
Messages: 8614

Enregistré le: 14 Mai 2003

Message le Jeu Mai 20, 2010 11:10

Merci SpeedAirMan
Cool qu'ils aient fait ça avec du @font-face (je suis fan).
Au revoir les cufon et autres.

En passant, un générateur de @font-face:
http://www.fontsquirrel.com/fontface/generator
et quelques kits prêts à l'emploi:
http://www.fontsquirrel.com/fontface
Haut
Messages: 807

Enregistré le: 15 Avr 2007

Message le Jeu Mai 20, 2010 12:45

Merci pour l'info
Haut
Messages: 3574

Enregistré le: 11 Fév 2009

Message le Jeu Mai 20, 2010 12:53

mouais bof y a pas d'anti-aliasing des caractères.
Haut
Messages: 1

Enregistré le: 17 Jan 2010

Message le Mar Mai 25, 2010 6:49

Bon début, mais il n'y a que 18 polices pour le moment !
Haut
Messages: 3306

Enregistré le: 2 Juil 2008

Message le Mar Mai 25, 2010 8:41

J'essaie de décortiquer les articles mais je ne comprends pas pourquoi ça marche avec IE avec un font-face alors qu'en l'utilisant directement sur le site ça ne marche pas. Quelqu'un a compris le truc ?
Parce que perso j'ai plutôt tendance à utiliser des polices rares et je n'ai pas trop envie d'attendre que Google s'y intéresse.
Haut
Messages: 2709

Enregistré le: 1 Juin 2007

Message le Mar Mai 25, 2010 11:17

Outil intéressant : Font previewer


fredfan a écrit:J'essaie de décortiquer les articles mais je ne comprends pas pourquoi ça marche avec IE avec un font-face alors qu'en l'utilisant directement sur le site ça ne marche pas. Quelqu'un a compris le truc ?
Pas trop compris ta question...


fredfan a écrit:Parce que perso j'ai plutôt tendance à utiliser des polices rares et je n'ai pas trop envie d'attendre que Google s'y intéresse.
La technique utilisée et proposée par Google Font existe depuis déjà qq temps (comme dit plus haut), ce n'est pas Google qui l'a inventée.
Google propose là un outil, une architecture (ses serveurs), et une liste de polices open source.

Maintenant tu peux tout aussi bien utiliser la même technique avec TES font/polices que tu pourras stocker sur tes serveurs. Mais :
- tes serveurs ne sont peut être pas aussi puissants que ceux de Google
- les polices ne seront pas mises en cache d'un site à l'autre

En effet, si un site A utilise une police nommée "toto" et que cette police/font est téléchargée depuis les serveurs de Google, alors si un autre site B utilise la même police (toujours depuis Google), le fichier font n'aura pas à être rechargé.


Pour ceux qui préfèrent Cufon (une autre méthode pour utiliser des polices/fonts exotiques), css-tricks.com vient de sortir un petit guide : Cufon 101 (ce n'est pas la même technique - je crois que Cufon est moins accessible, mais, je CROIS que les polices sont mieux lissées).
Pour ceux qui s'intéresse à tout ça, il existe encore une autre méthode : sIFR.

Edit: je viens de tomber là dessus : sIFR vs Cufon
sIFR est probablement la technique qui donne les plus beaux résultats, mais côté lourdeur, compatibilité et accessibilité, c'est ce qu'il y'a de pire.
Cufon me semble un bon compromis entre accessibilité et qualité.
@Font-Face est, je crois, le plus accessible et le plus... "sémantique" (compatible avec les navigateurs sans forcément avoir besoin de JavaScript). Côté qualité par contre, les polices ne me semblent pas correctement lissées.
(si qq un peut compléter ou rectifier mes dires, c'est le bienvenue :-) )
Haut
Messages: 8614

Enregistré le: 14 Mai 2003

Message le Mar Mai 25, 2010 11:48

D'autres informations sur le @font-face:
http://paulirish.com/2009/bulletproof-font-face-implementation-syntax/

Un article qui montre quelques différentes techniques (Flash, JS, PHP, ...Cufon, sIFR) :
http://www.smashingmagazine.com/2009/10/22/rich-typography-on-the-web- ... and-tools/
Modifié en dernier par spout le Mar Mai 25, 2010 11:52, modifié 1 fois.
Haut
Messages: 371

Enregistré le: 22 Fév 2010

Message le Mar Mai 25, 2010 11:49

certainement très bon système, seule chose à déplorer une fois de plus c'est que c'est GRATUIT et au détriment d'une société qui à développé une solution payante.

Le monopole de google commence vraiment à être dangereux à tous les niveaux, il domine l'internet et engloutis tout ce qui le gène de plus en plus vite.
Haut
Messages: 2709

Enregistré le: 1 Juin 2007

Message le Mar Mai 25, 2010 12:07

Hmm... pas d'accord avec FranckFK là.
@font-face est une solution gratuite et open source.
Pareil pour les autres solutions (je crois), à l'exception de sIFR qui base une partie de sa technologie sur Flash (non libre).

Google propose gracieusement son architecture, et met à disposition des polices open source et gratuites.
Je vois pas où est le mal...


Si par "au détriment d'une société qui à développé une solution payante" tu parles des solutions proposées par Typekit par exemple, alors perso, je pense que la solution Google Font ne vient pas directement concurrencer (de front) Typekit.
Typekit propose des polices payantes de qualité que ne propose pas Google.


Je te suggère la lecture de : Google Font API & Interview (en anglais)


Merci Spout pour les liens ;-)
Haut
Messages: 8614

Enregistré le: 14 Mai 2003

Message le Mar Mai 25, 2010 12:15

SpeedAirMan a écrit:Côté qualité par contre, les polices ne me semblent pas correctement lissées.
(si qq un peut compléter ou rectifier mes dires, c'est le bienvenue :-) )


Pour avoir testé plusieurs @font-face kits, j'ai remarqué que certaines polices donnaient mieux dans Firefox Linux que sur Firefox Windows. Il faut tester car en effet certaines fontes n'ont vraiment pas un beau rendu.

Sur le site de mon www, le h1 c'est du @font-face, je suis plutôt content du résultat.
Haut
Messages: 32

Enregistré le: 6 Avr 2006

Message le Mar Mai 25, 2010 21:17

Bonsoir
j'utilise ce qu'ils appellent le Dynamic Text Replacement depuis des années pour tous mes H1 et je n'ai jamais rencontré de problème (en tout cas rien qui ne m'est été remonté)
Police de mon choix, taille, couleur de mon choix, relativement rapide, seul "inconvénient" la nécessité d'avoir javascript activé
Haut
Messages: 2709

Enregistré le: 1 Juin 2007

Message le Lun Mai 31, 2010 18:49

Démonstration de toutes les polices proposées par Google en un coup d'oeil sur une page : http://www.goodwebfonts.com/
Haut
Messages: 330

Enregistré le: 23 Juil 2004

Message le Jeu Déc 09, 2010 17:26

Hello,

Par contre je suis confronter avec Cufon à un pb tout con....

En utilisant l'API google de translate, les polices sous cufon ne sont pas traduites ??

Je suis le seul ou j'ai pas la bonne police ???

A+
Yule
Haut

Formation recommandée sur ce thème :

Formation SEO spéciale Wordpress : apprenez à optimiser le référencement naturel d'un site fait avec Wordpress... Formation Ranking Metrics animée par un expert SEO / Wordpress.

Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.