Qu’est-ce qu’un Favicon et comment en créer un pour votre site ?



Léonard de Vinci disait : « Les détails font la perfection, et la perfection n’est pas un détail ». Il n’y a rien de plus vrai, notamment lors de la création d’un site internet. C’est l’assemblage de plusieurs minis éléments qui permet de créer un outil harmonieux et fonctionnel. De toutes ces parties, il y en a une que l’on a tendance à oublier : le favicon. Aussi petit soit-il, cet élément a une importance capitale dans l’aspect général de votre site et l’impression qu’il laisse aux visiteurs.


Mais attendez, savez-vous ce qu’est un favicon ? Nous vous expliquons tout sur cet outil. À quoi sert-il, quelle taille doit-il faire et comment le créer pour votre site internet ?



Définition : qu’est-ce qu’un favicon ?


Le favicon est une petite icône (de 16x16 pixels) utilisée par les navigateurs web pour représenter un site internet.


Il s’affiche dans la barre d’adresse, les signets, les onglets, les favoris ou encore l’historique de votre navigateur. C’est un outil visuel qui permet d’identifier votre site sur le Web.





Pourquoi avoir un favicon ?


Ils sont petits, mais ils sont costauds. Malgré leur taille, les favicons sont essentiels. Ils améliorent l’expérience utilisateur, ont un impact positif sur votre référencement, jouent un rôle crucial dans le branding de votre marque et vous permettent de gagner en professionnalisme. Voyons cela plus en détails :


L’expérience utilisateur : le favicon est un élément visuel de votre site dont les visiteurs se souviennent. Grâce à lui, les internautes vous repèrent facilement sur la barre de navigateur, et cela, même lorsque vous avez une trentaine d’onglets ouverts en même temps.


Le référencement : bien que le favicon ne soit pas un critère pour classer votre site sur les moteurs de recherche, il a un impact indirect sur votre référencement. En devenant un site de confiance, vos visiteurs passent plus de temps sur vos pages. Ce qui est un gage de qualité pour Google, qui saura comment vous récompenser.


Le branding : pour avoir une identité visuelle cohérente, il est important de ne rien laisser au hasard. Le favicon est l’icône de votre site, il est donc normal qu’il soit personnalisé à son image. Il exprime votre style et votre tonalité au-delà du cadre strict de vos pages.


Le professionnalisme : le favicon vous permet d’être plus crédible pour votre cible. Il donne un aspect fini et professionnel à votre site



Comment créer un Favicon ?


Vous pouvez réaliser votre favicon de deux manières : soit en faisant appel à un graphiste professionnel, soit en le concevant vous-même grâce aux outils disponibles en ligne. Pour cela, vous devez déjà savoir comment créer un logo. Nous vous recommandons le générateur de logo Wix. Il vous permet de créer un favicon personnalisé et professionnel qui reflète au mieux votre style et répond à vos besoins.


Taille : la taille optimale d’un favicon est de 16x16 pixels. C’est leur taille classique. Ils peuvent parfois s’afficher en plus grande dimension, comme 32x32 pixels.


Fichier : le fichier idéal pour un favicon est le JPEG ou le PNG. Vous ne connaissez pas la différence ? Consultez notre guide sur les différents formats d’images et comment les utiliser.


Transparence : si votre image a un fond transparent, assurez-vous d’enregistrer le fichier PNG en activant l’option de transparence.





Conseils pour réaliser votre favicon


Plus votre icône est petite, plus vous devez la créer avec attention. Voici une liste d’astuces pour que votre favicon se fasse remarquer.


Simplicité : le favicon est une icône très petite. Il doit donc être très simple. Évitez d’ajouter trop de détails et de créer un design complexe. Les textures ou les ombres rendront votre visuel difficile à lire. Optez à la place pour une image simple avec des aplats de couleurs pour être immédiatement reconnaissable.


C’est ce que fait l’artiste Adam J. Kurtz en utilisant une simple étoile jaune. Ou encore la créatrice de bijoux Ilaria Bonardi avec trois gros points.






Identité visuelle : votre favicon doit refléter la personnalité de votre marque. Créez-le en utilisant la même charte graphique que pour le reste de votre site.


Pour la marque Sorry, le X reprend le design en noir et blanc présent sur leurs vêtements et sur leur site Wix. De la même façon, le favicon d’ebay est aux couleurs du logo pour conserver une cohésion de marque.






Texte : ou plutôt devrions nous dire « l’absence de texte ». Si vous souhaitez ajouter des typographies, limitez-vous à trois caractères. Utiliser les initiales ou des abréviations est une bonne solution.


L’association Arte par exemple n’utilise que le A en favicon avec un arrière-plan vert fluo pour attirer notre attention. Red Fern, quant à eux, prennent le parti d'utiliser la feuille de leur logo plutôt que du texte pour plus de lisibilité.






Logo : alors que certains logos peuvent très bien être utilisés en favicons, d’autres seront difficilement lisibles dans un espace aussi petit. Dans ce cas, il va falloir faire quelques ajustements. Google par exemple n’utilise que le G multicolore. L’utilisatrice de Wix Charlotte Mei reprend ses initiales en gardant le style de typographie utilisé dans son logo. Voici quelques twists faciles à faire pour harmoniser votre logo et votre favicon.






Couleur : la couleur d’arrière-plan de votre favicon changera en fonction du contexte et du navigateur web utilisé. Ce qui veut dire que vous devez créer un design qui s’affichera aussi bien sur du blanc, du gris ou du noir. Faites des tests avant de vous lancer.



Comment ajouter un favicon à votre site Wix


Les sites Wix viennent déjà avec un favicon générique. À vous ensuite de le personnaliser à l’image de votre entreprise. Pour cela, vous devez booster votre site avec un forfait Premium et connecter votre domaine.


Pour changer votre favicon :


  1. Rendez-vous sur votre tableau de bord, cliquez sur Paramètres puis sur Infos générales.

  2. Cliquez sur Gérer à côté de la ligne Favicon.

  3. Cliquez sur Télécharger Image.

  4. Cliquez sur Ajouter à la page. Vous verrez alors un aperçu de votre favicon sur la barre de navigation.

  5. Cliquez sur Appliquer et Ta-da ! Votre site a désormais son propre favicon qui apparaîtra sur l’onglet de votre site lorsqu’il sera publié.


Prêt à créer votre propre site ? Commencez dès maintenant avec Wix !

FR03.png