Voici un mini-guide qui vous apprendra comment créer et ajouter un Favicon à votre site web d’après une image ou dessiné pixel par pixel.
Tous les sites qui présentent un minimum de professionnalisme disposent d’un Favicon. Pour ceux qui ne savent pas ce que c’est: il s’agit de la petite icone (16px sur 16px) qui accompagne et symbolise le site dans l’onglet de votre navigateur internet. C’est un excellent moyen pour se souvenir de votre site.
Le mot Favicon est le mélange des mots anglais « Icon » et « Favorites ». Nous pouvons les traduire en français par « marque-page » et « icônes ». C’est en quelque sorte l’image, l’icône qui est associée à votre site lorsque ce dernier est intégré dans un sélection de favoris, dans la barre d’adresse, les onglets et certains raccourcis. Insérer un Favicon original sur son site est désormais une chose devenue vitale pour optimiser sa présence et visibilité sur Internet.
Exemple de Favicons
Afin de vous faire une idée de favicons, voici une image trouvée sur le site de npam.org qui reprend quelques-un des favicons les plus vus sur le net. La plupart appartiennent à des marques très connues comme Google, Yahoo, Facebook, Wikipedia, MSN etc… Cliquez sur l’image pour accéder au site source et la voir en plus grand.
Comment créer un Favicon
La création d’un Favicon est très simple. Il suffit de vous rendre sur un outil en ligne qui crée des Favicons gratuitement. Je vous propose celui que je préfère: Favicon.cc. Il est simple et très efficace. Vous pourrez créer un Favicon soit en le dessinant pixel par pixel, soit en important une image de votre choix.
Une fois votre image générée et téléchargée sur votre disque dur, renommez la si ce n’est pas déjà fait en favicon.ico.
Au cas ou vous n’aimeriez pas l’outil en ligne favicon.cc, voici un article rédigé par Cédric d’ Autourduweb.fr et qui a sélectionné pour nous une liste de 8 sites pour générer gratuitement des favicons en ligne.
Comment ajouter un Favicon à votre site
Pour ajouter le Favicon nouvellement créé, il faut coller le fichier favicon.ico par FTP à la racine de votre site Web (la ou se trouve votre fichier index.php).
Ensuite, il suffit d’insérer cette balise META dans la partie <head></head> de votre site: (la 2ème ligne du code est nécessaire pour que votre Favicon soit compatible avec Internet Explorer).
<link rel="icon" type="image/png" href="favicon.png" /> <!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /><![endif]-->
Pour ceux qui sont sous WordPress, rendez-vous dans votre éditeur de thème (Apparence -> Éditeur). A droite de l’écran, trouvez le fichier header.php, et cliquez sur Header. Vous accédez au fichier .php de l’en-tête de votre site; c’est ici que vous trouverez les balises <head></head> à l’intérieur desquelles vous devrez collez le code présenté ci-dessus.
No comments so far.
Be first to leave comment below.