Lors d’un récent audit SEO, un client m’a posé une question, et ce n’est pas la première fois qu’on me la pose : “Mon site est dépourvu de favicon. Est-ce vraiment utile ?”
Cette interrogation m’a inspiré à vous partager mon point de vue, et surtout ma méthode personnelle, pour intégrer efficacement les favicons dans vos sites web.
Un favicon est une petite icône qui joue un rôle significatif non seulement dans l’expérience utilisateur, mais aussi dans l’aspect référencement de votre site.
Il renforce l’identité visuelle, contribue à la reconnaissance de la marque, et peut même influencer positivement le taux de clics dans les résultats de recherche.
Que les internautes qui n’ont jamais retrouvé la page d’un site dans les onglets de leur navigateur grâce à une favicon lèvent la main… On est d’accord !
Dans cet article, je vous guide à travers les étapes que moi-même je suis, pour créer et intégrer un favicon, et ainsi assurer que votre site se démarque et performe bien dans les moteurs de recherche.
Mais avant tout un peu de français… Habituellement, on dit “le favicon” en utilisant le genre masculin. Toutefois, le terme “favicon” dérive de l’abréviation de “favorite icon”, traduit par icône favorite en français, ce qui justifie l’emploi du féminin pour “favicon”, contrairement à l’usage masculin souvent rencontré. Ainsi, pas d’inquiétude si, dans cet article dans la thématique “site web et internet“, vous trouvez parfois “le”, “un” ou “la”, “une” devant le mot favicon.
Qu'est-ce qu'une favicon ?
C’est cette petite image sympa qui apparaît dans l’onglet de votre navigateur quand vous ouvrez un site. Vous voyez ? Pour moi, c’est un détail qui n’est pas si petit que ça : le favicon est un élément qui apporte une touche de finition à votre site, et contribue à son identité visuelle.
Quand je crée un site, je pense au favicon dès le début du processus de conception, car il joue un rôle clé dans la reconnaissance du site par les utilisateurs.
Pour moi, vous devez prendre en compte que cela fait partie du design de votre site !
Comment créer sa favicon ?
C’est un mix d’art et de technique. Non je plaisante… c’est assez simple.
Étape 1 : préparation
J’utilise le logiciel Pixelmator Pro pour la réalisation. En général, il y a deux cas de figure :
- Vous avez déjà un logo vectorisé pour votre entreprise : créez votre favicon à partir de ce logo.
- Vous n’avez pas encore de logo : il va d’abord falloir en créer un, pour ensuite faire votre favicon.
Le format d’image d’un favicon lors de sa création pour WordPress a une dimension carré de 512×512 pixels, et le fichier est sauvegardé au format ico, ou png, ou jpeg ou webp. Personnellement, j’utilise le format jpeg et cela fonctionne très bien. Si je souhaite un fond transparent, je prends le format png ou le webp.
Faites des tests ! Je fais attention à ce que le design soit clair et reconnaissable même en petite taille, car généralement c’est affiché en 16×16 pixels. Je vérifie qu’il se démarque sur différents fonds de navigateurs. C’est à mon avis un point important car l’objectif est de distinguer le favicon dans l’onglet.
Étape 2 : comment ajouter une favicon à un site WordPress ?
L’intégration est la partie facile.
Dans le menu latéral de WordPress, aller sur l’intitulé “Apparence” → “Personnaliser” dans votre tableau de bord WordPress comme l’indiquent les images ci-dessous.
Cliquez sur le menu “Identité du site”. C’est là que l’on peut la charger en appuyant sur le bouton “Sélectionner l’icône du site”.
Cela vous ouvre la bibliothèque média de WordPress dans laquelle on téléverse l’image.
C’est la manière la plus aisée et la plus rapide sur votre site WordPress.
Et voilà ! Vous n’avez qu’à cliquer sur “Sauvegarder et Publier” pour mettre en ligne. Si vous souhaitez apporter des modifications ultérieurement, vous pouvez revenir à cette interface.
Désormais, votre favicon est en place et prêt à être affiché ! Le favicon apparaîtra dans l’onglet du navigateur.
Tester et valider
Je ne considère jamais un site comme terminé avant d’avoir testé son favicon. Je vérifie qu’il apparaît correctement dans différents navigateurs et sur divers appareils.
Je vérifie aussi son rendu dans les favoris, car c’est souvent là que les utilisateurs le verront hors du contexte du site.
Un petit test sur différents écrans peut révéler des surprises, donc je m’assure que tout est parfait avant de lancer le site.
En conclusion de cet article
Maintenant, vous savez comment ajouter un favicon à votre site !
On peut vraiment affirmer que cet mini icône fait partie intégrante de votre site internet, elle permet d’être plus crédible auprès de votre public et donne un petit “plus” professionnel à votre site.
Si votre site web n’en a pas, cela doit faire partie de la prochaine optimisation de votre site, car elle joue un rôle important et elle a un impact non négligeable.
Si vous souhaitez bénéficier de mes conseils pour optimiser votre site, prenez un rendez-vous avec les boutons ci-dessous.
Voilà, vous savez tout ! Avec plusieurs onglets ouverts en même temps que cela soit avec Google Chrome ou le navigateur Sidekick, vous pourrez rapidement identifier et accéder aux sites web importants pour vous grâce à cet info visuel. N’oubliez pas qu’on les voit aussi dans les favoris et l’historique de recherche…
Si vous avez des questions sur le sujet, n’hésitez pas à me laisser un commentaire.
À bientôt Francis