Le favicon d’un site internet est la petite icône qui apparaît en haut à gauche dans l’onglet de votre navigateur, dans vos marques-pages mais aussi dans les résultats de recherches Google.
Il permet aux internautes à identifier rapidement votre site et donc d’améliorer l’expérience utilisateur.
Dans cet article, vous allez voir les règles et bonnes pratiques à respecter pour créer un bon favicon !
3 Éléments d’un Bon Favicon
Pour créer un bon Favicon, il y a 3 éléments à respecter :
1. Les Dimensions
Un Favicon est carré avec une taille qui est en général de 16 x 16 pixels ou 32 x 32 pixels.
Il est possible que vous deviez créer un pixel de dimension 48 x 48 pixels si vous souhaitez qu’il l’affiche dans les moteurs de recherches à coté de l’url de votre site.
C’est une consigne donnée par Google,
2. Le Format
Votre favicon peut avoir plusieurs formats, mais attention certains ne sont pas compatibles avec tous les navigateurs.
Préférez l’utilisation des formats : ICO, PNG ou GIF (non animé)
Si vous souhaitez en savoir un peu plus sur les formats supportés en fonction des navigateurs, voici un article de Wikipédia.
3. Le Design
La taille d’affichage finale de votre favicon est de 16 x 16 pixels.
Vous devez donc faire en sorte d’avoir un design simple et qui permet de reconnaitre votre site web.
N’hésitez pas à utiliser votre logo si la réduction conserve sont aspect ou bien à en faire une version simplifié et adapté à un format réduit.
Créer le Favicon de votre Site Internet
Il existe de nombreux outils gratuits et payants pour créer votre favicon, en voici quelques-uns
Générateurs de Favicon :
Les générateurs de Favicons permettent de créer votre favicon de zéro ou à partir d’une image et sont en général gratuits.
En voici quelques-uns :
Outils en Ligne de Création de Visuels :
Pour rappel, un favicon est une image carré, donc pour le créer vous pouvez simplement un outil de création de visuels.
Faites bien attention à exporter le fichier au format PNG.
Voici quelques outils que vous pouvez utiliser :
Ces outils ont des versions payantes qui vous permettent d’exporter les images avec un fond transparent mais si vous ne souhaitez pas payer, vous pouvez essayer de retirer le fond avec un outil gratuit comme remove.bg.
Avec un fond transparents, vous pourrez être plus créatif, varier les formes et avoir des favicons ronds, triangles, étoiles, etc.
Comment Mettre le Favicon sur Votre Site Internet
Maintenant que vous avez un beau favicon carré aux dimensions 16 x 16 pixels ou 32 x 32 pixels, au format ICO, PNG ou GIMP et qui vous permet d’être identifié facilement, il est temps de le mettre sur votre site Internet.
Pour l’insérer, cela dépend de la plateforme que vous utilisez, voici les principaux tutos à lire en fonction de l’outil que vous utilisez :
- Mettre un Favicon sur WordPress (Ionos)
- Mettre un Favicon sur Joomla
- Mettre un Favicon sur Wix
- Mettre un Favicon sur Prestashop
- Mettre un Favicon sur Magento
- Mettre un Favicon sur Shopify
- Mettre un Favicon sur Wizishop
Prenez le temps de mettre en place ce petit icône sur votre site Internet, vous verrez que cela peut être fait rapidement.
Même si cela peut vous sembler être un simple le détail, un favicon participe à votre branding.
Il s’affiche à de nombreux endroit, permet de vous identifier plus facilement ce qui facilite l’expérience utilisateur.
Alors à vous de jouer !
A bientôt,
Nicolas Favier
