Favicon und Apple-Icon erstellen

  1. Erstellen Sie Ihr Logo als PNG-Bilddatei. Um aktuelle Geräte zu Unterstützen sollte die Datei in 2 Ausprägungen vorliegen. In 152x152px und 120x120px. Speichern sie die Dateien unter dem Namen
    apple-touch-icon-152x152.png
    beziehungsweise
    apple-touch-icon-120x120.png
    und laden sie auf ihren Webspace in das Stammverzeichnis ihrer Webseite.
    Folgende Webseite macht die Erstellung der notwendigen Dateien auch ohne Bildverarbeitungsprogramme möglich: conifier.net
  2. Fügen Sie nun den folgenden Code im Head Bereich Ihrer Website hinzu:
     
    <link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png" />
    <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png" />

     

  3.  Mit Iconnifier können Sie das Favicon ihrer Seite gleich automatisch mit erstellen.
    Wählen Sie dort unter Einstellungen mindestens die folgenden Einstellungen 16x16 und 32x32
  4. Wählen Sie die Datei (ideal 256x256px PNG mit weißem Hintergrund)
  5. Kopieren Sie nach Klick auf Iconify die Dateien
    • apple-touch-icon-152x152.png
    • apple-touch-icon-120x120.png
    • favicon.ico ins Stammverzeichnis ihres Webservers