Markenikonografie und Illustration: die Bildsprache zwischen Logo und Foto
Deine Website hat ein Icon aus jeder Familie: eines mit dünnen Linien, eines gefüllt, eines in 3D, in letzter Minute heruntergeladen. Jedes sieht allein gut aus; zusammen schreien sie Improvisation. Ikonografie ist die Bildsprache, die deine Leistungen auf einen Blick erklärt — und wie jede Sprache funktioniert sie nur mit konsistenter Grammatik.
25. Dezember 20244 Min. LesezeitIn diesem Artikel
Öffne den Leistungsbereich fast jeder KMU-Website und du findest dieselbe unfreiwillige Collage: ein Icon mit dünnen Linien neben einem gefüllten, ein geometrisches neben einem cartoonhaften — jedes von einer anderen Seite in einer anderen Eile heruntergeladen. Keines ist für sich hässlich — aber zusammen vermitteln sie exakt das Gegenteil dessen, was das Design erreichen sollte: Unordnung.
Ikonografie und Illustration sind die mittlere Bildsprache deiner Marke: flexibler als das Logo, abstrakter als das Foto. Sie erklären Leistungen, führen durch die Navigation, illustrieren Konzepte, die keine Kamera einfangen kann. Dieser Guide gibt dir die Kriterien, einen Stil zu wählen, ihn zu systematisieren und nie wieder in die Collage zurückzufallen.
Was sie lösen (was Logo und Foto nicht können)
Das Logo identifiziert, aber erklärt nicht; das Foto zeigt das Konkrete, aber nicht das Abstrakte. Dazwischen liegt ein riesiges Territorium: die Konzepte — "Sicherheit", "Schnelligkeit", "Prozess in drei Schritten", "Support" —, die visuelle Darstellung brauchen und kein mögliches Foto haben. Dort arbeiten Icons (schnelle Scansignale: Leistungen, Vorteile, Navigation) und Illustrationen (ganze Szenen, um das Immaterielle zu erklären: wie der Service funktioniert, was dahinter passiert).
Icon, Illustration oder Foto: wann was
| Mittel | Wann es gewinnt | Typisches Beispiel |
|---|---|---|
| Icon | Schnelles Scannen paralleler Optionen | Die 6 Leistungen der Startseite, Vorteile, Menüs |
| Illustration | Abstrakte Konzepte oder Prozesse ohne mögliches Foto erklären | "So funktioniert es", leere Zustände, digitale Services |
| Echtes Foto | Existenz beweisen und Vertrauen schaffen | Team, Räume, Produkte, Ergebnisse |
Die Koexistenzregel: Alle drei dürfen auf einer Website zusammenleben, aber jedes in seiner Funktion — und der häufige Fehler ist der billige Ersatz: generische Illustrationen, wo echte Teamfotos hingehörten. Die Illustration erklärt; das Foto beweist. Sie sind nicht austauschbar.
Einen Stil wählen (und nur einen)
- Strich: Linien (Outline) oder gefüllte Formen (Filled)? Linien wirken leicht und technisch; Gefülltes solide und bestimmt. Wähle nach deiner Markenpersönlichkeit — und misch nicht.
- Geometrie: gerade Ecken und Ingenieurspräzision oder organische Kurven und Wärme? Es muss sich mit deiner Typografie und Branche reimen.
- Farbe: die restriktivste und wirksamste Entscheidung — Icons in einer einzigen Palettenfarbe, höchstens zwei. Der bunte Icon-Regenbogen ist die Unterschrift der Collage.
- Visuelles Gewicht: gleiche Linienstärke und gleicher Detailgrad überall — ein hyperdetailliertes Icon neben einem minimalistischen wirkt kaputt, selbst wenn beide derselbe "Stil" sind.
Angepasste Bibliothek oder Maßzeichnung?
Die Regeln des Systems (eine Seite genügt)
- Eine einzige Icon-Quelle — benenne die gewählte Bibliothek und verbiete das Mischen. Die Regel, die 90 % des Chaos verhindert.
- Feste Farbe und Größen: welche Palettenfarbe sie tragen, erlaubte Größen, Hintergrund oder Container, falls vorhanden.
- Wo sie eingesetzt werden und wo nicht: Icons für Listen und Navigation; Illustration für erklärende Bereiche; nie ein Icon als funktionslose Dekoration.
- Ein einziger Ordner mit den freigegebenen Dateien — dieselbe Logik wie bei den Markenanwendungen: Was nicht im Ordner liegt, existiert nicht.
Die klassischen Fehler
Wie alles in der Identität wird die Ikonografie im Markenhandbuch dokumentiert — ein Kapitel, das in Basis-Handbüchern meist fehlt, und genau die Art von Spezifikation, die eine vollständige visuelle Identität von einem Logo mit Farben unterscheidet.
Häufige Fragen
Darf ich kostenlose Icons auf meiner kommerziellen Website nutzen?
Ja, mit zwei Sorgfaltspflichten: Prüfe die Lizenz der Bibliothek (die meisten großen erlauben kommerzielle Nutzung, manche verlangen Namensnennung) und — wichtiger für deine Marke — nutze sie als einzige Quelle und passe sie an deine Farben an. Das Problem kostenloser Icons ist fast nie rechtlich: Es ist der Stilmix vom Herunterladen aus allen Richtungen.
Wie viele Icons braucht meine Marke?
Weniger als gedacht: Ein Set aus 15–30 deckt Leistungen, Vorteile und Navigation der meisten KMU ab. Ziel ist nicht viele zu haben, sondern die richtigen — stimmig und gut eingesetzt. Wenn die gewählte Bibliothek Tausende enthält, umso besser: nicht um alle zu nutzen, sondern damit jedes künftige Icon aus derselben Familie stammt.
Taugen KI-generierte Illustrationen für die Marke?
Sie können, mit derselben Disziplin wie alles andere: definierter, konsistenter Stil (gleicher Basis-Prompt, gleiche Palette), menschliche Qualitätskontrolle und Prüfung der kommerziellen Nutzungsbedingungen des Werkzeugs. Das Risiko ist nicht das Werkzeug, sondern die Versuchung, jedes Stück "wie es kommt" zu erzeugen: KI ohne System produziert die Collage schneller denn je.
Meine Website ist schon voller gemischter Icons — wie repariere ich das?
Es ist eine der rentabelsten visuellen Reparaturen pro investierter Stunde: Wähle die einzige Bibliothek, ordne jedem aktuellen Icon sein Äquivalent darin zu und ersetze in einem Durchgang — auf einer mittleren Website ein Arbeitstag. Der Effekt steht in keinem Verhältnis zum Aufwand: Die ganze Website wirkt professioneller, ohne Struktur oder Inhalt anzufassen.