Was Neuro-Webdesign tatsächlich mit Neurowissenschaft zu tun hat

Beim Neuro-Webdesign werden Erkenntnisse aus den Bereichen Wahrnehmung, Aufmerksamkeit und Entscheidungsverhalten auf die Gestaltung von Webseiten angewendet. Diese Definition klingt zunächst eindeutig. Sie wird jedoch schwieriger, wenn man sich die Frage stellt, welche Erkenntnisse damit eigentlich gemeint sind. Denn zwischen Neurowissenschaft, Wahrnehmungspsychologie, Kognitionspsychologie, Usability-Forschung und Human-Computer-Interaction (HCI) gibt es methodische Unterschiede, die im allgemeinen Sprachgebrauch schnell verschwimmen.

Im Webdesign wird vieles unter demselben Begriff zusammengefasst, obwohl längst nicht jede Erkenntnis darüber, wie Menschen eine visuelle Oberfläche wahrnehmen, aus einem neurowissenschaftlichen Experiment stammt.

Das macht Neuro-Webdesign jedoch nicht wertlos. Im Gegenteil. Für die Gestaltung einer Webseite ist es von erheblicher Bedeutung zu wissen, ob Menschen Informationen einzeln oder in Gruppen wahrnehmen, wie visuelle Hierarchien Orientierung erzeugen, warum Aufmerksamkeit zwischen konkurrierenden Reizen verteilt wird und welchen Anteil Erwartungen an der Interpretation einer Oberfläche haben.

Problematisch wird der Begriff erst dort, wo aus solchen Zusammenhängen ein Steuerungsversprechen entsteht: Eine bestimmte Farbe erzeuge Vertrauen, eine Animation halte die Aufmerksamkeit fest, ein emotionales Bild aktiviere die richtige Entscheidung und ein Call-to-Action müsse nur an der psychologisch wirksamsten Stelle platziert werden.

So präzise ist der Mensch nicht berechenbar. Und so präzise ist auch die Forschung nicht.

Was an Neuro-Webdesign tatsächlich „Neuro“ ist

Webdesigner neigen häufig dazu, alle beobachteten Wirkungen auf das Gehirn zurückzuführen. Schließlich wird jede Wahrnehmung auf neuronaler Ebene verarbeitet. Ebenso lassen sich Lesen, Erinnern, Entscheiden oder das Erkennen visueller Muster nicht vom Gehirn trennen. Daraus folgt jedoch nicht, dass jede Designentscheidung eine neurowissenschaftliche ist. Wenn zwei Elemente aufgrund ihrer räumlichen Nähe als zusammengehörig wahrgenommen werden, lässt sich dieser Effekt wahrnehmungspsychologisch beschreiben, ohne einen Gehirnscan bemühen zu müssen.

Diese Unterscheidung ist wichtig, da sie die Qualität der Begründung verändert. „Das Gehirn reagiert darauf“ mag nach einer Erklärung klingen, liefert aber oft keine. Interessanter ist die Frage, unter welchen Bedingungen ein beobachteter Effekt auftritt, wie stabil er ist, welche Alternativerklärungen es gibt und ob sich eine Erkenntnis aus einem Laborversuch überhaupt sinnvoll auf eine reale Firmenwebseite übertragen lässt. Zwischen einem experimentellen Befund und einem Hero-Bereich liegen mehrere Übersetzungsschritte.

Ich verwende den Begriff „Neuro-Webdesign” deshalb bewusst etwas weiter, aber nicht beliebig. Er beschreibt für mich eine Gestaltung, bei der die menschliche Wahrnehmung nicht erst nach dem fertigen Entwurf, sondern bereits während des Entstehungsprozesses berücksichtigt wird. Sie beginnt bereits bei der Informationsarchitektur, bei Gewichtung und Reihenfolge, bei Abständen, Kontrasten, Sprache und der Frage, wie viele konkurrierende Entscheidungen ein Besucher gleichzeitig treffen soll. Die Neurowissenschaft kann dazu Erkenntnisse liefern. Sie ist jedoch nur ein Teil eines größeren Wissensfeldes.

Wo aus Forschung plötzlich ein Designmythos wird

Hinter vielen populären Regeln steckt ein wahrer Kern. Das macht sie besonders hartnäckig. So werden Farben beispielsweise tatsächlich mit Emotionen verbunden. Menschen können durch zu viele Informationen belastet werden. Visuelle Auffälligkeit beeinflusst die Aufmerksamkeit. Emotionen spielen bei Entscheidungen eine Rolle. Nähe kann Zusammengehörigkeit signalisieren. Jede einzelne Aussage lässt sich wissenschaftlich sinnvoll diskutieren.

Der Fehler entsteht jedoch meist einen Schritt später, wenn aus einer statistischen Tendenz eine Kausalität abgeleitet und aus dieser wiederum eine Handlungsanweisung gemacht wird. So wird beispielsweise aus der Assoziation zwischen der Farbe Blau und positiven, eher niedrig aktivierenden Emotionen die Behauptung abgeleitet, Blau erzeuge Vertrauen. Aus Erkenntnissen über selektive Aufmerksamkeit wird die Idee abgeleitet, dass ein bewegtes Element die Aufmerksamkeit zuverlässig „halten” könne. Und aus der Forschung zu emotional beeinflussten Entscheidungsprozessen entsteht die Vorstellung, eine entsprechend gestaltete Webseite könne Menschen zu einer bestimmten Entscheidung führen.

Für die praktische Arbeit wäre es bequemer, wenn es solche Regeln gäbe. Man könnte ein Interface aus nachgewiesenen Einzelwirkungen zusammensetzen und am Ende lediglich überprüfen, ob alle psychologischen Faktoren berücksichtigt wurden. Die Realität des Webdesigns ist jedoch widerspenstiger. Der gleiche große Kontrast, der einem Call-to-Action auf einer ruhigen Seite Priorität verleiht, kann in einer bereits kontrastreichen Umgebung völlig untergehen.

Ein stark emotionales Bild kann ein sensibles Angebot unterstützen oder ihm die notwendige Seriosität nehmen. Eine kurze Überschrift kann hervorragend orientieren oder so allgemein bleiben, dass sie gar nichts erklärt.

Der Kontext ist kein lästiger Sonderfall der Regel. Er ist Teil ihrer Wirkung.

Wahrnehmung beginnt, bevor ein Besucher den Inhalt verstanden hat

Ein Webdesigner betrachtet eine Webseite unter außergewöhnlichen Bedingungen. Er kennt die Struktur, die Hierarchie und die Absicht hinter jedem Bild. In der Regel ist er auch mit den Inhalten der außerhalb des sichtbaren Bereichs liegenden Abschnitte vertraut. Nach mehreren Stunden Arbeit kann er sich jedoch kaum noch in einen Besucher hineinversetzen, der dieses Wissen nicht besitzt. Ein Besucher gelangt über eine Suchanfrage, eine Empfehlung, einen Link oder vielleicht nur mit vager Neugier auf die Seite. Die Seite muss sich ihm zunächst selbst erklären.

Dabei wartet die Wahrnehmung nicht, bis ein Text vollständig gelesen wurde. Größenverhältnisse, räumliche Abstände, Kontraste, Bildmotive, wiederkehrende Formen und die Position von Elementen liefern bereits Hinweise darauf, wie die Oberfläche organisiert sein könnte. Erst danach wird manches bewusst gelesen und inhaltlich überprüft. Eine Seite kann deshalb semantisch vollkommen logisch aufgebaut sein und visuell trotzdem eine andere Ordnung vermitteln.

Gestaltprinzipien sind keine Dekorationstheorie

Das Gesetz der Nähe ist eines der bekanntesten Beispiele. Demnach werden Elemente, die räumlich nah beieinanderliegen, eher als zusammengehörig interpretiert. In einer Lehrbuchgrafik ist das offensichtlich. Im Webdesign kann diese Beobachtung jedoch überraschend weitreichende Folgen haben. So entscheidet beispielsweise der Abstand zwischen einer Überschrift und dem vorherigen Abschnitt darüber, welchem Inhalt sie zugerechnet wird. Eine Preisangabe kann versehentlich näher an einem falschen Produkt stehen als an dem Angebot, zu dem sie gehört. Ein Button kann optisch Teil eines Textblocks werden, obwohl seine Funktion den gesamten Seitenabschnitt betrifft.

Ähnlichkeit wirkt auf vergleichbare Weise. Wenn drei Karten dieselbe Größe, Typografie und Hintergrundgestaltung besitzen, entsteht zunächst die Erwartung, dass sie auch funktional auf derselben Ebene liegen. Wenn eine dieser Karten plötzlich als wichtigster Einstieg benötigt wird, reicht es nicht aus, nur den Text zu ändern, da die visuelle Gleichrangigkeit bestehen bleibt. Gestaltung kommuniziert also Beziehungen, selbst wenn diese gar nicht bewusst als Botschaft geplant wurden.

Es ist daher unerheblich, ob ein Webdesigner Gestaltgesetze „einsetzt“. Sie wirken ohnehin. Die gestalterische Arbeit besteht vielmehr darin, zu erkennen, welche Beziehungen eine Seite durch Nähe, Ähnlichkeit, Begrenzung oder Ausrichtung erzeugt und ob diese mit der inhaltlichen Struktur übereinstimmen. Eine sauber programmierte Überschriftenhierarchie kann semantisch korrekt sein, während die sichtbare Hierarchie den Besuchern etwas völlig anderes vermittelt.

Visuelle Hierarchie entsteht aus Relationen, nicht aus Größe allein

In vielen Entwürfen wird die Wichtigkeit zunächst über die Größe vermittelt. So wird die Hauptüberschrift größer, der Button kräftiger und wichtige Zahlen erhalten eine eigene Farbe. Solche Mittel funktionieren jedoch nur, solange sie nicht gegeneinander antreten. Sobald fast alles groß, fett oder kontrastreich ist, verliert die einzelne Hervorhebung ihren Informationswert. Das Problem ist dann nicht zu wenig Gestaltung, sondern eine fehlende Abstufung.

Gerade deshalb ist Weißraum kein dekoratives Luxusgut. Ein Element kann an Gewicht gewinnen, wenn es nicht von drei anderen Elementen bedrängt wird. Zwei Abschnitte können voneinander getrennt werden, ohne dass eine Linie, ein Rahmen oder eine neue Hintergrundfarbe nötig ist – es genügt, wenn zwischen ihnen genügend Raum entsteht. Umgekehrt kann zu viel Abstand Beziehungen auflösen, die inhaltlich wichtig wären. „Mehr Weißraum“ ist daher ebenso wenig eine universelle Regel wie „weniger Inhalt“.

Bei der Arbeit an Firmenwebseiten fällt mir dieser Punkt besonders häufig auf. Im Laufe der Jahre werden Inhalte ergänzt: eine Zertifizierung, ein neuer Leistungsbereich, eine zusätzliche Aussage im Hero-Bereich, ein weiterer Call-to-Action-Button. Jedes einzelne Element besitzt einen nachvollziehbaren Grund. Das Problem entsteht erst in der Summe, weil nichts von dem Bestehenden an Gewicht verliert.

Der Entwurf sammelt Bedeutung, ohne sie neu zu verteilen. Was ursprünglich eine klare Hierarchie hatte, wird langsam zu einer Oberfläche, auf der alles begründet wichtig ist – und gerade deshalb kaum noch etwas eindeutig wichtig ist.

Visuelle Komplexität lässt sich nicht ohne die Aufgabe bewerten

Ein Blick auf die Forschungsergebnisse lohnt sich, denn sie relativieren eine weitverbreitete Gestaltungsannahme. Im Rahmen einer Eye-Tracking-Studie zur Komplexität von Webseiten wurden 42 Studierende untersucht. Sie bearbeiteten einfache und komplexere Aufgaben auf unterschiedlich komplex gestalteten Webseiten. Unter anderem wurden Fixationen und Bearbeitungszeiten erfasst. Die Ergebnisse lassen sich jedoch nicht auf die Aussage reduzieren, dass einfache Webseiten grundsätzlich besser sind. Vielmehr beeinflusste die Komplexität der jeweiligen Aufgabe, wie sich die visuelle Komplexität auf Aufmerksamkeit und Verhalten auswirkte.

Dies ist für das Webdesign interessanter als jede Minimalismusregel. Ein Besucher, der nur eine Telefonnummer sucht, hat eine andere Aufgabe als jemand, der drei Beratungsangebote gegeneinander abwägen möchte. Eine Seite für ein einzelnes Produkt kann Informationen daher aggressiver verdichten als eine Seite, auf der zuerst ein komplexes B2B-Angebot verstanden werden muss.

Was visuell zu viel ist, hängt also nicht ausschließlich von der Zahl sichtbarer Elemente ab. Es kommt auch darauf an, wie viele Elemente für die gerade ausgeführte Aufgabe relevant sind und wie leicht ihre Beziehungen zueinander erkennbar werden.

Die Studie hat jedoch auch Grenzen, die nicht unterschlagen werden sollten. Die 42 jungen Studierenden, die an der kontrollierten Untersuchung teilgenommen haben, sind nicht repräsentativ für alle Nutzer einer Unternehmensseite. Gerade deshalb ist die Forschung wertvoll: Nicht, weil sie eine fertige Regel liefert, sondern weil sie aufzeigt, warum eine pauschale Regel methodisch kaum haltbar ist.

Aufmerksamkeit ist nicht dasselbe wie Wirkung

Aufmerksamkeit ist einer der Begriffe, die im digitalen Marketing besonders schnell mit Erfolg gleichgesetzt werden. Wenn ein Element auffällt, wird es als wirksam erachtet. Da Videos die Aufmerksamkeit länger fesseln, müssen sie wirksam sein. Eine Animation erzeugt Bewegung und verhindert, dass Besucher weiter scrollen. Dabei beschreibt Aufmerksamkeit zunächst nur eine Auswahl: Etwas erhält gegenüber anderem vorübergehend Verarbeitungsvorrang. Ob das ausgewählte Element anschließend verstanden, erinnert, positiv bewertet oder für eine Entscheidung relevant wird, ist eine andere Frage.

Salienz kann Orientierung schaffen – oder sie zerstören

Als visuelle Salienz wird die Eigenschaft eines Reizes bezeichnet, sich von seiner Umgebung abzuheben. Auf einer Webseite können dies ein starker Farbkontrast, eine ungewöhnliche Größe, Bewegung oder ein isoliertes Element sein. Solche Unterschiede sind für die Gestaltung unverzichtbar. Ohne sie ließe sich kaum eine visuelle Hierarchie aufbauen. Ein Problem entsteht jedoch, wenn die Salienz selbst zum Ziel wird.

So kann beispielsweise ein animierter Kreis den Blick auf sich ziehen, obwohl die wichtigste Information danebensteht. Ein riesiger Claim kann die gesamte erste Bildschirmhöhe dominieren und trotzdem so abstrakt sein, dass er keinerlei Orientierung bietet. Umgekehrt kann ein wesentlich kleineres Element eine stärkere Bedeutung besitzen, wenn es genau an der Stelle auftaucht, an der die Besucherin oder der Besucher eine konkrete Entscheidung treffen möchte. Auffälligkeit und Relevanz können zusammenfallen. Sie müssen es jedoch nicht.

Für die Praxis bedeutet das, dass die Aufmerksamkeit nicht auf möglichst viele Elemente verteilt werden sollte. Eine Webseite braucht eine Choreografie unterschiedlicher Intensitäten. Es gibt Momente, in denen ein Hero-Element visuell stark sein darf, und Bereiche, in denen der Text Raum zum Lesen benötigt. Ein CTA kann Gewicht bekommen, ohne den gesamten Abschnitt zu dominieren. Bewegung kann einen Übergang verdeutlichen, sofern sie nicht gleichzeitig mit drei weiteren Animationen um denselben Blick konkurriert.

Bewegung ist besonders teuer

Ein gutes Beispiel hierfür sind Animationen, da das menschliche visuelle System empfindlich auf Veränderungen in der Umgebung reagiert. Diese Eigenschaft wird im Webdesign gerne genutzt. Bewegung beansprucht jedoch die Aufmerksamkeit der Besucher, selbst wenn diese gerade etwas anderes lesen möchten. Selbst technisch perfekt funktionierende Elemente wie eine dauerhaft schwebende Grafik, ein automatisch wechselnder Slider oder ein pulsierender Button können die Verarbeitung benachbarter Inhalte beeinträchtigen.

Das heißt jedoch nicht, dass Bewegung vermieden werden sollte. Eine Animation kann räumliche Zusammenhänge erklären, einen Zustandswechsel sichtbar machen oder die Orientierung beim Scrollen unterstützen. Interessant ist die Frage, ob sie Informationen transportiert oder lediglich Aktivität erzeugt. Bei eigenen Entwürfen ist das manchmal schwer zu beantworten, da gerade die spektakulärsten Effekte gestalterisch am meisten Spaß machen. Ein Effekt kann hervorragend aussehen und trotzdem zu viel wollen.

An dieser Stelle kommt dem Neuro-Webdesign eine ziemlich unromantische Aufgabe zu: nicht möglichst viele Reaktionen auszulösen, sondern die Konkurrenz zwischen Reizen zu kontrollieren.

Emotionen gehören zu Entscheidungen – sie sind aber kein Bedienfeld

Die Verbindung zwischen Emotion und Entscheidung ist ein zentraler Grund dafür, dass die Neurowissenschaft im Marketing so attraktiv geworden ist. Das Ideal des rein rational entscheidenden Menschen ließ sich mit zahlreichen Beobachtungen des menschlichen Verhaltens nur schwer vereinbaren. Emotionen sind keine Störung, die erst nach einer eigentlich vernünftigen Entscheidung hinzukommt. Sie können vielmehr an der Bewertung, dem Lernen und der Auswahl beteiligt sein. Das ist für das Webdesign relevant. Daraus folgt jedoch noch lange nicht, dass eine Gestaltung bestimmte Emotionen wie Schalter bedienen kann.

Damasios Somatic-Marker-Hypothese – und was sie nicht beweist

In diesem Zusammenhang werden besonders häufig die Namen Antonio Damasio und Antoine Bechara genannt. Die Somatic-Marker-Hypothese besagt, dass körperliche bzw. affektive Signale bei komplexen Entscheidungen dabei helfen können, Handlungsoptionen zu bewerten. Erfahrungen mit früheren Folgen können die spätere Entscheidung beeinflussen, wobei nicht alle Bewertungsprozesse bewusst zugänglich sein müssen. Bechara, Damasio und Kollegen haben diese Überlegungen unter anderem im Zusammenhang mit der Iowa Gambling Task diskutiert.

Für einen Webdesigner ist es verführerisch, daraus eine direkte Linie zu ziehen. Wenn Emotionen Entscheidungen beeinflussen, muss Design die gewünschte Emotion erzeugen. Doch die Forschung trägt diesen Schritt nicht mit. Schon die Somatic-Marker-Hypothese selbst ist Gegenstand wissenschaftlicher Diskussionen. Dunn, Dalgleish und Lawrence problematisieren in ihrer kritischen Evaluation der Somatic-Marker-Hypothese unter anderem die Interpretation der psychophysiologischen Befunde und die begrenzte Kausalevidenz hinter Teilen des Modells.

Dadurch verliert die Bedeutung von Emotionen jedoch nicht an Gewicht. Sie werden lediglich mit mehr Vorsicht interpretiert. Forschung kann zeigen, dass emotionale und körperbezogene Prozesse an Entscheidungen beteiligt sind. Daraus lässt sich jedoch kein Katalog von Webdesign-Reizen ableiten, mit denen sich diese Prozesse gezielt aktivieren und anschließend in eine Conversion übersetzen lassen.

Vertrauen entsteht nicht im Hexcode

Diese Verkürzung wird besonders deutlich beim Begriff „Vertrauen”. In Webdesign-Ratgebern wird Vertrauen oft als rein visuelle Eigenschaft behandelt. Blau, hochwertige Fotografien, Gütesiegel, Testimonials und eine aufgeräumte Oberfläche werden zu sogenannten „Trust-Elementen”. Einige dieser Elemente können tatsächlich Hinweise liefern, die Besucher für ihre Einschätzung nutzen.

Vertrauen selbst ist jedoch relational. Es richtet sich auf jemanden oder etwas und hängt davon ab, welche Risiken eine Entscheidung mit sich bringt, welche Erfahrungen bereits vorhanden sind und ob die wahrgenommenen Signale übereinstimmen.

Eine exzellent gestaltete Kanzleiseite kann Seriosität vermitteln. Wenn die Texte jedoch aus austauschbaren Behauptungen bestehen und die genannten Fachgebiete kaum belegt werden, wird die visuelle Qualität diesen Widerspruch nicht beliebig lange überdecken können. Umgekehrt kann eine weniger spektakuläre Seite sehr überzeugend sein, wenn Kompetenz, Person, Arbeitsweise und konkrete Informationen widerspruchsfrei zusammenpassen.

Das ist ein wichtiger Punkt für Neuro-Webdesign, da die Gestaltung nicht isoliert wirkt. Besucher verarbeiten nicht erst Farbe, dann Typografie, anschließend Text und zum Schluss das Angebot. Diese Ebenen treffen gleichzeitig auf vorhandene Erwartungen. Ein hochwertiges Erscheinungsbild kann eine plausible Einschätzung verstärken. Es kann jedoch kein Vertrauen aus dem Nichts produzieren.

Farbpsychologie zeigt besonders gut, warum einfache Regeln gefährlich sind

Kaum ein Bereich der Designpsychologie wird so routiniert in kleine Zuordnungstabellen gepresst wie die Farbe: Blau steht für Vertrauen, Grün für Natur, Rot für Aufmerksamkeit und Gelb für Optimismus. Dass diese Tabellen plausibel wirken, hat einen nachvollziehbaren Grund: Menschen verbinden Farben tatsächlich systematisch mit emotionalen Begriffen. Die Forschung ist an dieser Stelle jedoch wesentlich interessanter als die populäre Kurzfassung.

Assoziation ist noch keine ausgelöste Emotion

Für eine große systematische Übersichtsarbeit zum Thema „Farbe und Emotion” wurden 132 empirische Studien aus einem Zeitraum von 128 Jahren zusammengeführt. Insgesamt wurden Daten von 42.266 Personen aus 64 Ländern ausgewertet. Dabei zeigten sich wiederkehrende Zusammenhänge zwischen Farben und Emotionen. So wurden die Farben Blau und Grün beispielsweise häufiger mit positiven Emotionen niedrigerer Aktivierung in Verbindung gebracht, während die Farbe Rot mit stärker aktivierenden positiven sowie negativen Emotionen assoziiert wurde.

Gerade die Details der Arbeit zerstören jedoch die Idee eines einfachen Farbcodes. Die Autoren beschreiben viele dieser Beziehungen als „many-to-many“: Eine Farbe kann mit mehreren emotionalen Begriffen verbunden sein, während dieselbe Emotion unterschiedlichen Farben zugeordnet wird. Zusätzlich spielen Helligkeit und Sättigung eine wichtige Rolle, während kulturelle und methodische Unterschiede bestehen bleiben.

Eine solche Zuordnung untersucht zunächst, welche Emotion Menschen mit einer Farbe verbinden. Ob dieselbe Farbe innerhalb eines konkreten Interfaces bei einer konkreten Person tatsächlich diese Emotion hervorruft, ist damit jedoch nicht automatisch beantwortet.

Ein blauer Button besitzt deshalb keine eingebaute Vertrauensfunktion. Seine Wirkung entsteht auch dadurch, welche Farben ihn umgeben, wie stark sein Kontrast ist, ob Blau bereits die dominante Markenfarbe darstellt und ob die Besucher an dieser Stelle überhaupt einen Handlungsbedarf verspüren. Der gleiche Farbwert kann auf zwei Webseiten vollkommen unterschiedliche visuelle Aufgaben übernehmen.

Wie stark sich Farbe erst im Zusammenspiel mit Kontrast, Fläche, Typografie und Umgebung entwickelt, ist auch der Ausgangspunkt meines Beitrags über Farben für Webseiten. Die psychologische Zuschreibung einer Farbe ist dort deshalb nur ein Teil der gestalterischen Entscheidung – nicht ihre Begründung.

Wahrnehmungspsychologie endet nicht beim durchschnittlich Sehenden

Eine merkwürdige Schwäche vieler Texte zur Farbpsychologie ist, dass sie zwar sehr ausführlich über die emotionale Wirkung von Farben sprechen, aber kaum darüber, ob die gewählte Farbkombination überhaupt zuverlässig wahrnehmbar ist. Wer Neuro-Webdesign ernsthaft mit menschlicher Wahrnehmung begründet, kann Barrierefreiheit nicht als nachträgliches technisches Spezialthema behandeln.

Die WCAG 2.2 des W3C fordert für normalen Text auf Level AA einen Kontrast von mindestens 4,5:1, für ausreichend großen Text einen Wert von 3:1.
Diese Werte lösen zwar nicht jede Gestaltungsfrage, markieren aber eine überprüfbare Grenze, ab der das subjektive Gefühl des Designers nicht mehr ausreicht. So kann eine Markenfarbe ästhetisch perfekt und emotional plausibel sein und dennoch für Text ungeeignet bleiben.

Hier zeigt sich eine interessante Verschiebung: Je ernsthafter man sich mit Wahrnehmung beschäftigt, desto weniger geht es um geheimnisvolle Neuro-Effekte und desto häufiger um sehr konkrete Gestaltung. Lesbarkeit, erkennbare Zustände, ausreichender Kontrast, sinnvolle Gruppierung und klare Hierarchie klingen vielleicht weniger spektakulär als „unbewusste Trigger“, sind für reale Menschen aber häufig wichtiger.

Text gehört zur Wahrnehmung einer Webseite, nicht nur zu ihrem Inhalt

In vielen Webdesign-Modellen werden Text und Gestaltung nach wie vor nacheinander behandelt. Zunächst entsteht das Layout, anschließend wird der Content eingefügt. Aus der Wahrnehmungspsychologie ergibt diese Trennung jedoch wenig Sinn. Eine Überschrift hat nicht nur eine Bedeutung, sondern auch eine Länge, einen Rhythmus und eine sichtbare Form. Ändert sich der Text einer Überschrift, verändert sich auch der Zeilenumbruch. Dieser hat Einfluss auf die Höhe des Bereichs, die Relation zum Bild und möglicherweise sogar auf die Position des ersten Call-to-Actions. Sprache ist auf einer Webseite also immer auch Gestalt.

Eine Überschrift erzeugt eine Erwartung, bevor sie erklärt

Das wird besonders im Hero-Bereich deutlich. Besucher treffen dort häufig auf ein Bild, eine große Überschrift, eventuell einen kurzen Begleittext und eine Handlungsmöglichkeit. Diese Elemente bilden gemeinsam eine erste Hypothese darüber, worum es auf der Seite geht. Eine präzise Überschrift kann ein bildstarkes, aber mehrdeutiges Motiv einordnen. Eine allgemeine Überschrift kann hingegen dazu führen, dass Besucher trotz der hervorragenden Gestaltung zunächst nach der eigentlichen Aussage suchen müssen.

Das ist mehr als Copywriting. Die Erwartungshaltung der Besucher beeinflusst, wie sie die nachfolgenden Informationen lesen.

Wenn ein „Hero” eine bestimmte Leistung verspricht und der nächste Abschnitt plötzlich mit der Unternehmensphilosophie beginnt, entsteht ein Bruch. Dieser ist nicht zwangsläufig dramatisch, bedeutet für die Lesenden jedoch eine kleine zusätzliche Einordnungsarbeit. Viele solcher Brüche hintereinander machen eine Seite anstrengender, obwohl jeder einzelne Abschnitt für sich gut gestaltet sein kann.

In meinem Beitrag zur Textgestaltung für Webseiten beschäftige ich mich ausführlicher mit dieser Wechselwirkung. Für das Neuro-Webdesign ist entscheidend, dass der Inhalt nicht erst nach der Wahrnehmung kommt. Der Inhalt verändert die Wahrnehmungsstruktur selbst.

Storytelling ist dann stark, wenn eine Geschichte etwas erklären kann

Mit Storytelling sollte man ähnlich vorsichtig umgehen. Geschichten besitzen Eigenschaften, die für die Kommunikation sehr wertvoll sein können. Sie verbinden Informationen zeitlich und kausal, geben abstrakten Problemen konkrete Situationen und können dabei helfen, komplexe Veränderungen nachvollziehbar zu machen. Im Marketing hat sich daraus allerdings ebenfalls eine Universalregel entwickelt. Plötzlich soll jede Marke eine Geschichte erzählen, jeder Besucher soll emotional abgeholt werden und jede Dienstleistung soll in eine kleine Dramaturgie verwandelt werden.

Bei einer Webseite für eine beratungsintensive Leistung kann eine gut erzählte Geschichte erheblich mehr erklären als eine Liste mit fünf Vorteilen. Die Lesenden verstehen dann nicht nur, was angeboten wird, sondern auch, weshalb eine bestimmte Leistung in einer konkreten Situation relevant wird. Wer dagegen eine Telefonnummer, eine technische Spezifikation oder eine Öffnungszeit sucht, benötigt keine dramaturgische Reise bis zur Antwort.

Gutes Storytelling beginnt deshalb nicht mit der Frage, wie man eine Seite emotionaler macht. Es beginnt mit der Frage, ob ein Zusammenhang durch Erzählen verständlicher wird. Manchmal lautet die professionelle Antwort darauf schlicht „nein”.

Der Neuro Web Award hat meine Sicht auf Neuro-Webdesign nicht beendet

Meine Auseinandersetzung mit diesem Thema beschränkt sich nicht auf die Theorie. Im Jahr 2025 wurde die von mir entwickelte Webseite webdesign-mentor.de mit dem Neuro Web Award ausgezeichnet. Das war natürlich zunächst eine schöne Anerkennung für eine Arbeit, bei der Gestaltung, Bewegung, Inhalt und Nutzerführung sehr bewusst miteinander verbunden wurden. Gleichzeitig hatte ich bereits damals Schwierigkeiten damit, aus einer solchen Auszeichnung ein objektives Qualitätssiegel zu machen.

Eine Auszeichnung und ihr Aussagewert sind zwei verschiedene Dinge

In meinem Artikel über den „Neuro Web Award” habe ich diese Ambivalenz bewusst beschrieben. Ein Preis kann Arbeiten auswählen, Aufmerksamkeit erzeugen und eine bestimmte Perspektive auf Webdesign fördern. Daraus folgt jedoch keine unabhängige wissenschaftliche Validierung der ausgezeichneten Seiten. Vor allem lässt sich aus einer Auszeichnung nicht ableiten, dass jede gestalterische Entscheidung nachweislich eine bestimmte neuropsychologische Wirkung besitzt.

Für mich ist gerade diese Differenz inzwischen wichtiger geworden. Man kann eine Webseite für hervorragend halten und sich dennoch fragen, warum sie funktioniert. Man kann mit einer Juryentscheidung übereinstimmen und ihre Kriterien dennoch kritisch betrachten. Ebenso kann eine ausgezeichnete Seite gestalterische Schwächen aufweisen. Ein Award nimmt dem Betrachter diese Arbeit nicht ab.

Fachliche Entwicklung bedeutet auch, eigene Aussagen nachträglich enger zu fassen

Wenn ich heute einige meiner Texte aus dieser Zeit lese, würde ich manche Formulierung präziser wählen. Aussagen, Nutzer gezielt zu „steuern“ oder bestimmte unbewusste Reaktionen auszulösen, sind mir mittlerweile zu eindeutig. Das liegt nicht daran, dass die Wahrnehmungspsychologie für das Webdesign an Relevanz verloren hätte, sondern daran, dass mir die Beschäftigung damit gezeigt hat, wie groß die Entfernung zwischen einem wissenschaftlich beobachteten Effekt und seiner praktischen Verwendung sein kann.

Das empfinde ich nicht als Widerspruch. Fachwissen entwickelt sich gerade dann, wenn eine frühere Erklärung nicht aus Loyalität zur eigenen Position verteidigt werden muss. Ein Entwurf kann heute anders bewertet werden als vor einem Jahr, eine Studie kann eine liebgewonnene Annahme relativieren und ein Projekt kann zeigen, dass eine gestalterisch plausible Idee für die konkrete Zielgruppe nicht funktioniert.

Diese Form der Auseinandersetzung spielt auch in meinem Webdesign-Mentoring eine Rolle. Nicht die Weitergabe fertiger Rezepte ist dort interessant, sondern die Frage, wie sich eine gestalterische Entscheidung so weit zerlegen lässt, dass ihre Begründung sichtbar, diskutierbar und im konkreten Projekt überprüfbar wird.

Vielleicht ist das sogar eine der sinnvollsten Konsequenzen aus der Beschäftigung mit Neuro-Webdesign: weniger Gewissheit über vermeintliche Tricks und mehr Präzision bei der Frage, was man tatsächlich beobachtet.

Was sich messen lässt – und was wir nur hineininterpretieren

Spätestens an diesem Punkt wird aus Theorie praktische Analyse. Eine Seite kann gestaltet, veröffentlicht und anschließend beobachtet werden. Mit Daten entsteht jedoch ein neues Problem: Die Messbarkeit wirkt schneller objektiver, als sie tatsächlich ist. Ein Diagramm besitzt Zahlen, eine Heatmap Farben und ein A/B-Test einen Gewinner. Die Interpretation bleibt trotzdem eine intellektuelle Aufgabe.

Eye-Tracking und Heatmaps messen nicht dasselbe

In dem alten Beitrag hatte ich Heatmaps zu stark mit Augenbewegungen in Verbindung gebracht. Das ist fachlich nicht korrekt. Beim echten Eye-Tracking werden Blickbewegungen und Fixationen mit einer geeigneten Technik erfasst. Eine klassische Web-Heatmap arbeitet dagegen mit Interaktionsdaten. In der Hotjar-Dokumentation zu Heatmaps wird unter anderem zwischen Klick- bzw. Tippdaten, Mausbewegungen und Scrolltiefe unterschieden. Eine Move-Heatmap zeigt somit nicht, wohin ein Nutzer genau geschaut hat.

Das macht sie jedoch nicht nutzlos. So kann eine Klick-Heatmap beispielsweise anzeigen, dass Nutzer wiederholt auf ein Element klicken, das gar nicht interaktiv ist. Das gibt Aufschluss über die Erwartungen, die das Design erzeugt. Eine Scrollanalyse kann zeigen, welche Bereiche von welchem Anteil der Besucher überhaupt erreicht werden. Session Recordings können Abläufe sichtbar machen, die sich aus aggregierten Kennzahlen kaum erkennen lassen.

Es sollte jedoch nicht mehr aus der jeweiligen Messung herausgelesen werden, als in ihr enthalten ist. So beweist das Scrollen bis zu einem Absatz beispielsweise nicht, dass er gelesen wurde. Eine Mausbewegung ist keine Blickmessung. Ein Klick zeigt eine Handlung, aber nicht, was davor wahrgenommen, gelesen oder verstanden wurde.

Ein A/B-Test beantwortet immer nur die Frage, die man ihm gestellt hat

A/B-Tests besitzen eine besondere Anziehungskraft, da am Ende scheinbar eine eindeutige Entscheidung steht. Variante A oder B, mehr Anfragen, mehr Klicks, längere Nutzung. Doch schon die Auswahl der Zielgröße legt fest, was als Erfolg gilt. So kann ein CTA zwar mehr Klicks erzeugen, gleichzeitig aber auch weniger qualifizierte Anfragen hervorbringen. Eine kürzere Seite kann eine höhere Abschlussrate haben, während die längere Variante vorab mehr Fragen beantwortet und dadurch spätere Beratungsleistungen reduziert.

Auch die Ursache eines Unterschieds ist nicht automatisch klar. Wenn Variante B mit einem roten statt grünen Button besser abschneidet, liegt die Vermutung nahe, dass die Farbe ausschlaggebend war. Es kann jedoch auch sein, dass Rot im vorhandenen Layout schlicht den stärkeren Kontrast erzeugte. Es könnte auch eine andere Beschriftung beteiligt gewesen sein, der Test könnte in einer ungewöhnlichen Traffic-Phase gelaufen sein oder das Ergebnis könnte bei einer kleinen Stichprobe instabil sein. Gute Tests reduzieren solche Unsicherheiten, können sie jedoch nicht vollständig beseitigen.

Für mich liegt der Wert solcher Werkzeuge deshalb weniger in der Vorstellung, endlich objektiv zu wissen, was Menschen wollen. Sie zwingen dazu, eine Vermutung überhaupt erst einmal überprüfbar zu formulieren. Das ist bereits viel. Aus der Aussage „Der Hero fühlt sich zu voll an“ kann beispielsweise die Hypothese abgeleitet werden, dass zwei gleichgewichtete Handlungsoptionen die Auswahl erschweren. Daraus ergibt sich eine Veränderung, die beobachtet werden kann. Dadurch wird Webdesign zwar nicht mathematisch eindeutig, aber weniger selbstreferenziell.

Neuro-Webdesign und SEO begegnen sich früher, als beide Disziplinen denken

SEO und Neuro-Webdesign werden oft getrennt voneinander betrachtet. Während sich das eine um die Auffindbarkeit kümmert, ist das andere für die Wirkung nach dem Klick zuständig. In der Praxis bröckelt diese Trennung jedoch schnell. Ein Besucher kommt schließlich nicht als neutraler Betrachter auf eine Seite. Oft bringt er bereits eine Suchabsicht mit. Das Suchergebnis, der Snippet-Text und das verwendete Keyword wecken bestimmte Erwartungen, denen der erste sichtbare Bereich der Webseite gerecht werden muss.

Suchintention ist auch eine Wahrnehmungsfrage

Wer nach „Neuro-Webdesign“ sucht, hat bereits eine bestimmte Vorstellung. Wenn auf der Zielseite zunächst zwei Bildschirmhöhen lang über kreatives Webdesign gesprochen wird und erst später erklärt wird, was Neuro-Webdesign bedeutet, entsteht ein kleiner Erwartungsbruch. SEO löst dieses Problem nicht, indem das Keyword möglichst häufig vorkommt. Die Seite muss die mitgebrachte Frage früh genug aufgreifen, damit die Besucher erkennen, dass sie am richtigen Ort gelandet sind.

Das ist zugleich eine gestalterische Aufgabe. Die fachlich richtige Antwort kann vorhanden sein und trotzdem visuell zu schwach wirken. Wenn eine entscheidende Definition in einem unauffälligen Fließtext unter einem dominanten Bild verschwindet, konkurriert ihre inhaltliche Bedeutung mit einer anderen visuellen Hierarchie. Suchintention, Text und Gestaltung treffen daher bereits im ersten sichtbaren Bereich aufeinander.

Langer Content funktioniert nur mit unterschiedlichen Lesetiefen

Ein Fachbeitrag wie dieser stellt eine andere Herausforderung dar. Nicht alle Besucher werden mehrere tausend Wörter linear lesen. Die einen suchen eine Definition, die anderen interessieren sich für Farbpsychologie und wieder andere wollen wissen, ob Heatmaps tatsächlich Augenbewegungen zeigen. Daraus folgt jedoch nicht, dass der Inhalt in kurze Häppchen reduziert werden sollte. Eine gute Struktur ermöglicht verschiedene Einstiegsmöglichkeiten, ohne den gedanklichen Zusammenhang zu zerstören.

Hier kommen H2 und H3 wirklich zum Einsatz. Die H2 tragen die großen Argumente, die H3 öffnen darunter Fragen, bei denen es fachlich enger wird. Wer nur scannt, kann sich orientieren. Wer ein Thema wirklich verstehen möchte, findet genügend Raum, sodass eine Behauptung nicht schon nach zwei Sätzen in das nächste Thema übergeht. Genau deshalb ist ein langer Beitrag nicht automatisch tiefgründiger und ein stark gegliederter Beitrag nicht automatisch fragmentierter. Entscheidend ist, ob die Ebenen tatsächlich verschiedene Aufgaben erfüllen.

Was von Neuro-Webdesign bleibt, wenn die einfachen Versprechen verschwinden

Nach einer so kritischen Betrachtung könnte man meinen, der Begriff „Neuro-Webdesign” sei überflüssig. Ich komme inzwischen jedoch zu einem gegenteiligen Schluss. Wenn man die übertriebenen Versprechen außer Acht lässt, wird die Sache anspruchsvoller und für die praktische Gestaltung interessanter. Es gibt keine Methode, mit der ein Webdesigner das Gehirn eines Besuchers programmieren könnte. Es bleibt ein Gestaltungsansatz, der ernst nimmt, dass zwischen einer Information und ihrer Wahrnehmung etwas passiert.

Menschen gruppieren visuelle Elemente, bevor sie sämtliche Beziehungen bewusst analysiert haben. Aufmerksamkeit muss zwischen konkurrierenden Reizen verteilt werden. Erwartungen beeinflussen, wie neue Informationen eingeordnet werden. Emotionen sind an Entscheidungen beteiligt, ohne diese allein zu bestimmen.

Farben besitzen kulturell und psychologisch interessante Assoziationen, deren Wirkung in konkreten Benutzeroberflächen vom Kontext abhängt. Texte sind nicht nur semantischer Inhalt, sondern verändern auch die sichtbare Form einer Seite. Daten können Verhalten beschreiben, ohne dessen Ursache automatisch mitzuliefern.

Für das Webdesign ergibt sich daraus keine Checkliste, sondern eine andere Qualität von Fragen: Passt die sichtbare Hierarchie zur inhaltlichen? Erzeugt ein Effekt Orientierung oder fordert er nur Aufmerksamkeit für sich selbst? Ist eine Information deshalb nicht erfolgreich, weil sie schlecht formuliert ist oder weil sie an einer Stelle steht, mit der kaum jemand rechnet? Unterstützt die Bildsprache das, was der Text verspricht? Ist ein Gestaltungselement tatsächlich nötig, oder verteidigt der Designer es nur, weil es ihm besonders gut gefällt?

Bei der Neugestaltung einer Firmenwebseite sind solche Fragen oft wichtiger als stilistische Überlegungen. Unternehmen entwickeln sich weiter, ihre Leistungen verändern sich und ihre Zielgruppen werden genauer definiert. Dadurch verlieren bestehende Inhalte ihre ursprüngliche Gewichtung. Eine neue Oberfläche löst diese Verschiebungen jedoch nicht automatisch. Erst wenn Inhalt, Hierarchie und Gestaltung wieder dieselbe Geschichte erzählen, entsteht ein stimmiger Auftritt.

Vielleicht ist das der Punkt, an dem Neuro-Webdesign für mich heute am interessantesten ist. Je tiefer man sich damit beschäftigt, desto weniger geht es um Tricks. Es geht vielmehr darum, die eigenen gestalterischen Annahmen nicht mit menschlicher Wahrnehmung zu verwechseln. Forschung kann dabei Orientierung geben, Erfahrung kann Zusammenhänge sichtbar machen und Tests können Vermutungen überprüfen. Keine dieser Ebenen ersetzt die andere.

Gutes Neuro-Webdesign versucht deshalb nicht, das Gehirn der Besucher zu überlisten. Es berücksichtigt, dass auf der anderen Seite des Bildschirms ein Mensch sitzt.

Dies ist weniger spektakulär als das Versprechen, mit der richtigen Farbe, dem richtigen Wort oder einer bestimmten Anordnung das Verhalten von Menschen zuverlässig beeinflussen zu können. Für die Qualität einer Webseite ist das jedoch die interessantere Perspektive. Denn sie verlangt vom Webdesigner nicht nur Gestaltungskompetenz, sondern auch die Bereitschaft, Wahrnehmung, Inhalt, technische Bedingungen und eigene Entscheidungen immer wieder gegeneinander zu prüfen – selbst dann, wenn ein Entwurf bereits gut aussieht.