Créez un favicon en ligne à l’aide du générateur de .ico sur le site Favicon.cc. Le favicon c’est la petite image à gauche sur l’onglet d’une page web. Avec le site internet Favicon.cc vous pouvez créer votre favicon en ligne et en plus vous pouvez en faire une version animée. Créez vous un compte et sauvegardez tous vos favicons, une galerie des meilleurs Favicons est disponible elle vous permettra de trouver l’inspiration pour vos créations les plus folles.
Petite précision les Favicons animés marchent sur Firefox mais pas sur Chrome…
Comment créer son favicon ?
- Choisir une couleur
- Cliquez sur les carrés afin de peindre votre Favicon
- Téléchargez le Favicon lorsque vous avez terminé
- Placez le fichier favicon.ico dans le répertoire de votre serveur Web
- Publiez-le éventuellement sous la licence CC (Creative Commons)
Visiter le site Favicon.cc
Après avoir mis votre Favicon à la racine de votre site, il vous suffit de copier ce bout de code avant la fermeture de votre balise <HEAD>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
Étape par étape
Créer un favicon (l’icône qui apparaît dans l’onglet du navigateur pour un site web) est assez simple, surtout en utilisant un générateur de favicon en ligne. Voici les étapes générales pour créer un favicon avec un générateur :
1. Choisir un Générateur de Favicon
- Recherchez en ligne des générateurs de favicon. Il en existe plusieurs gratuits, comme Favicon.io, RealFaviconGenerator, Favicon.cc, etc.
- Comparez leurs fonctionnalités. Certains offrent des options de personnalisation avancées, tandis que d’autres sont plus basiques.
2. Préparation de l’Image de Base
- Sélectionnez une image ou un logo représentatif de votre site. Cette image doit être claire, même lorsqu’elle est réduite à de petites tailles.
- Assurez-vous que l’image a un fond transparent si vous ne voulez pas d’arrière-plan coloré.
3. Téléchargement de l’Image sur le Générateur
- Allez sur le site du générateur de favicon choisi.
- Téléchargez l’image ou le logo que vous avez choisi en suivant les instructions sur le site.
4. Personnalisation du Favicon
- Utilisez les outils du générateur pour ajuster votre image. Vous pourrez souvent modifier la taille, recadrer l’image, et parfois ajouter du texte.
- Assurez-vous que l’icône est lisible et visuellement attrayante même dans des tailles très petites (16×16 pixels est une taille courante pour les favicons).
5. Prévisualisation et Ajustements
- Utilisez la fonction de prévisualisation du générateur pour voir à quoi ressemblera votre favicon dans un onglet de navigateur.
- Effectuez les ajustements nécessaires si l’icône ne paraît pas claire ou attrayante.
6. Génération et Téléchargement du Favicon
- Une fois que vous êtes satisfait de l’apparence du favicon, utilisez le générateur pour créer le fichier de favicon.
- Téléchargez le fichier généré. Il sera généralement au format .ico ou .png.
7. Intégration sur votre Site Web
- Téléchargez le favicon sur le serveur de votre site web.
- Ajoutez la balise HTML appropriée dans l’en-tête de votre site web pour lier le favicon. Cette balise ressemble généralement à :
<link rel="icon" href="URL_de_votre_favicon.ico" type="image/x-icon">
.
8. Test et Validation
- Après avoir intégré le favicon, ouvrez votre site dans différents navigateurs pour vous assurer que le favicon s’affiche correctement.
- Si le favicon ne s’affiche pas immédiatement, effacez le cache de votre navigateur et réessayez.
Conseils Supplémentaires
- Gardez votre design simple et reconnaissable.
- Testez votre favicon sur différents appareils et navigateurs pour vous assurer de sa compatibilité.
- Utilisez des couleurs qui se démarquent et sont en harmonie avec le thème de votre site.
En suivant ces étapes, vous devriez être en mesure de créer facilement un favicon professionnel pour votre site web.