favicon ne fonctionne pas dans IE
J'ai un site utilisant un favicon.ico personnalisé. Le favicon s'affiche comme prévu dans tous les navigateurs sauf IE. Lorsque j'essaie d'afficher le favicon dans IE, j'obtiens le grand x rouge; lors de l'affichage du favicon dans un autre navigateur, il s'affiche très bien. La source de la page comprend et cela fonctionne dans d'autres navigateurs. Merci pour vos pensées.
EDIT: RESOLU: La source du problème était que le fichier était un jpg renommé ico. J'ai créé le fichier comme ico et il fonctionne comme prévu. Merci pour votre contribution.
D'accord, vous n'avez pas été aussi utile (fournir la source aurait été vraiment utile!) Mais c'est parti ... Quelques points à vérifier:
Le code est-il comme ceci:
<link rel="icon" href="http://www.example.com/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="http://www.example.com/favicon.ico" type="image/x-icon" />
Est-ce dans le <head>?
L'image est-elle un fichier réel ico? (renommer un bitmap n'est pas un vrai .ico! Format légèrement différent)
Cela fonctionne-t-il lorsque vous ajoutez la page en tant que signet?
Dans IE et FireFox, le favicon.ico n'est demandé que sur la première page visitée sur le site, ce qui signifie que si le favicon.ico nécessite une connexion (par exemple, votre site est fermé) site et nécessite une connexion), l'icône ne s'affichera pas.
La solution consiste à ajouter une exception pour le favicon.ico, par exemple dans ASP.Net que vous ajoutez dans le web.config:
<location path="favicon.ico">
<system.web>
<authorization>
<allow users="*" />
</authorization>
</system.web>
</location>
<link rel="shortcut icon" type="image/x-icon" href="FolderName/favicon.ico" />
- Votre favicon.ico doit être placé entre head tag
- taille: 16 X 16
- et pour Internet Explorer, il doit être transparent (la partie blanche extérieure ne doit pas être visible)
Si quelqu'un se résume à cette réponse:
Même problème: ne fonctionnait pas en IE (y compris IE 10), fonctionnait partout ailleurs.
Il s'avère que le fichier n'était pas un "vrai" fichier .ico. J'ai corrigé cela en le téléchargeant sur http://www.favicon.cc/ puis en le téléchargeant à nouveau.
Je l'ai d'abord testé en générant un fichier .ico aléatoire sur ce site et en l'utilisant à la place de mon fichier d'origine. J'ai vu que ça fonctionnait.
Je sais que c'est un sujet très ancien maintenant, mais comme c'est le premier qui est apparu dans ma recherche Google, je voulais juste y ajouter ma solution:
J'ai également rencontré ce problème avec une icône fournie par un client. Il s'affiche dans tous les navigateurs à l'exception d'IE. L'ajout des balises link ou meta n'a pas fonctionné, j'ai donc commencé à regarder le format du fichier d'icône.
Cela semblait être un fichier icône valide (pas seulement une image renommée), mais ce qui l'a finalement résolu était de le convertir en image, l'enregistrer en tant que GIF, puis le convertir retour à une icône.
Assurez-vous également de vider le cache IE pendant les tests).
Avez-vous essayé de placer l'icône sur l'URI "/favicon.ico "? IE ne connaît peut-être pas la façon dont la balise de lien s'y réfère.
Plus d'informations de W .
Si vous avez tout essayé ci-dessus et que cela ne fonctionne toujours pas dans IE, vérifiez vos paramètres IIS si vous utilisez un serveur Windows. Assurez-vous que le paramètre En-têtes HTTP> "Activer l'expiration de contenu", IS NOT SET to "Expire immediatement"
J'ai eu exactement ce problème et rien ne semblait fonctionner. Après avoir effacé le cache du navigateur d'innombrables fois et même mis à jour IE vers v9, j'ai trouvé ceci: http://favicon.htmlkit.com/favicon/
Le lien ci-dessus a résolu le problème parfaitement pour moi!
Aucune des solutions ci-dessus n'a fonctionné pour moi.
Tout d'abord, je me suis assuré que l'icône était au bon format en utilisant le site Web pour créer les favicons suggérés ci-dessus.
J'ai ensuite renommé l'icône de 'favicon.ico' en 'myicon.ico' et ajouté le code suivant à ma page (dans le <head> Mots clés):
<link rel="shortcut icon" href="myicon.ico" type="image/x-icon" />
L'icône se trouve dans le même dossier que la page.
Cela a résolu le problème pour moi. Le problème dans les coulisses avait probablement quelque chose à voir avec la mise en cache d'IE, mais je ne suis pas sûr.
Envie de partager l'URL? De nombreux navigateurs prennent en charge les favicons au format (par exemple) png alors que IE a souvent eu des problèmes. - Les anciennes versions de IE ne vérifiaient pas la source html pour l'emplacement). du favicon, mais a simplement essayé d'obtenir "/favicon.ico" du serveur Web.
cela semble être un problème de pages ASPX, je n'ai jamais pu afficher de favicon dans aucune page pour IE (tous les autres oui Chrome, FF et safari) les seuls sites que j'ai vus qui sont l'exception à cette règle sont bing.com, msdn.com et d'autres qui appartiennent à MS et fonctionnent sur asp.net, il y a quelque chose qu'ils ne nous disent pas! même les sites de renommée mondiale ne peuvent pas apparaître dans IE ex: manu.com (équipe sportive la plus consultée au monde) site aspx et ne parvient pas à afficher le favicon sur IE. http://www.manutd.com/favicon.ico = affiche l'icône.
Veuillez me prouver le contraire.
En ce qui concerne les incompatibilités avec IE9, je suis tombé sur ce billet de blog qui donne des conseils pour créer un favicon reconnu par IE9.
Essentiellement, essayez de créer un favicon avec le site suivant: http://www.xiconeditor.com/
J'ai utilisé une fois un PNG comme favicon.ico et il s'affichait dans tous les navigateurs sauf IE. Peut-être que quelque chose dans le fichier ne le reconnaît pas par IE. Assurez-vous également que c'est 32x32. Je ne sais pas si c'est important. Mais c'est quelque chose que je devais m'assurer pour le voir dans IE.
J'espère que ça aide. Essayez d'utiliser un fichier ico d'un autre endroit juste pour voir si cela fonctionne.
Essayez quelque chose comme:
Ajouter au html:
<link id="shortcutIcon" rel="shortcut icon" type="image/x-icon">
<link id="icon" rel="icon" type="image/x-icon">
Ajouter un script minifié après la balise:
<script type="text/javascript">
(function(b,c,d,a){a=c+d+b,document.getElementById('shortcutIcon').href=a,document.getElementById('icon').href=a;}(Math.random()*100,(document.querySelector('base')||{}).href,'/assets/images/favicon.ico?v='));
</script>
où
- Chemin d'accès associé à '/assets/images/favicon.ico' vers .ico
- ? v = 'Math.random () * 100' - pour forcer la mise à jour du navigateur favicon.ico
Avant le test, effacer l'historique: (ctr + shfit + del)
Cela peut aider les autres.
Pour moi, ICON ne s'affichait pas dans IE, même après avoir suivi toutes les étapes.
Enfin, j'ai trouvé une note dans MSDN Dépannage des icônes de raccourci .
Vérifiez qu'Internet Explorer peut stocker l'icône de raccourci dans le dossier Fichiers Internet temporaires. Si vous avez configuré Internet Explorer pour ne pas conserver de cache, il ne pourra pas stocker l'icône et affichera l'icône de raccourci Internet Explorer par défaut à la place.
J'utilisais IE en mode "En privé", une fois que j'ai vérifié en mode normal .... Icône Fav affichée correctement.
Exécutez Internet Explorer en tant qu'administrateur. Si vous ouvrez IE en mode normal, le favicon ne s'affichera pas sur IE 11 (Win 7). Je ne suis pas sûr du comportement sur les autres versions de navigateurs) .
Ce croiseur de travail pour moi (IE11, Edge, CHROME, FIREFOX, OPERA), utilisez https://www.icoconverter.com/ pour créer un fichier .ico
<link data-senna-track="temporary" href="${favicon_url}" rel="Shortcut Icon" />
<link rel="icon" href="${favicon_url}" type="image/x-icon" />
<link rel="shortcut icon" href="${favicon_url}" type="image/x-icon" />
Vérifiez les en-têtes de réponse pour votre favicon. Ils ne doivent pas inclure "Cache-Control: no-cache".
Vous pouvez vérifier cela depuis la ligne de commande en utilisant:
curl -I http://example.com/favicon.ico
ou
wget --server-response --spider http://example.com/favicon.ico
(ou utilisez un autre outil qui vous montrera les en-têtes de réponse)
Si vous voyez "Cache-Control: no-cache" là-dedans, ajustez la configuration de votre serveur pour supprimer cet en-tête de la réponse favicon ou définir un âge maximal.
LA SOLUTION :
J'ai créé une icône à partir d'un fichier png existant en changeant simplement l'extension de l'image de png en ico. J'utilise drupal 7 thème bartik, donc j'ai téléchargé l'icône de raccourci sur le serveur et cela a fonctionné pour Chrome et Firefox mais pas IE. En outre, l'icône d'image était blanc-vierge sur le bureau.
Ensuite, j'ai suivi les conseils de certains gars ici et j'ai réduit la taille de l'image à 32x32 pixels à l'aide d'un éditeur d'image (gimp 2 <<
J'ai téléchargé l'icône de la même manière que précédemment, et cela a bien fonctionné pour tous les navigateurs.
Je vous aime sur stackoverflow, vous m'avez aidé à résoudre BEAUCOUP de problèmes. JE VOUS REMERCIE!
Je vois différents comportements entre Windows 10 et Windows Server 2016 et entre IE et Edge. J'ai testé en utilisant www.Microsoft.com.
Windows Server 2016 IE 11:
Favoris: icône du site
Barre d'adresse: icône du site
Onglet Navigateur: icône du site
Windows 10 IE 11:
Favoris: icône du site
Barre d'adresse: icône générique bleue-E
Onglet du navigateur: icône générique bleu-E
Windows 10 Edge:
Favoris: icône du site
Barre d'adresse: pas d'icône
Onglet Navigateur: icône du site
Quel est le problème avec Windows 10 IE montrant l'icône générique?
Merci pour toute votre aide.J'ai essayé différentes options mais celle ci-dessous a fonctionné pour moi.
<link rel="shortcut icon" href="/favicon.ico" >
<link rel="icon" type="/image/ico" href="/favicon.ico" >
J'ai ajouté les deux lignes ci-dessus dans l'en-tête de ma page et cela a fonctionné dans tous les navigateurs.
Merci
De plus, des erreurs de certificat (https) peuvent empêcher le favicon d'apparaître. L'équipe de sécurité a modifié les paramètres de notre serveur et j'ai commencé à afficher "Il y a un problème avec le certificat de sécurité de ce site Web". Cliquez sur "Continuer vers ce site Web (non recommandé)." m'a emmené sur le site Web mais ne montrait PAS le favicon.