Site Web

Comment ajouter un favicon à votre site web ?

ajouter-favicon

Introduction

La plupart des sites Web en ligne ont leurs propres logos et dans la plupart des cas, ils sont utilisés comme favicons Si vous ne savez pas ce qu’est un favicon, voici un exemple :

favicon

Avoir un favicon sur votre site Web est bien sûr beaucoup mieux que de ne rien avoir. Votre site Web paraîtra plus professionnel.

Dans ce tutoriel, nous allons apprendre quelques façons simples sur la façon d’ajouter un favicon à votre site Web.

Ce dont vous aurez besoin

Avant d’ajouter une favicon, assurez vous d’avoir les éléments suivants:

  • Une image carrée que vous souhaitez ajouter en tant que favicon de votre site Web
  • Accès aux fichiers de votre site Web

Option 1 – Laisser le navigateur obtenir automatiquement votre favicon (pas besoin de changer le code du site)

La plupart des navigateurs détectent automatiquement le fichier favicon.ico situé dans votre dossier de site Web et le définissent comme le favicon de votre site. C’est la façon la plus simple d’ajouter un favicon à votre site.

    1. Tout d’abord, vous devez avoir une image aux dimensions carrées (64×64 par exemple) dans n’importe quel format d’image (jpg, bmp, gif, png) afin qu’elle apparaisse sur le navigateur. Bien sûr, les images non carrées fonctionnent également, cependant, ces icônes peuvent ne pas paraître professionnelles.
    2. Cette option nécessite la conversion de votre image au format .ico . Il ya beaucoup d’outils en ligne pour faire cela, cependant, dans ce tutoriel, nous utiliserons  convertico.com .
    3. Sur convertico.com vous verrez un bouton pour sélectionner et envoyer votre image.ajouter favicon
    4. Cliquez sur le bouton et sélectionnez l’image que vous voulez. Après cela votre image sera automatiquement convertie et apparaîtra sur le côté droit du site. Vous pourrez la télécharger:

ajouter favicon

  1. Téléchargez votre image en cliquant sur Télécharger et enregistrez votre fichier .ico n’importe où sur votre ordinateur.
  2. Renommez maintenant le fichier en favicon.ico , car le navigateur ne prendra en compte que ce nom de fichier.
  3. La dernière étape consiste à télécharger ce fichier dans le dossier où se trouvent vos fichiers de site Web. Pour l’envoi, vous pouvez utiliser le Gestionnaire de fichiers – en anglais- ou un client FTP . Sur les serveurs basés sur Linux, le dossier est généralement public_html. Cependant, cela peut être différent selon votre hébergeur. Dans ce cas, mieux vaut consulter le fournisseur d’hébergement.

Lorsque votre fichier favicon.ico aura été envoyé sur votre site Web, le navigateur le récupérera automatiquement et affichera l’image dans le navigateur.

ajouter favicon

IMPORTANT: Si vous ne voyez pas le nouveau favicon, effacez le cache de votre navigateur et redémarrez-le.

Option 2 – Utiliser une image de votre site et la spécifier dans le code de votre site

Si vous pensez que convertir votre image à un autre format est une perte de temps, vous pouvez utiliser une image de votre site comme favicon de votre site Web.

  1. Tout d’abord, vous devez avoir une image aux dimensions carrées (64×64 par exemple) dans n’importe quel format d’image (jpg, bmp, gif, png) afin qu’elle apparaisse sur le navigateur. Bien sûr, les images non carrées fonctionnent également, cependant, ces icônes peuvent ne pas paraître professionnelles.
  2. Envoyez ce fichier sur votre site Web. Sur les serveurs basés sur Linux, le dossier est généralement public_html. Cependant, cela peut être différent selon votre hébergeur. Dans ce cas, mieux vaut consulter le fournisseur d’hébergement.
  3. Maintenant, vous devez spécifier l’image que vous souhaitez utiliser comme favicon dans le code de votre site Web. Ajoutez cette ligne entre les balises <head></head> dans le code de votre site Web:
<link rel="shortcut icon" type="image/png" href="/favicon.png"/>

IMPORTANT: Dans type=”image/png” remplacez png par le format de votre image et remplacez favicon.png par votre nom de fichier.

Le code HTML ressemblera à ceci :

ajouter favicon

Votre image devrait maintenant être affichée comme le favicon de votre site :

ajouter favicon

IMPORTANT: Si vous ne voyez pas le nouveau favicon, effacez le cache de votre navigateur et redémarrez-le.

Conclusion

Vous avez appris deux façons d’ajouter un favicon à votre site Web. C’est un petit travail dans le processus de développement d’un site Web, mais qui est essentiel pour rendre votre site professionnel.

J’espère vous avoir été utile et nous nous retrouvons bientôt pour un prochain tutoriel ! 😉

Ajouter un commentaire

Cliquez ici pour poster un commentaire

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Commencez à économiser dès maintenant !

Hébergement et nom de domaine tout-en-un à partir de

2
45
/mois
>