An der Gestaltung grafischer Symbole kommt man kaum vorbei. Software-Entwickler brauchen Sie, um die eigenen Programme kenntlich zu machen, Webmaster können mit Favicons URLs bebildern oder die Navigation anschaulicher gestalten.

Im Prinzip ist es egal, mit welchem Programm man seine Icons entwirft, die meisten Icon-Editoren bringen so viele Funktionen mit, dass Programme wie Photoshop selten benötigt werden. Für den Apple empfiehlt sich zum Beispiel die Shareware Iconographer, für Windows ist Art Icons Pro eine gute Wahl. Das Wort Icon kommt übrigens von Ikone. Und Ikone von Eikon. Das ist griechisch und bedeutet Bild.

Grundsätzlich gilt: Bilder werden schneller interpretiert als Texte, und sie benötigen für die Darstellung weniger Platz. Das Wort Ausgang braucht mehr Raum als ein Zeichen dafür, und schließlich ist letzteres auch international noch verständlich.

In der Kombination mit Text sind Bilder am einprägsamsten, ein Trick, den sich viele bekannte Symbole zu nutze machen. Die zugehörige Legende ist nach dem zweiten oder dritten Klick praktisch überflüssig, da das Symbol behalten und intuitiv erkannt wird.

Bekannte Icons

Vor der eigentlich Überlegung zu Art und Aussehen gibt es Einschränkungen zu beachten. Windows-Icons sind 32×32 Pixel groß, die kleinere Form für Listendarstellung nur 16×16 Pixel. Dieses Format wird auch für das Favicon genutzt, mit dem sich die URL-Leiste und der Bookmark-Eintrag passend zur Seite illustrieren lassen.

Reiter mit Favicons

Apple Programm-Icons können seit OS X 128×128 Pixel groß sein, das Favicon unterliegt natürlich den gleichen Einschränkungen der Windows-Plattform. Eine schöne Sammlung an Favicons gibt es auf der Favicon-Patchwork Seite.

Als Farbtiefe für Favicons werden noch immer 256 Farben (8 Bit) empfohlen, Icons für Windows- oder Macprogramme können aber heute auf so gut wie allen Rechner auf 24 Bit oder 32 Bit Farbtiefe zurückgreifen, was selbst komplexe Farbmuster zulässt. Trotzdem schadet es nicht sicherheitshalber mit sowenig Farben wie nötig zu hantieren. Ältere Rechner mit schwachen Grafikkarten werden es danken.

Linien mit Treppen-Bildung

Auch die bei der Wahl der Zeichenwerkzeuge gibt es Einschränkungen. Nur vertikale und horizontale Linien eignen sich. Bei schrägen Linien sollte der 45 Grad Winkel gewählt werden. Das Problem nämlich liegt in der unschönen Treppchen-Bildung. Diese lässt sich bei manchen Programmen über Anti-Alias-Funktionen unterdrücken. Dadurch wirkt das Bild aber deutlich unschärfer, was gerade bei kleinen Größen wenig hilfreich ist. Bei einem 45 Grad Winkel sind die einzelnen Punkte einer Linie genau um die eigene Höhe und Breite nach rechts oder links versetzt, die Linie wirkt feiner.

Ein Icon kann die Funktion eines Schalters oder Knopfes verdeutlichen. Keine leichte Aufgabe bei nur begrenzt zur Verfügung stehendem Platz. Neben zeichnerischem Geschick entscheidet vor allem die Idee darüber, ob ein Icon seinen Zweck erfüllt.

Im Web ist es bei den Favicons in der Regel leicht, hier passt das Firmen-Logo oder zumindest ein passendes Symbol in den Firmenfarben. Sollen die Icons aber der Navigation dienen oder für eigene Software herhalten, wird es schon schwieriger.

Icons für ein Forum

Icons als Navigationsleiste

Als Beispiel für eine gelungene Umsetzung mag das Symbol von Winzip herhalten. Hier wurde der Vorgang des Komprimierens perfekt verdeutlicht: Eine Schraubzwinge verkleinert den Dokumentenschrank. In der Regel ist es einfacher, ein Objekt darzustellen, als die Handlung, die bei Druck auf das Icon ausgeführt wird.

Perfekt gelöst: Winzip

Die Diskette als bildhafte Darstellung für das Speichern von Dateien ist weit verbreitet, sagt aber nichts über die Funktion aus. Denn eine Diskette könnte genauso gut für “Datei laden” stehen. Abgesehen davon besitzt heutzutage nicht mehr jeder Rechner zwangsläufig ein Diskettenlaufwerk. Trotzdem ist eine Diskette immer noch einfacher darzustellen, als der eigentliche (physikalische) Vorgang des Sicherns.

Diskette zum Speichern

Wenn also reale Objekte wie die Diskette als Vorbilder dienen sollen, müssen diese so realistisch wie möglich wiedergegeben werden, um Missverständnisse zu vermeiden. Gerade wenn man Teile eines Computers, wie die Festplatte für Downloads, abbildet, lohnt es sich, auf die Zielgruppe zu achten: Mac-Anwender werden das Windows-Festplattensymbol weniger rasch erkennen als das vom eigenen Desktop gewohnte Bild.

Braucht man mehrere Symbole, sollten diese möglichst einheitlich daherkommen. Wenn eine gleiche Größe schon nicht möglich ist, hilft es, einen einheitlichen Rand in identischer Größe zu wählen. Auch passende Farbschemata sorgen für Einheitlichkeit.