Outil Favicon - Guide

L'outil Favicon transforme une image, y compris une image générée par l'IA, en tous les fichiers favicon dont votre site Web a besoin.

Moyens de générer

Il y a deux façons :

  1. Téléchargez le flux: téléchargez votre propre image et générer des favicons
  2. AI flow: créez une image à partir d'une invite ou d'une URL et créez des favicons à partir de celle-ci

Exigences

Utilisez une image carrée avec un motif clairement reconnaissable. A partir de 512×512 pixels, il devient utilisable, plus grand ne fait pas mal.

Astuce : À 16×16 pixels, vous ne pouvez plus voir les détails. Un logo simple fonctionne beaucoup mieux là-bas.
L'outil Favicon avec téléchargement d'images et génération d'images AI
L'outil Favicon avec téléchargement d'images et génération d'images AI

Option A: Débit de chargement

  1. Ouvrir l'outil Favicon
  2. Sous Télécharger l'image, choisissez votre logo
  3. Cliquez sur Générer les faucons
  4. Télécharger ensuite le ZIP ou les fichiers individuels

Option B: débit AI

  1. Ouvrez la zone de génération d'images AI du côté droit de l'outil
  2. Saisissez soit une URL d'invite ou une URL d'accès
  3. Cliquez sur Générer l'image avec AI
  4. Vérifiez l'aperçu et cliquez sur Utiliser l'image
  5. SEOFuxx crée les favicons à partir de lui

Fichiers actuellement générés

  • favicon.ico
  • favicon-16x16.png
  • favicon-32x32.png
  • favicon-48x48.png
  • apple-touch-icon.png
  • android-icon-192x192.png
  • android-icon-256x256.png
  • android-icon-512x512.png
  • badge-72x72.png
  • maskable_icon.png
  • push-192x192.png

Les ajouter à votre HTML

Ces balises appartiennent au <head> au minimum:

<link rel="icon" href="/favicon.ico" sizes="any" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />

Vérifiez après l'ajout

Effacer le cache du navigateur, recharger la page et regarder l'icône de l'onglet. Sur votre téléphone, regardez aussi l'affichage mobile.

Problèmes courants

Favicon ne met pas à jour

  • Faites un rechargement dur (Ctrl+F5)
  • Essayez aussi une fenêtre incognito
  • Effacer le CDN ou le cache du serveur si vous en utilisez un

L'image AI ne correspond pas

  • Phrase l'invite plus précisément
  • Essayez une URL différente
  • Générer une nouvelle image d'IA et utiliser celle-ci à la place
Note: Les nouveaux favicons prennent souvent un certain temps pour apparaître dans les résultats de recherche. C'est à Google, pas à toi.

Ce contenu est-il utile ?

·