Où pouvez-vous voir le Favicon ?
Les favicons se trouvent à côté de tout ce qui identifie votre site Web. C’est un des éléments essentiels qui vous est livré lors de la création de l’identité graphique de votre entreprise. Cela inclut les signets, les onglets, les applications de barre d’outils, les résultats de l’historique et les barres de recherche. Jetez un œil aux exemples illustrés ci-dessous :
Définition
Un favicon est une petite icône de 16 × 16 pixels qui sert de marque pour votre site Web. Son objectif principal est d’aider les visiteurs à localiser votre page plus facilement lorsqu’ils ont plusieurs onglets ouverts.
En raison de leur petite taille, les favicons fonctionnent mieux sous forme d’images simples ou de un à trois caractères de texte qui peuvent reprendre la typographie de votre logo. Les favicons ne sont pas à confondre avec les logos mais sont parfois identiques. En raison de sa petite taille et de sa résolution, le favicon peut devoir être encore plus petit ou faire partie du logo d’origine d’une entreprise.
Pourquoi les favicons sont-elles importantes ?
La création d’un favicon est une étape modeste mais importante de la création d’un site Web d’entreprise. Cela ajoute de la légitimité à votre site et contribue à renforcer votre image de marque en ligne ainsi que la confiance des consommateurs potentiels. Ils sont un marqueur visuel immédiat pour le site Web qui permet une identification facile et rapide pour les utilisateurs Web et unifie tous les différents composants du navigateur dans une expérience de navigation bien marquée.
Les favicons sont-ils importants pour le référencement ?
Les favicons ne sont pas directement responsables de votre optimisation pour les moteurs de recherche, cependant, ils en sont indirectement responsables et constituent un outil important pour améliorer votre classement sur les moteurs de recherche. Voici quelques exemples de la façon dont avoir un favicon peut aider votre référencement :
Les sites Web conviviaux entraînent une utilisation accrue :
Avoir un site Web convivial améliore indirectement votre classement dans les moteurs de recherche. Avoir un favicon visible sur les onglets de votre navigateur, les signets, les archives d’historique, etc. permet à vos utilisateurs de gagner du temps en leur permettant d’identifier et de parcourir votre site Web sans difficulté, augmentant ainsi la probabilité d’interaction de l’utilisateur avec votre site Web. Cela améliorera le temps passé et les interactions avec votre site Web, ce qui signifie que plus d’yeux seront sur votre site Web plus longtemps, améliorant ainsi votre référencement.
Signets :
Un favicon vous donne un avantage sur les sites Web qui n’en utilisent pas. Le navigateur Chrome de Google déduit certains signaux de classement de recherche pour les sites Web mis en signet sur le Web. Si vous n’avez pas de favicon sur votre site Web, vous risquez de manquer la chance d’être mis en signet sur le navigateur Chrome, manquant indirectement l’un des nombreux signaux de classement de recherche. De plus, le fait d’être mis en signet et de se démarquer visuellement dans cette liste de signets en raison de votre favicon met votre site Web dans une meilleure position pour être revisité par les utilisateurs. Tout cela augmente le trafic et le référencement de votre site Web.
Image de marque et visibilité :
Un favicon est une représentation visuelle de votre site Web et de votre entreprise, de sorte que les utilisateurs s’identifieront à votre marque en fonction du favicon que vous utilisez. Le référencement est une question d’image de marque et de marketing et plus votre site Web est visible, plus les utilisateurs sont susceptibles de cliquer sur votre site Web et de se souvenir de qui vous êtes.
Comment créer un bon favicon
De nombreux éléments doivent être pris en compte lors de la création et de la conception d’un favicon pour votre site Web. Bien que petit et simple, il peut (et devrait) avoir un grand impact. Il est important de s’assurer que vous produisez le meilleur favicon possible car c’est avec cela que les utilisateurs identifieront votre marque. Voici quelques points à garder à l’esprit lors de la création de votre favicon :
Utilisez l’espace à bon escient :
Parfois, un favicon ne peut pas toujours être simplement une version réduite du logo de votre entreprise. Il faut tenir compte de la taille globale de votre favicon. Vous devez vous en tenir à 16px car cela est acceptable par tous les navigateurs (mais vous pouvez trouver d’autres exemples ci-dessous).
Simplicité:
Bien que le favicon soit le visage visuel de votre marque, vous voulez garder votre design aussi simple que possible. Les meilleurs favicons sont les plus simples. En raison de la petite taille du favicon et de la simplicité des formes utilisées, les couleurs sont essentielles pour attirer l’attention des consommateurs potentiels et se démarquer. Trop de détails ne feront que rendre le Favicon encombré et désordonné.
Identité de marque:
Votre favicon est l’icône visuelle de votre marque, elle doit donc indiquer visuellement aux utilisateurs ce que votre entreprise représente. Cela leur dit instantanément en quoi consiste votre marque et ce qu’elle fait. Bien que cela soit très difficile à faire avec un design aussi petit et simple, essayez d’être créatif. Les exemples ci-dessous démontrent la puissance des petites favicons créatives ; au premier coup d’œil, vous pouvez instantanément comprendre en quoi consiste la marque et ce qu’elle représente.
Quelles tailles sont nécessaires pour un favicon sur chaque navigateur ?
Comme indiqué ci-dessus, 16px est généralement recommandé car il peut être utilisé sur tous les navigateurs, mais si vous souhaitez créer un favicon pour chaque utilisation possible, suivez le guide ci-dessous :
- 16px : pour une utilisation générale dans tous les navigateurs, peut être affiché dans la barre d’adresse, les onglets ou les vues des signets
- 24px : site épinglé dans Internet Explorer 9
- 32px : Nouvel onglet dans Internet Explorer, bouton de la barre des tâches dans Windows 7+ et barre latérale « Lire plus tard » de Safari
- 57px : Écran d’accueil iOS standard (iPod Touch, iPhone première génération vers 3G)
- 72px : icône de l’écran d’accueil de l’iPad
- 96px : favicon utilisé par la plate-forme Google TV
- 114px : icône de l’écran d’accueil de l’iPhone 4+ (deux fois la taille standard de l’écran Retina)
- 128px : Chrome Web Store
- 195px : numérotation abrégée Opera
Quels formats dois-je utiliser pour un favicon ?
Contrairement au passé où un favicon devait être au format Windows ICO, il existe maintenant quelques options de formatage différentes. Vous trouverez ci-dessous un aperçu de chacun plus en profondeur :
- ICO Windows : L’ICO est de loin le fichier le plus largement pris en charge. Les avantages de l’ICO sont qu’il peut contenir plusieurs résolutions et profondeurs de bits, ce qui fonctionne très bien et est particulièrement utile pour Windows. ICO propose également une icône de 32 pixels qui est utile pour la barre des tâches Internet Explorer Windows 7. C’est également le seul format qui n’utilise pas l’élément <link>.
- PNG : Le format PNG est utile pour plusieurs raisons différentes. Vous n’avez besoin d’aucun outil spécial pour créer un fichier PNG, ce qui le rend très convivial. Il nous donne la plus petite taille de fichier possible et prend en charge la transparence alpha. Cependant, un gros inconvénient de ce style est qu’Internet Explorer ne prend pas en charge un fichier PNG ; il ne prend en charge que les fichiers ICO.
- SVG : ce format peut être utilisé et est pris en charge par les navigateurs Opera.
- GIF : Ce format n’offre aucun avantage en dehors d’une utilisation sur les anciens navigateurs. S’ils attireront davantage l’attention des utilisateurs, ils ont également tendance à irriter et le consensus général est qu’ils ne sont en aucun cas un avantage.
- JPG : Bien que ce format puisse être utilisé, il n’est pas courant et ne fournira pas une qualité de résolution aussi bonne que PNG. De plus, en raison de la petite taille du favicon, le JPEG perd tous ses avantages.
- APNG : Il s’agit d’une version animée de PNG et, bien qu’elle puisse être prise en charge par Firefox et Opera, elle présente les mêmes problèmes que le GIF animé, distrayant les utilisateurs lorsqu’ils regardent leur interface.
