Favicons – Icons – Logos (Teil 1: Einführung)

[Performer]

Favicons. Wirklich? Anno 2018? Solch ein Anfängerkram? Ja. Ich denke, es ist notwendig, mal wieder die Favicons genauer zu betrachten.

Zwei mich ärgernde Favicons in meinen Lesezeichen, beide fehlend, aber einmal zusätzlich noch ein Loch in der Lesezeichenliste hinterlassend, waren der Anlass einer längeren Beschäftigung mit Favicons in allen Variationen inklusive Windows-Kacheln, Icons im allgemeinen und Icon-Raster im speziellen. Mit einer kleinen Verzögerung von einem Jährchen will ich also über die kleinen bunten Bildchen schreiben, die einem am deutlichsten zu Bewusstsein kommen, wenn sie fehlen (mehr noch als durch schlechte Gestaltung).

Favicons sind eine Randerscheinung bei der Webseitengestaltung und werden meist auch so behandelt: kurz vor der Freischaltung einer neuen Präsenz noch schnell ein Favicon „dazugebastelt“, hoch geladen, Syntax-, Schreib- oder Dateifehler übersehen – das steht dann so Jahre im Netz. Derweil sind Favicons in den letzten Jahren wirklich wichtig geworden, helfen sie doch, den Überblick in Lesezeichen, Leselisten oder einfach nur Browsertabs zu behalten. Ein noch so kleines Bild findet sich einfach schneller als ein erst noch zu lesendes Wort.

Kleiner Rückblick: Als ich vor über vier Jahren die verschiedenen Favicon-Dateien für selfhtml anlegen sollte, interessierten mich die zum damaligen Zeitpunkt nicht sonderlich. Zum einen hatte ich kein mobiles Gerät, zum anderen erinnerte mich die Vielzahl der unterschiedlichen Dateien mit den zig Auflösungen an die Anfangszeit der CSS-Layouts, als auch jeder Browser sein eigenes Stylesheet haben wollte – falls er überhaupt zur Mitarbeit zu bewegen war. Ich dachte mir, was soll ich mich mit dem Kram beschäftigen, in ein paar Jahren wird sich ein Standard herausbilden und dann können mit wenigen Grafiken alle Browser gefüttert werden. Ganz so weit sind wir noch nicht, doch kommt man in der Zwischenzeit mit einer überschaubaren Anzahl an Dateien im Alltag zurecht. Dabei darf man sich in der Icon-Reduktion sogar auf die Vorgaben von Apple, Microsoft oder Google berufen, die wohl selbst eingesehen haben, dass nicht jedes Gerät mit mundgerechten Bildchen versorgt werden kann und zunehmend auch nicht mehr braucht: bei den immer höheren Bildschirmauflösungen spielt eine interpolierte Pixelreihe einfach keine Rolle mehr.

Im Laufe von Wochen und Monaten habe ich bestimmt eine dreistellige Anzahl von Websites studiert – von großen und kleinen Firmen, wichtigen und weniger wichtigen Gestaltern des Webs. Kaum eine Website kannte alle Vorgaben und Regeln und selbst wenn Kenntnisse sichtbar waren: nicht eine einzige Website war ohne Mängel. Nicht eine einzige. Keine, bei der ich sagen konnte: die nehme ich mir als Vorbild. Auch keine von denen, die Anspruch auf Meinungsführerschaft erheben. Nur eine – halb positive – Überraschung möchte ich hervorheben: Der „Stern“ bietet den Windows-Nutzern tatsächlich einen weißen Stern auf transparentem Hintergrund an. Zwar ohne Rand, wie er für eine Windows-Kachel notwendig wäre, aber immerhin. Wenn der „Stern“ damit schon auffallen kann, wie sieht es dann erst bei den anderen aus?

So weit die Ausgangslage. Startpunkt meiner Lern-Tour war der Favicon-Artikel im selfhtml-Wiki, die Info-Sammlung auf github, stackoverflow, viele Google-Suchläufe, die Design-Vorgaben von Apple, Google, Microsoft und nicht zuletzt unzählige „Feldstudien“ bei den Großen und Kleinen und Wichtigen des Internets.

Neben der Favicon-Geschichte war ein anderer Aspekt meines Lernens die unterschiedlichen Icon-Raster (im wesentlichen 32er und 48er), deren Unvereinbarkeit in den kleinen Dimensionen das Gestalten vermiesen können. Details erspare ich mir, nur so viel: es war beruhigend zu sehen, dass andere Leute die Probleme auch kennen. In der Folge habe ich meine eigenen Favicons/Icons anhand des neu Gelernten überarbeitet, wie auch alle Grafiken von selfhtml, die natürlich im Weiteren im Mittelpunkt stehen werden.

Nächster Teil: Favicons – Icons – Logos (Teil 2: Realitäts-Check)

(Um weder Schreiber noch Leser zu überfordern, wird zwischen den Beiträgen ein paar Tage Abstand liegen.)

[Matthias Scharwies]

Servus!

Vielen Dank, ich verlink's im Wiki!

Herzliche Grüße

Matthias Scharwies

[Gunnar Bittersmann]

@@Matthias Scharwies

Vielen Dank, ich verlink's im Wiki!

Der Blog wäre der geeignete Platz für die Artikelserie.

LLAP 🖖

[Matthias Scharwies]

Servus!

@@Matthias Scharwies

Der Blog wäre der geeignete Platz für die Artikelserie.

Ja, der Blog wäre wirklich der richtige Platz für so etwas!

Wer kurze und längere Artikel über Webdesign und alles was so dazu gehört hat, ist herzlich eingeladen, als Autor aktiv zu werden. Bei der Formatierung / Portierung bieten wir gerne Hilfe an.

Herzliche Grüße

Matthias Scharwies

[pl]

Hi,

jetzt habe ich Deinen Artikel wiederholt und in Folge mehrfach durchgelesen. Könntest Du evntl. Dein Problem was Du mit Favicons hast, mal etwas genauer beschreiben?

MfG

[Performer]

Hi pl,

wie im ersten Satz meiner Einleitung schon anklingt, sollten Favicons im Jahr 2018 eigentlich kein Thema mehr sein. Ein Blick in meine Lesezeichen sagt mir aber etwas anderes. Du kannst ja mal gerne versuchen zu erklären, was Webseitenersteller davon ab hält, eine Hand voll Grafiken zur leichteren Nutzung einer Website bereit zu stellen? Was ist deren Problem?

Ciao, Performer