Favicons für alle Browser und Plattformen kinderleicht erstellen, so gehts

Leider ist es heutzutage nicht mehr mit einem simplen Ablegen einer `favicon.ico` im Hauptverzeichnis eines Internet-Auftritts getan um schön in den Lesezeichen aufgenommen zu werden.

Auf der einen Seite verständlich, da die Bilder größer geworden sind und heute auch schöner präsentiert werden sollen. Es gibt ja schließlich inzwischen auch Lesezeichen auf dem iPhone / Android Homescreen oder auch in einer Windows Kachel.

Auf der anderen Seite aber auch extrem lästig, da die diversen Browserhersteller (Internet Explorer, Edge, Firefox, Chrome, Safari, Opera, etc.) für die unterschiedlichen Plattformen (Windows, Linux, Android, iOS, etc.) natürlich wieder mal irgendwie alle ihr eigenes Süppchen kochen.

Zunächst hatte sich neben dem klassischen Favicon das `apple-touch-icon` etabliert, dass Android & Co. auch brav genutzt haben, jedoch ist dieses bei Android inzwischen „deprecated“ (veraltet, unerwünscht) und auch Microsoft hat für seine seit Windows 8 eingeführten Kacheln wieder was eigenes.

Man kann sich damit echt viel Arbeit machen: Erstmal recherchieren und festhalten welche Browser denn nun was genau an Tags haben wollen und in welchen Größen die Bilder vorliegen sollen. Und dann muss man die Bilder ja auch noch in den einzelnen Größen abspeichern.

Zum Glück habe ich dann durch einen Mitarbeiter zufällig den Real Link Generator entdeckt (danke Andreas!). Das Tool macht einem direkt Online aus einer Bilddatei (optimal ist ein Icon mit mindestens 260 x 260 Pixel Größe im PNG Format) ein ganzes Set an Icons in den passenden Größen und spuckt dazu auch noch den fertigen Code aus, der nur noch in den `<head>` der Seite aufgenommen werden muss.

Fazit: Großartig!

Das könnte dich auch interessieren …

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Bitte beachte die Hinweise zum Datenschutz