Quelques liens utiles
Je vais vous donner une liste exhaustive de liens (vers des sites, logiciels…) qui vont vous permettre de vous aider dans la réalisation de votre favicône et je vais les classer dans des catégories dont j’expliquerai la fonction.
Puisque pour dessiner votre favicône plusieurs méthodes s’offrent à vous, choisissez le moyen qui vous convient le mieux !
Contrairement au code HTML à insérer dans vos pages web, la réalisation de la favicône dépend de vous.
Des générateurs de favicônes !
Vous avez certainement déjà entendu que les webmasters détestent passer trop de temps pour certaines activités comme le graphisme (et à juste titre)…
Au point qu’un seul petit dessin de 16*16pixels les exaspère.
C’est pourquoi certaines personnes prévoyantes ont créé des… générateurs de favicônes !
Ce sont des sites webs qui vous permettent de les dessiner en ligne, et certains vont même jusqu’à générer le code HTML…
Vous n’avez plus d’excuse pour ne pas donner une superbe favicône à votre site !
- http://www.favicon.hu/
- http://www.favicon.cc/
- http://favikon.com/
- http://shaheeilyas.com/favicon/
- http://www.256pixels.com/
- http://www.favicon-generator.de/
- http://antifavicon.com/
- http://www.graphicsguru.com/favicon.php
- http://www.webscriptlab.com/favicongenerator.php
Conversion d’icônes
Si vous ne disposez pas d’utilitaire de conversion d’images, vous pouvez utiliser les convertisseurs de favicônes en ligne, où l’on upload (envoie) son fichier, pour le transformer en la même image mais au bon format.
- http://tools.dynamicdrive.com/favicon/
- http://www.html-kit.com/favicon/
- http://www.dagondesign.com/tools/favicon-generator-tool/
- http://www.wikistuce.info/doku.php/favicon
- http://www.favicon.co.uk/
- http://www.degraeve.com/favicon/
- http://www.genfavicon.com/
- http://converticon.com/
- http://www.chami.com/html-kit/services/favicon/
- http://www.rw-designer.com/image-to-icon
Pfff la compatibilité…
Toujours dans le même esprit, certains oublient ou ne trouvent pas utile de tester leur code sur tous les navigateurs. Pourtant ce n’est pas parce-que ça marche sur le votre que le résultat sera identique sur d’autres navigateurs (vous voyez de qui je parle…). D’autre part je les comprend très bien : on n’a pas à passer tout notre temps à éviter les erreurs d’interprêtation des navigateurs.
Voici donc des validateurs de favicônes (c’est peut-être pas très utile)…
- http://www.html-kit.com/favicon/validator/
- http://www.make-a-favicon.com/favicon_test.php
Paint, c’est nul
Hum ça c’est à prouver. Bon il est vrai qu’il y a mieux en matière de pixel art, enfin je m’égare.
Vous pouvez à la place utiliser des éditeurs d’icônes (la classe !).
- http://www.IconEdit2.com
- http://icofx.ro/
- http://www.conware.org/products/ia/
- http://w1.1358.telia.com/~u135800018/prog.html
- http://www.iconempire.com/iconcraft/
- http://www.rw-designer.com/3D_icon_editor.php
De bons logiciels
Je vous donne ici une liste de logiciels de graphisme en général, pas nécessairement spécialisés dans la création de favicônes.
- http://www.gimp.org/
- http://pixia.free.fr/
- http://www.inkscape.org/
- http://www.imagemagick.org/
- http://www.telegraphics.com.au/sw/ (un plugin pour Photoshop)
Je suis nul en dessin !
Bon bah, dans ce cas là on a encore prévu une alternative pour les cas déséspérés.
Pas mal de sites proposent des favicônes gratuites (parfois par centaines, à votre disposition et prêtes à l’emploi).
Notez que vous pouvez utiliser n’importe-quelle image de 16*16pixels ou 32*32pixels qu’elle soit destinée à devenir une favicône ou pas, rien ne vous en empêche !
- http://www.favicon.fr/
- http://www.clickfire.com/content/graphics/favicons/
- http://www.julian-bez.de/icon/
- http://faviconize.com/
- http://www.fineicons.com/en/favicon-gallery
- http://www.deltatangobravo.com/archives/2004/march/favourite
- http://favicon2dots.com/
- http://www.smashingmagazine.com/2007/01/31/inspire-yourself-50-remarkable-favicons/
Bonus : Lien pour ajouter aux favoris
Voici un petit script qui permet aux visiteurs de vous ajouter à leurs favoris en un clic (il est donc question de lien et j’ai bien placé cette sous-partie).
<a href="javascript:window.external.AddFavorite('http://www.votresite.com/', 'NomDeVotreSite')">LeTexteAAfficher</a>
Cette phrase s’adresse aux petits malins qui ont modifié le code pour forcer les utilisateurs à ajouter leurs sites, enfin de l’ajouter eux-même !
Sachez que cette pratique de « forcing » est fortement déconseillée : les utilisateurs seront mécontents s’ils voient que le site fait des choses dans leur dos. Les plus « peureux » vont croire qu’il y a un virus et les autres vont comprendre votre manoeuvre et vous prendre pour des webmestres malhonnêtes.
Problèmes et solutions
Le cache d’Internet Explorer
Toutes mes favicônes précédemment accumulées ont disparu quand j’ai supprimé le cache d’Internet Explorer (encore lui), et elles ont été remplacés par l’horrible « e » bleu du navigateur, pourquoi ?
Parce-qu’I.E stocke les favicônes dans le dossier « Temporary Internet Files » (son cache) par défaut.
De la même façon, si un de vos programmes utilitaires (ou vous) efface le cache, vous remarquerez que les favicônes/raccourcis présents sur le bureau sont remplacés par les icônes génériques d’I.E !
Les favicônes personnalisées sont restaurées si vous retournez sur les sites victimes du crime.
Vous pouvez également restaurer les favicônes personnalisées en ajoutant de nouveau les sites en question à vos favoris. Parfois elles ré-apparaîssent immédiatement, mais d’autres fois vous devez les faire glisser dans la barre d’adresse, là où le « e » de I.E les a remplacées.
Même cette méthode ne fonctionne pas tout le temps. Toutefois si vous redémarrez votre ordinateur après l’avoir exécutée, les favicônes personnalisées devraient ré-apparaître.
Internet Explorer 7 gère tout de même mieux les favicônes que ses versions antérieures.
Actualisation des icônes
Si vous avez changé l’icône sur votre web que vous voyez une icône ancienne (ou pas d’icône) dans votre navigateur, videz le cache et actualisez la page.
Essayez de tester votre site Web depuis un autre ordinateur si la précédente solution de ne fonctionne pas.
Renommage de formats
Si vous avez renommé brutalement votre favicône .bmp en .ico et que cela ne fonctionne pas, utilisez les convertisseurs.
L’invalidité de l’icône est sûrement la cause du bogue.
C’est fini !
Ce tutoriel est complet au possible, j’espère que vous y trouverez votre compte.
Cependant ne vous embêtez pas trop avec les favicônes, faites simple.
Si vous avez un quelconque problème, postez dans les commentaires !
Remerciements
Je remercie Zenzen279 pour ses multiples relectures et la correction du tutoriel.
A propos de l'auteur
Le futur maître du monde.