Favicon, Icon, Shortcut Icon, Apple-Touch-Icon: Gibt es noch andere?


24

Ich kenne zwei grundlegende Arten von Standardwebsymbolen für Websites:

  • Favicon : Legen Sie eine.icoformatierte Datei im Stammverzeichnis Ihrer Website mit dem Namen abfavicon.icound die meisten Desktop-Browser finden sie und zeigen sie in verschiedenen Kontexten an (Lesezeichen, Registerkarten). Kann auch im Code hinzugefügt werden, mit dem Sie andere Namen und andere Grafiktypen für die Datei angeben können, obwohl für Browser Einschränkungen in Bezug auf Typ und Größe gelten :

    <link rel="shortcut icon" href="/webmasters//favicon.ico" />
    <link rel="icon" href="/webmasters//favicon.ico" />
    
  • Webclip-Symbol : Platzieren Sie einepngformatierte Datei mit dem Namen "Entweder"apple-touch-icon.pngoder "apple-touch-icon-precomposed.pngRoot" auf Ihrer Site. Die iPhone OS / iOS-Versionen von Safari übernehmen diese und speichern sie, wenn die Site zum Startbildschirm hinzugefügt wird. Kann auch mit folgendem Code hinzugefügt werden:

    <link rel="apple-touch-icon" href="/webmasters//custom_icon.png" />
    

Gibt es andere Standardsymbolgrafiken für eine Website, die ein Webmaster enthalten kann?

Antworten:


8

Es erscheint auf der Grundlage dieser und dies , dass Android die verwenden relTyp apple-touch-icon-precomposedoder apple-touch-icon, BUT , dass für sie arbeiten Sie eine vollständige URL verwenden müssen, zB:

<link rel="apple-touch-icon-precomposed"
      href="http://www.example.com/custom_icon.png" />

oder:

<link rel="apple-touch-icon"
      href="http://www.example.com/custom_icon.png" />

Die Einschränkung ist, dass dies für Android 2.1 Update 1 und Webkit 3.1 zu sein scheint . In der Dokumentation des Android-Entwicklers wird in android.webkitdiesem Ereignis eine Methode erwähnt , mit der apple-touch-icondas abgerufen wird.


1

Dies hängt von der Plattform ab, auf die Sie abzielen. Aber ich denke, die meisten Standard-kompatiblen mobilen Browser verstehen die Standard-Favicon-Tags. Vielleicht können Sie auf Plattformen wie Android, iOS, WebOS, ... nach speziellen Anwendungsfällen suchen (z. B. Desktop-Verknüpfung mit einem speziellen Symbol erstellen).

Ich habe gerade ein paar Websites für iPhone-Nutzer entwickelt und auf diesen Websites habe ich Wordpress mit einer speziellen Version des WPTouch-Themas verwendet.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.