Favicon IE

Bonjour,

Je n'arrive pas à voir mon favicon sur IE 8.
J'ai pris soin d'ajouter l'Url dans mes favoris et de vider mes cookies. J'ai fermé mon navigateur et en l'ouvrant j'ai fait plusieurs fois F5.
Est-ce que j'ai oublié quelque chose?

Voici mes deux lignes de code sur le site http://www.surplus-inventaire.com.

<link rel="shortcut icon" type="image/x-icon" hrefhttp://www.surplus-inventaire.com/favicon.ico" />
<link rel="icon" type="image/x-icon" href="http://www.surplus-inventaire.com/favicon.ico" />

Bonjour britanicus75,

Regarde ce cours plus particulièrement la partie nommée Et Internet Explorer ?

J'ai appliqué cette méthode sur mon site et je peux contempler mon magnifique favicon depuis internet explorer 8 .

Merci pour l'information donc je dois avoir un .ico + un png.
J'ai crée mon favicon sur le site favicon.cc il est animé.
Sais-tu comment je pourrais le transformer en png toujours en gardant l'animation?

Oui, tu peux créer un favicon en .png pour les navigateurs comme Firefox, Chrome, Safari...
Néanmoins, comme le dit le cours, Internet Explorer ne supporte que le format .ico en ce qui concerne les favicon.

D'où l'intérêt de mettre ce commentaire conditionnel :

<!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /><![endif]-->

en adaptant le chemin d'accès au favicon.

Par exemple, si ton favicon se situe dans un dossier nommé "images", il faudrait modifier le href comme ceci :

<!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico" /><![endif]-->

a écrit :
J'ai crée mon favicon sur le site favicon.cc il est animé.
Sais-tu comment je pourrais le transformer en png toujours en gardant l'animation?

Honnêtement je ne sais pas mais peut-être que quelqu'un d'autre pourra t'apporter un peu de lumière sur cette question .
Modifié par jQz (28 Aug 2009 - 19:38)

Bonjour,

J'ai mis un favicon en gif pour IE mais sans succès même si j'ai supprimé ma cache et cookies et que j'ai fermé mon navigateur.
Mon favicon n'affiche pas dans IE.

Est-ce qu'il me manque quelque chose?

Voici mon code :

<link rel="shortcut icon" type="image/x-icon" hrefhttp://www.surplus-inventaire.com/favicon.ico" />
<link rel="icon" type="image/x-icon" href="http://www.surplus-inventaire.com/favicon.ico" />
<!--[if IE 6]>
<link rel="icon" type="image/gif" href="http://www.surplus-inventaire.com/favicon.gif" />
<![endif]-->

Oui, il y a un problème.

Internet Explorer ne supporte que les favicon au format .ico.
Étant donné que le tient est au format .gif et non.ico, Internet Explorer ne l'affichera pas.

Il faut donc que tu modifies l'extension de ton favicon en .ico et que tu modifies l'extension du favicon dans le commentaire conditionnel.
Modifié par jQz (28 Aug 2009 - 22:39)

Je ne comprend pas très bien.
Si IE n'accepte pas le .ico je dois donc lui fournir un .gif.
Le commentaire pour <!--[if IE]> doit bien être en .gif puisqu'il ne lit pas le .ico

C'est toi qui n'as pas comprit ma phrase.

Pour faire simple, reporte toi à la lecture de ce cours qui explique comment bien procéder.

Je cite la phrase du cours :

a écrit :
Notez qu'Internet Explorer ne supporte que le .ico.

Pour le favicon, sous Internet Explorer, aucun format ne marche sauf le .ico.
Le commentaire conditionnel est là pour faire comprendre à Internet Explorer qu'il doit afficher un favicon.
Modifié par jQz (28 Aug 2009 - 23:01)

Bon, alors reprenons méthodiquement:

1. Ton code HTML est invalide. Tu as une erreur de syntaxe (oubli de deux caractères). Ça tombe mal, ça concerne le premier élément link, celui avec la syntaxe pour Internet Explorer. Du coup, il est tout bonnement ignoré.

2. Le deuxième link est correct, il sera pris en compte... mais pas par IE qui ne reconnait pas cette syntaxe (valeur "icon" plutôt que "shortcut icon").

3. Le troisième link, dans le commentaire conditionnel pour IE... n'utilise pas la bonne syntaxe. C'est dommage...

4. De toute façon, IE fait en général une requête pour un fichier favicon.ico à la racine du domaine. Donc il est probable qu'il récupère ce fichier de toute façon.

5. Le problème, c'est que ce fichier a une extension .ico, il est servi avec le type MIME image/x-icon... mais c'est un GIF. Tu mens au navigateur, ça doit pas lui plaire.

6. À ma connaissance, IE ne gère que le format .ico pour les favicons. Donc tu te fatigues pour rien. Il faut lui servir une vraie image au format image/x-icon, pas un GIF.

Tu peux servir un GIF aux autres navigateurs, et un .ico à IE. Il suffit du code suivant:

<link rel="shortcut icon" type="image/x-icon" href="/img/favicon.ico" />
<link rel="icon" type="image/gif" href="/img/image.gif" />

Ceci dit, les favicons qui bougent, moi ça m'énerve.

jQz a écrit :
Pour le favicon, sous Internet Explorer, aucun format ne marche sauf le .ico.

Précisons: une vraie image au format image/x-icon, pas une image dans un autre format à laquelle on aurait donné une extension .ico.

a écrit :
6. À ma connaissance, IE ne gère que le format .ico pour les favicons. Donc tu te fatigues pour rien. Il faut lui servir une vraie image au format image/x-icon, pas un GIF.

+1.

a écrit :
Tu peux servir un GIF aux autres navigateurs, et un .ico à IE. Il suffit du code suivant:

<link rel="shortcut icon" type="image/x-icon" href="/img/favicon.ico" /> 
<link rel="icon" type="image/gif" href="/img/image.gif" />

On peut aussi utiliser un commentaire conditionnel comme l'explique ce cours ?

a écrit :
Ceci dit, les favicons qui bougent, moi ça m'énerve.

+1.

a écrit :
Précisons: une vraie image au format image/x-icon, pas une image dans un autre format à laquelle on aurait donné une extension .ico.

Je n'ai pas très bien compris, tu parles d'une image qui aurait deux extensions ?
Par exemple une image .png à laquelle on aurait rajoutée l'extension .ico ce qui est déconseillé, incorrect et provoque des bogues ?
Modifié par jQz (28 Aug 2009 - 23:16)

jQz a écrit :

Précisons: une vraie image au format image/x-icon, pas une image dans un autre format à laquelle on aurait donné une extension .ico.

Je n'ai pas très bien compris, tu parles d'une image qui aurait deux extensions ?
Par exemple une image .png à laquelle on aurait rajoutée l'extension .ico ce qui est déconseillé, incorrect et provoque des bogues ?
Florent parle d'une image avec une extension quelconque (.jpg, .gif, .png, etc...) que l'on renommerait en modifiant son extension en ".ico"
ex: "monfavicon.png" deviendrait "monfavicon.ico" sans autre forme de procès...

Ce qui bien évidemment ne convertira pas de ce fichier un fichier icone.

a écrit :
Florent parle d'une image avec une extension quelconque (.jpg, .gif, .png, etc...) que l'on renommerait en modifiant son extension en ".ico"
ex: "monfavicon.png" deviendrait "monfavicon.ico" sans autre forme de procès...

Ce qui bien évidemment ne convertira pas de ce fichier un fichier icone.

D'accord, merci pour l'explication.

jQz a écrit :
On peut aussi utiliser un commentaire conditionnel comme l'explique ce cours ?

Je veux bien, mais je n'en vois pas l'utilité.

Par ailleurs je me méfie un peu de ce tutoriel, qui profère quelques bêtises telles que:
- «Les fichiers .ico n'acceptent que 16 couleurs.» Complètement faux, le format image/x-icon de Microsoft est celui utilisé en interne par Windows pour les icônes d'applications; il accepte plusieurs dimensions d'images dans un même fichier sur des «calques» séparés, des couleurs indexées 16 ou 256 couleurs, ou encore des couleurs réelles avec couche alpha pour la transparence.
- «Internet Explorer ne respecte pas les standards du web, et qu'il vous faudra faire deux lignes différentes, pour les deux navigateurs.» Il n'y a pas de standard à ce sujet; rel="icon" n'est pas spécifié dans HTML4 ou ailleurs, c'est juste une convention utilisée arbitrairement par une partie des navigateurs. On peut noter que HTML5 pourrait standardiser rel="icon", et ajouter quelques subtilités comme la déclaration des formats embarqués dans l'image. Ça reste un brouillon et on ne peut pas attendre de Microsoft qu'ils aient implémenté dans IE 5, 6, 7 ou 8 un point proposé comme norme en 2007 ou 2008, encore en brouillon en 2009 (le passage de HTML5 de Working Draft à Last Call est prévu pour cet automne).

Bonjour,

Evidemment c'est pas génial lorsqu'on commence avec des erreurs.
Bon maintenant un ico pour IE et un gif pour les autres. J'ai vidé ma cache, j'ai ajouté l'URL dans mes favoris et je ne vois toujours pas mon favicon.

J'ai surement manqué quelque chose!

<link rel="shortcut icon" type="image/x-icon" href="http://www.surplus-inventaire.com/favicon.ico" />
<link rel="icon" type="image/gif" href="http://www.surplus-inventaire.com/favicon.gif" />

Quand tu as crée ton favicon pour Internet Explorer, tu as renommée ton image .gif en .ico ou bien tu as réitérer un favicon que tu as enregistré en .ico par l'intermédiaire du logiciel de création ?

Hum, tes lignes de code me semble tout à fait correct, néanmoins, test avec le commentaire conditionnel :

<!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="http://www.surplus-inventaire.com/favicon.ico" /><![endif]-->

Mon favicon vient du site favicon.cc il est donc un vrai .ico.
J'ai ajouté le commentaire pour IE. Est-ce que c'est encore vrai que je dois vider ma cache a chaque fois et que je dois ajouter mon url dans mes favoris?
Je ne vois toujours pas mon favicon sur IE 8. Est-ce que vous le voyez vous?

<!--[if IE]>
<link rel="shortcut icon" type="image/x-icon" href="http://www.surplus-inventaire.com/favicon.ico" />
<![endif]-->
<link rel="icon" type="image/gif" href="http://www.surplus-inventaire.com/favicon.gif" />

Modifié par britanicus75 (29 Aug 2009 - 18:56)

britanicus75 a écrit :
Je ne vois toujours pas mon favicon sur IE 8. Est-ce que vous le voyez vous?

Non.

britanicus75 a écrit :
Mon favicon vient du site favicon.cc il est donc un vrai .ico.

Pour ma part, quand je veux créer des fichiers .ico à partir d'une icône sous un autre format, j'utilise le générateur de favicons de HTML-Kit et je n'ai eu aucun souci. Essaie ce générateur pour voir si ton problème ne vient pas de la façon dont le favicon a été généré.

britanicus75 a écrit :
Mon favicon vient du site favicon.cc il est donc un vrai .ico.

Firefox et Gimp me disent que c'est un GIF. Mon éditeur hexadécimal aussi me dit que c'est un GIF (les trois premiers octets du fichier correspondent aux caractères ASCII G, I et F...).

(Je suis pas sûr que le message soit passé, donc à tout hasard: ce fichier est un GIF.)

a écrit :
Firefox et Gimp me disent que c'est un GIF. Mon éditeur hexadécimal aussi me dit que c'est un GIF (les trois premiers octets du fichier correspondent aux caractères ASCII G, I et F...).

Je suis pas sûr que le message soit passé, donc à tout hasard: ce fichier est un GIF.)

Eh bien voilà la source du problème, tant que tu n'auras pas un vrai favicon.ico, Internet Explorer sera incapable de te l'afficher.