Comment se fait-il qu’en 2017 on voit encore des sites très bien conçus qui portent le favicon du template ou pire, du CMS ?
Mais avant tout : c’est ki c’est koi le favicon ? La correctrice que je suis vous dira d’abord :
« On dit UNE favicon, pas un favicon ! »
Si vous n’avez que 20 secondes à accorder à la lecture de cet article, voici la définition donnée par notre pote communautaire Wikipédia :
« Une favicon \fa.vi.kon\ est une icône informatique symbolisant un site web. Ces icônes sont créées et/ou utilisés par les concepteurs des sites internet. Les navigateurs web peuvent utiliser la favicon dans la barre d’adresse, les signets, les onglets ou encore les autres raccourcis. »
Si cela vous parle, vous pouvez vaquer à vos occupations ou bien lire mes autres articles. Sinon, entrons un peu dans le détail du mot !
Fav-icon : c’est l’icône favorite ! Vous voyez ces petits dessins en haut des onglets des pages Internet ? Et bien c’est ça, la favicon. Elle sert à se repérer quand, comme moi, on a plein de pages ouvertes en même temps sur son navigateur.
Tout de suite, ça vous parle mieux, non ? ;-))
Elle reprend généralement les couleurs de votre site ou de votre logo, une typo archi-claire ou une icône sympa et très schématisée.
Bref, la favicon doit être un mini-raccourci de votre image… Et on insiste sur « mini », car elle est vraiment minuscule ! Pensez alors, pour choisir votre favicon, que ce qui se verra le plus, en fin de compte, ce seront sans doute les couleurs.
Conseils pour la favicon
Exit le gris clair et le tout blanc, car souvent utilisé par votre navigateur comme paramètre de base… Et gris sur gris ou blanc sur gris clair, et bien, c’est comme poser un nuage sur un paysage enneigé si vous êtes peintre, on va dire que ce n’est pas la meilleure idée que vous aurez eu en matière de contrastes !
Mais ne pensez pas que vous êtes ignare en matière de favicon ! Car figurez-vous que j’ai connu des graphistes, non webmasters, certes, mais webdesigners quand même, qui me donnaient une image large comme une affiche de cinéma qu’ils avaient nommée « favicon.jpg » ou « favicon.png » et qui me disaient :
« Tiens, je t’ai fait le favicon pour ton client. »
Mais non les gars les filles, cela ne fonctionne pas à tous les coups de cette manière !
La favicon, selon les CMS utilisés pour faire le site, cela peut être un fichier .ico créé à partir d’un fichier image ou un image redimensionnée automatiquement par le CMS. Bref, il faut d’abord savoir de quoi il retourne !
Et pour faire simple, on ne va pas faire soi-même une grande recette de cuisine du web pour transformer l’image qu’on veut en favicon.
Pour deux CMS différents, voici la méthode :
- JOOMLA : on va plutôt chercher un générateur de favicon en ligne et en 2 coups de baguette magique, l’image est transformée en favicon avec le code qui va bien, puis on la glisse dans le site. Et au passage, on remercie les personnes cachées derrière ces générateurs souvent gratuits qui nous mettent leur outil à disposition !
- WORDPRESS : on entre l’image qu’on veut et hop, comme par magie, le CMS WordPress nous transforme cela en favicon, tout seul comme un grand !
Bonus track
Rien à voir avec la favicon, mais c’est cadeau : la vidéo que j’ai adoré voir avant de relire l’article.
Enjoy !
Vous souhaitez participer ?
Que ce soit pour écrire un article ou répondre à mon interview, ce sera avec plaisir ! Il suffit de me le faire savoir et nous trouverons à coup sûr un terrain d’entente 😉