Qu'est-ce qu'un favicon ? Définition e-commerce

Favicon e-commerce : définition icône onglet navigateur, formats tailles, vs logo branding, configuration Shopify thème et points clés.

Mis à jour le

4 juin 2026

Le favicon (favorite icon) est la petite icône affichée dans l'onglet du navigateur, les favoris, l'historique et parfois sur l'écran d'accueil mobile. En e-commerce, il reprend souvent le symbole ou la lettre de la marque pour rendre la boutique en ligne reconnaissable quand plusieurs sites sont ouverts. Élément discret du branding, il renforce confiance et mémorisation.

Sommaire

Définition simple : favicon

L’intérêt du favicon pour une boutique en ligne

Utilisation avec Shopify

En bref

Termes associés, FAQ et aller plus loin

Définition simple : favicon

Le favicon est déclaré dans le <head> HTML de chaque page via une balise <link rel="icon" …>. Le navigateur le charge automatiquement.

Formats et tailles courants :

PNG : 32×32 px ou 16×16 px (standard web).; ICO : fichier multi-tailles (legacy, encore supporté).; SVG : vectoriel, net à toute échelle (navigateurs modernes).

Apple Touch Icon : 180×180 px pour écran d'accueil iOS.; Android / PWA : 192×192 px, 512×512 px (manifest web app).

Distinctions utiles :

Favicon vs logo : le logo complet (nom + picto) s'affiche dans le header ; le favicon est une version simplifiée lisible en 16 pixels.; Favicon vs branding : le favicon est un composant visuel ; le branding englobe identité, ton et expérience.; Favicon vs image Open Graph ( balise meta ) : l'OG image sert au partage social (1200×630 px) ; le favicon à l'onglet navigateur.

Favicon vs logo checkout : Shopify affiche aussi le logo sur le paiement ; peut être le logo complet, pas forcément le favicon.; Favicon site vs icône app : même logique visuelle, fichiers parfois distincts (Shop app, PWA).

L’intérêt du favicon pour une boutique en ligne

Le favicon n'impacte pas directement le classement Google comme un title tag, mais il participe à la crédibilité et à l'UX perçue.

Reconnaissance : retrouver votre boutique parmi 15 onglets ouverts.; Confiance : favicon générique ou absent = signal « site bâclé ».; Favoris : icône visible quand le client bookmark la boutique.; Mobile : raccourci écran d'accueil avec icône marque.

Cohérence : aligné logo header, emails, réseaux sociaux.; Professionnalisme : détail attendu sur une boutique DTC sérieuse.; Retour direct : client revient via favori ou historique, icône mémorable.

Un favicon flou, pixelisé ou encore celui du thème Shopify par défaut affaiblit la première impression, surtout si le trafic compare plusieurs marques en parallèle.

Utilisation avec Shopify

Sur Shopify, le favicon se configure dans les paramètres du thème (Shopify Help Center, Theme settings).

Theme settings > Logo ou section Favicon selon thème (Dawn, etc.).; Upload : PNG carré recommandé (32×32 minimum, 512×512 idéal pour netteté).; Propagation : toutes les pages Online Store héritent du favicon.

Checkout : branding checkout (logo) séparé du favicon storefront.; Preview : vider cache navigateur si ancien favicon persiste.; Thème custom : balise link dans theme.liquid si besoin multi-format.

Points à vérifier marchand :

Exporter favicon depuis charte graphique (pas redimensionner logo horizontal).; Uploader dans Theme settings.; Vérifier Chrome, Safari, Firefox (desktop + mobile).

Contrôler favoris et écran d'accueil iOS.; Mettre à jour après rebranding.

Le favicon Shopify par défaut du thème non personnalisé est un signal fréquent de boutique en lancement : à remplacer dès que l'identité est définie.

En bref

Favicon = petite icône de marque dans l'onglet navigateur et les favoris.; Distinct logo header, image Open Graph, branding global.; Enjeux : reconnaissance, confiance, UX, cohérence visuelle.

Formats : PNG 32×32, SVG, Apple Touch Icon 180×180.; Shopify : Theme settings, upload carré simple, test multi-navigateurs.

Termes associés, FAQ et aller plus loin

Termes associés

Branding : identité dont le favicon est un élément.
Boutique en ligne : site où le favicon s'affiche.
Balise meta : métadonnées head dont favicon et OG.
UX : expérience incluant repères visuels navigateur.
CMS e-commerce : plateforme gérant le thème et favicon.

FAQ

Favicon et logo : même fichier ?

Pas forcément. Le logo header est souvent horizontal ou détaillé. Le favicon est une version iconique simplifiée (symbole ou initiale) optimisée pour 16 à 32 pixels.

Quelle taille pour un favicon Shopify ?

Uploadez un PNG carré d'au moins 32×32 px ; 512×512 px est recommandé pour un rendu net sur écrans haute densité. Shopify redimensionne automatiquement.

Le favicon impacte-t-il le SEO ?

Impact SEO direct faible. En revanche, il améliore reconnaissance, confiance et UX, ce qui peut indirectement favoriser retours et engagement sur la boutique.