Styleguide.

Ein Styleguide hält fest, wie ein Unternehmen gestaltet wird: welche Farbwerte gelten, welche Schriften in welchen Größen, wie das Logo eingesetzt wird, welche Bildsprache passt und oft auch, in welchem Ton Texte geschrieben werden. Die Nielsen Norman Group beschreibt Styleguides als Sammlung konkreter Umsetzungsregeln, visueller Beispiele und Gestaltungsprinzipien. Für ein Unternehmen zählt das, weil viele Menschen an seinem Auftritt mitarbeiten: Marketing, Personalabteilung, Agenturen, Druckereien und freie Texter. Ohne schriftliche Regeln entscheidet jeder nach eigenem Geschmack.

Styleguide, Corporate Design und Design System

Der Styleguide ist das Dokument, das Corporate Design die Sache selbst. Das Corporate Design ist das einheitliche Erscheinungsbild eines Unternehmens. Der Styleguide schreibt dieses Erscheinungsbild auf, damit andere es anwenden können. Ein Beispiel ist der Styleguide der Bundesregierung: Er enthält laut eigener Beschreibung alle Vorgaben für das visuelle Erscheinungsbild, von Farben und Schriften bis zu Büro-, Druck- und Digitalmedien, aber keine programmierten Bauteile.

Ein Design System geht weiter. Laut Nielsen Norman Group ist der Styleguide darin nur ein Teil, dazu kommen Bibliotheken mit fertigen Bauteilen und ein Team, das sie pflegt. Für viele Unternehmenswebsites ist ein guter Styleguide mit zentral gepflegten Stilen im Website-System die passende Stufe.

Worauf ihr im Unternehmen achten solltet

Ergänzt den Styleguide um Regeln für den Bildschirm. In Relaunch-Projekten sehen wir oft Styleguides aus der Druckzeit: Farben in CMYK, Schriften für Briefpapier, aber keine Angaben zu Schaltflächen, Links, Fehlermeldungen oder Fokuszuständen. Genau diese Zustände entscheiden auf der Website, ob etwas einheitlich wirkt.

Prüft die Hausfarben auf Kontrast, bevor ihr sie festschreibt. Die WCAG 2.2 des W3C verlangen auf Stufe AA für normalen Text ein Kontrastverhältnis von mindestens 4,5 zu 1. Eine Farbe, die diesen Wert auf Weiß nicht erreicht, eignet sich für Flächen und Akzente, aber nicht für Fließtext.

Haltet den Styleguide an einer Stelle aktuell. Ein PDF, das in fünf Fassungen per E-Mail kursiert, erzeugt genau die Abweichungen, die es verhindern soll. Legt fest, wer Änderungen freigibt und wo die gültige Fassung liegt.

Nehmt den Styleguide in jede Ausschreibung auf. Wer eine Agentur beauftragt, sollte die Gestaltungsregeln von Anfang an mitgeben. Im Lastenheft für die Website gibt es dafür einen eigenen Abschnitt.

Häufige Fragen zum Styleguide

Gehört die Tonalität in den Styleguide? Das ist üblich. Laut Nielsen Norman Group behandeln viele Styleguides neben der Marke auch Inhalte und Interaktionen. Manche Unternehmen führen dafür einen eigenen Leitfaden für Texte.

Wie umfangreich muss ein Styleguide sein? So knapp wie möglich, so genau wie nötig. Logo-Varianten, Farbwerte für Druck und Bildschirm, Schriften mit Größen und einige Beispiele für richtige und falsche Anwendung decken den Großteil ab.

Wer erstellt den Styleguide? Meist die Agentur, die das Erscheinungsbild entwickelt hat. Für die Website ergänzt ihn das Webdesign-Team um digitale Regeln.

Wenn euer Styleguide endlich auch für die Website gelten soll, ergänzen wir ihn im Webdesign um Bildschirmwerte und Bauteile.