Favicon nicht sichtbar

N

NinaJS

Grünschnabel
Hallo!

Ich habe auf meiner Website ein favicon eingebunden. Es wird jedoch nicht in allen Browsern angezeigt. Bei Firefox und im Android-phone klappt's, aber auch nur auf der Startseite.

Ich habe folgenden Code im Head-Bereich in der index.html Datei eingegeben (und das Icon voher ausgehend von eine PNG-Datei generieren lassen).

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

Kann mir jemand sagen, wie ich es machen muss, damit das Icon auf allen Seiten und in allen Browsern sichtbar ist?

Gruß
NinaJS
 
Hi
1. manche Browser lesen nur die Datei favicon.ico im höchsten Verzeichnis.
2. Bist du dir sicher, dass die Favicon-Datei das richtige Format hat?

ich hab mir mal ne Liste zusammen gesammelt, die so die wichtigsten Punkte enthalten sollte:
• alte Versionen des Internet Explorers ignorieren alles außer der /favicon.ico
• offizieller Standard:
HTML: 
<link rel="icon" ...
und PNG-Dateien sollte von allen aktuellen Browsern unterstützt werden
• Safari auf iPhone/iPad verarbeitet nur speziell angepasste Dateien, siehe http://mathiasbynens.be/notes/touch-icons
• Opera Speed Dial: http://dev.opera.com/articles/view/opera-speed-dial-enhancements/
• W3C: http://www.w3.org/2005/10/howto-favicon, http://www.w3.org/html/wg/drafts/html/master/links.html#rel-icon
• Icon handbook: http://iconhandbook.co.uk/reference/examples/favicons/

und bisher sieht das dann bei mir so aus:
HTML: 
<link rel="icon" href="/logo.png" type="image/png"/>
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="/apple-touch-icon-114x114-precomposed.png"/>
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="/apple-touch-icon-72x72-precomposed.png"/>
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-57x57-precomposed.png"/>
 
Zuletzt bearbeitet:
Was heisst "höchstes Verzeichnis". Ist das nicht meine index-datei (hier die Startseite der Website)?

Mein Code ist jetzt:

<head>
<title>TITEL</title>


<link rel="stylesheet" type="text/css" href="style-css.css">

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

<meta charset="utf-8" />

<meta name="description" content=""


</head>
 
Habe das icon jetzt auch als png eingebaut:

<link rel="icon" href="logo-mini.png" type="image/png"/>

Und siehe da: In den Browsern Chrome und Opera erscheint das icon jetzt auf allen Seiten. Würde das Thema gerna als erledigt markieren, aber im IE erscheint das icon immer noch nicht. Vielleicht ein Cache-Problem? Oder doch MS-Problem? Haber jedenfalls alle Cookies etc gelöscht...

Gruss
NinaJS
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück