Design Patterns sind erprobte Lösungen für wiederkehrende Gestaltungsaufgaben, etwa ein Akkordeon für lange Inhalte oder eine Brotkrumennavigation für tiefe Seitenstrukturen. Der Begriff hat in Webdesign und Softwareentwicklung zwei verschiedene Bedeutungen, die sich nur im Prinzip überschneiden.
- Design Patterns
Im Webdesign: wiederkehrende Muster in der Benutzeroberfläche, die eine bekannte Aufgabe auf eine Weise lösen, die Besucher bereits kennen.
Beispiel: „Für die Filter nehmen wir das übliche Pattern, damit niemand raten muss.“In der Softwareentwicklung: bewährte Bauformen im Code, auf Deutsch Entwurfsmuster.
Beispiel: „Die Anbindung folgt dem Adapter-Pattern.“Verwandter Begriff: Dark Patterns sind Oberflächenmuster, die den Besucher zu einer Entscheidung drängen, die er sonst nicht getroffen hätte.
Warum bekannte Muster besser funktionieren
Besucher bringen Erwartungen mit, die sie auf tausenden anderen Websites gelernt haben. Ein Logo oben links führt zur Startseite, ein Einkaufswagen oben rechts zum Warenkorb, unterstrichener Text ist anklickbar. Wer diese Erwartungen bedient, spart dem Besucher das Nachdenken über die Bedienung. Wer sie bricht, muss den Gewinn dieser Abweichung begründen können.
Das heißt nicht, dass jede Seite gleich aussehen soll. Muster betreffen das Verhalten, die Gestaltung bleibt frei. Ein Akkordeon lässt sich in jeder Formensprache umsetzen, solange es sich beim Klick öffnet und der geöffnete Zustand erkennbar bleibt.
Die Muster, die am häufigsten gebraucht werden
Ein überschaubarer Satz deckt den Großteil einer Website ab. Für Navigation sind das Brotkrumen, Mega-Menü und Sticky Nav, für Inhalte Akkordeon, Tabs und der Ausklapper „mehr anzeigen“. Formulare bringen eigene Muster mit: Feldbeschriftungen über dem Feld, Fehlermeldungen direkt daneben, eine Fortschrittsanzeige bei mehreren Schritten.
Jedes dieser Muster trägt eine Erwartung, die über das Aussehen hinausgeht. Bei Tabs geht der Besucher davon aus, dass er zwischen gleichrangigen Inhalten wechselt und nichts verliert. Beim Akkordeon erwartet er, dass geschlossene Abschnitte nachrangig sind. Wer ein Muster für einen anderen Zweck einsetzt, erzeugt genau dort Reibung.
Wo Muster nachgeschlagen werden
Für die verbreiteten Fälle gibt es dokumentierte Sammlungen, etwa die Human Interface Guidelines von Apple oder das Material Design von Google. Beide beschreiben Verhalten und Zustände so genau, dass sich daraus ein eigenes Muster ableiten lässt. Aus unserer Arbeit heraus lohnt der Blick besonders bei Formularen und bei allem, was Fehlermeldungen erzeugt: Dort kostet eine eigene Erfindung am schnellsten Abschlüsse.