Petite Description : Les versions récentes des navigateurs Internet (IE, Mozilla, Opéra, …) permettent l’affichage d’une petite image (icône) dans les marque-pages (favoris), l’arborescence des agrégateurs de flux rss ou plus simplement dans la barre d’adresse. L’intéret principal réside dans une meilleure visibilité et identité du site.
Création d’une icone de type ICO (Ne respecte pas les standards)
Internet Explorer (dans sa version 6) n’accepte que le format ICO. Un outil en ligne mérite le coup d’oeil : FavIcon from Pics. Il permet de générer un favicon très facilement depuis n’importe qu’elle image de base. On peut même récupérer un Favicon animé. C’est beau.
- Cliquez sur le bouton “Parcourir”.
- Chargez votre image.
- Cliquez sur le bouton “Generate Favicon.ico”
- Une fois que le favicon est généré, cliquez sur le bouton “Download Favicon”. Vous obtiendrez ainsi une archive, au format zip à décompresser à l’aide d’un logiciel de décompression (Winzip, Winrar, 7-Zip …), contenant votre favicon.
Une fois votre favicon généré et copié à la racine de votre site, il vous suffira d’écrire le code suivant dans votre page internet :
<head>
...
<link href="favicon.ico" type="image/x-icon"
rel="shortcut icon" />
...
</head>
Mise en place d’un Favicon en respectant les standards
L’icône doit être format 16×16 ou 32×32.
<head>
...
<link rel="icon" type="image/png" href="/favicon.png" />
...
</head>
Les types disponibles sont :
- image/png: image PNG.
- image/gif: image GIF.
- image/jpeg: image JPEG.
- image/x-icon: image de type icon, attention ce format n’est pas un format standard.
Vosu trouverez sur cette page toutes les précisions et les outils disponibles dans le cadre de la création d’icone.
Merci à biloduo pour ces précisions concernant les règles d’accessibilité.
mai 7th, 2006 at 9:47
ouai ou tu marque ca mr cdi
mai 7th, 2006 at 11:45
Ben entre les balises < head > de ta page (voir mon code source).
Donc tu ne peux pas Mr CSS. Overblog ne te donne pas l’accès au source de ta page internet… :(
mai 9th, 2006 at 10:49
Super !!! Je me suis toujours demandé comment on insérait ça !
mai 11th, 2006 at 1:34
Nadège> Ben à présent tu n’auras plus d’excuses… :D
novembre 9th, 2006 at 22:40
Parfait merci !!
novembre 9th, 2006 at 23:14
Attention aux standards du web … utilisé un rel=’shorcut icon’ n’est pas conforme. Il est utilisé en général parce que IE n’accepte que cette formule là … et encore !
De plus les fichiers .ico ne sont de nouveaux pas repris dans les formats standards du web …
Mais comment faire me diriez-vous … Pas de stress, une petit tour sur le site de base du XHTML et vous saurez tout : http://www.xhtml.net/xhtmlcss/favicon‘>biloduo Says:
novembre 9th, 2006 at 23:19
Il y un léger stress avec tes liens … je réessaye à nouveau sous plusieurs formes, où sinon, n’hésitez pas à me contacter ou à approfondir les recherches par vous même …
Lien v.1 : http://www.xhtml.net/xhtmlcss/favicon
Lien v.2 : http://www.xhtml.net/xhtmlcss/favicon
Lien v.3 : www . xhtml . net / xhtmlcss / favicon (enlevez les espaces)
septembre 15th, 2008 at 22:42
Bonjour,
J’utilise pour mon site izispot et kan je marque il ne me l’accepte pourquoi?
Merci de votre aide c tres important.
Bonne soirée