Warum manche Websites sich sofort stimmig anfühlen – und andere nicht.

Manchmal betrittst du einen Raum und fühlst dich sofort wohl. Du kannst vielleicht gar nicht genau sagen, woran es liegt. Das Licht stimmt, die Proportionen wirken angenehm, nichts ist zu viel. In einem anderen Raum fühlst du dich dagegen unruhig, obwohl du noch gar nicht bewusst wahrgenommen hast, was dich stört.

Ich kenne dieses Gefühl aus der Malerei und aus der Musik. Es gibt Akkorde, die sich für mich stimmig anfühlen, und solche, bei denen etwas nicht zusammenpasst. Oft kann ich das zunächst gar nicht erklären. Ich merke es einfach.

Beim Gestalten einer Website geht es mir ähnlich. Noch bevor wir einen Text lesen oder uns mit einem Angebot beschäftigen, nehmen wir wahr, wie eine Seite aufgebaut ist. Wir reagieren auf Farben, Formen, Abstände und darauf, wie all diese Elemente miteinander wirken.

Dass dieser erste Eindruck so schnell entsteht, ist inzwischen gut untersucht. Was genau dabei passiert und welche Rolle Schönheit, Proportionen und der Goldene Schnitt spielen, ist allerdings etwas komplizierter, als viele Designartikel vermuten lassen.

Wie schnell wir uns ein Bild machen

In einer Studie aus dem Jahr 2006 untersuchten die Forscher Gitte Lindgaard und ihre Kollegen, wie schnell Menschen die visuelle Attraktivität einer Website beurteilen. Die Teilnehmer sahen die Seiten teilweise nur 50 Millisekunden lang – und konnten trotzdem bereits einen ersten Eindruck davon gewinnen, ob ihnen das Design gefiel.

Andere Untersuchungen kamen zu ähnlichen Ergebnissen: Ein großer Teil unserer ästhetischen Bewertung entsteht innerhalb kürzester Zeit.

Was dabei besonders ins Gewicht fällt, ist die visuelle Komplexität. Websites, die übersichtlich aufgebaut sind und deren Elemente gut zusammenpassen, werden häufig als attraktiver wahrgenommen als überladene Seiten. Auch die Vertrautheit mit dem jeweiligen Seitentyp spielt eine Rolle. Wir haben bestimmte Erwartungen daran, wie eine Website aussehen und funktionieren sollte.

Das bedeutet nicht, dass eine Website nach dem ersten Eindruck bereits vollständig beurteilt ist. Inhalte, Verständlichkeit und tatsächliche Nutzererfahrung bleiben wichtig. Aber das Design beeinflusst, mit welcher Erwartung wir uns überhaupt auf eine Seite einlassen.

Gerade bei einer Praxis, einer therapeutischen Begleitung oder einem Coaching-Angebot finde ich das interessant. Wer sich mit einem persönlichen Anliegen an jemanden wendet, möchte sich orientieren können. Eine Website, auf der alles gleichzeitig um Aufmerksamkeit konkurriert, macht das nicht unbedingt leichter.

Zeitgenössische Abstrakte Kunst

Warum wir manche Gestaltungen als angenehm empfinden

In der Psychologie gibt es dafür den Begriff der Verarbeitungsflüssigkeit. Gemeint ist, wie leicht wir Informationen aufnehmen und verarbeiten können.

Eine klare Gestaltung kann diesen Prozess erleichtern. Dazu tragen beispielsweise gut lesbare Schriften, nachvollziehbare Strukturen, deutliche Kontraste und wiederkehrende Gestaltungselemente bei. Wenn wir nicht ständig überlegen müssen, wo wir hinschauen oder wie etwas zusammengehört, bleibt mehr Aufmerksamkeit für den eigentlichen Inhalt.

Interessant ist, dass die Leichtigkeit der Verarbeitung auch unsere ästhetische Bewertung beeinflussen kann. In Experimenten reagierten Menschen auf leichter zu verarbeitende Reize teilweise mit einer messbaren Aktivität des sogenannten Lächelmuskels, noch bevor sie bewusst ein Urteil abgegeben hatten.

Der Psychologe Robert Zajonc beschäftigte sich bereits 1980 mit der Frage, wie Gefühle entstehen können, ohne dass wir vorher bewusst über etwas nachdenken. Seine Forschung hat die Diskussion darüber geprägt, wie schnell und unmittelbar Vorlieben entstehen.

Für das Webdesign heißt das für mich nicht, dass eine schöne Website automatisch Vertrauen schafft. Vertrauen entsteht nicht allein durch eine passende Farbpalette oder eine elegante Schrift. Aber eine Gestaltung kann es Menschen leichter machen, sich zu orientieren und sich mit den Inhalten zu beschäftigen.

Und manchmal ist genau das der Unterschied: Eine Seite verlangt nicht ständig nach Aufmerksamkeit, sondern lässt uns bei dem bleiben, weshalb wir sie geöffnet haben.

Warum emotionales Webdesign gerade in der therapeutischen Arbeit eine Rolle spielt

Was Musik, Kunst und Webdesign miteinander verbindet

Vielleicht liegt es daran, dass ich sowohl gestalte als auch Musik mache, dass mich dieses Thema so beschäftigt. Für mich gehören diese Bereiche näher zusammen, als es auf den ersten Blick scheint.

Der Neurowissenschaftler Semir Zeki untersuchte unter anderem, wie Menschen auf bildende Kunst und Musik reagieren. In einer 2011 veröffentlichten Studie beschäftigte er sich mit der neuronalen Verarbeitung ästhetischer Erfahrungen. Dabei spielte der mediale orbitofrontale Kortex eine Rolle – eine Hirnregion, die auch an der Verarbeitung von Belohnung und subjektivem Wert beteiligt ist.

Das ist kein Beweis dafür, dass wir Musik und Design auf dieselbe Weise erleben. Es zeigt aber, dass ästhetische Erfahrungen verschiedene Sinnesbereiche miteinander verbinden können und dabei auch emotionale und belohnungsbezogene Prozesse beteiligt sind.

Wer schon einmal bei einem Musikstück Gänsehaut bekommen hat oder vor einem Gemälde stehen geblieben ist, kennt vielleicht diese Erfahrung: Etwas spricht uns an, bevor wir erklären können, warum.

Auch unsere Umgebung kann beeinflussen, wie wir uns fühlen. Eine bekannte Studie aus dem Jahr 1984 untersuchte beispielsweise, ob sich der Blick aus einem Krankenhauszimmer auf Bäume im Vergleich zu einer Backsteinwand auf die Genesung nach einer Operation auswirkte. Die Ergebnisse deuteten darauf hin, dass der Ausblick mit Unterschieden beim Krankenhausaufenthalt und beim Bedarf an Schmerzmitteln zusammenhing.

Natürlich lässt sich daraus nicht ableiten, dass eine schön gestaltete Website ähnliche Wirkungen erzielt. Trotzdem finde ich den Gedanken interessant, dass unsere Umgebung nicht bloß Kulisse ist. Sie kann beeinflussen, wie wir einen Ort erleben.

Für mich ist das eine der spannenden Fragen im Design: Wie lässt sich eine visuelle Umgebung gestalten, in der Menschen sich orientieren können, ohne sich eingeengt zu fühlen? Und wie entsteht eine Atmosphäre, die zum Inhalt passt, statt ihn nur dekorativ zu begleiten?

Spirituelle Mentorin Simone Bastian Webdesign Branding – Gestaltungsansicht 2 | CELA design

Der Goldene Schnitt – und was wirklich dahintersteckt

Kaum ein Proportionsverhältnis wird im Design so häufig erwähnt wie der Goldene Schnitt. Er begegnet uns in Artikeln über Architektur, Kunst, Fotografie und natürlich Webdesign. Oft wird er als eine Art universelle Formel für Schönheit dargestellt.

Der Goldene Schnitt beschreibt ein bestimmtes Teilungsverhältnis: Das Verhältnis des Ganzen zum größeren Teil entspricht dem Verhältnis des größeren zum kleineren Teil. Der daraus entstehende Faktor beträgt ungefähr 1,618.

Schon im 19. Jahrhundert untersuchte der Psychologe Gustav Theodor Fechner, welche Rechteckproportionen Menschen bevorzugen. In seinen Experimenten erhielt das Rechteck mit dem Goldenen Schnitt vergleichsweise viel Zustimmung. Daraus entwickelte sich die Vorstellung, dieses Verhältnis besitze eine besondere ästhetische Wirkung.

Die spätere Forschung zeichnet allerdings ein differenzierteres Bild. Zwar gibt es Untersuchungen, in denen Menschen bestimmte Rechteckproportionen bevorzugen. Eine eindeutige, allgemeingültige Vorliebe für exakt 1,618 lässt sich daraus aber nicht ableiten. Die Ergebnisse hängen unter anderem von der Versuchsanordnung ab, und auch individuelle Unterschiede spielen eine Rolle.

Zudem werden manche bekannten Beispiele nachträglich mit dem Goldenen Schnitt in Verbindung gebracht, ohne dass seine bewusste Verwendung historisch belegt wäre. Das gilt etwa für häufig wiederholte Behauptungen über den Parthenon oder die Spirale des Nautilus.

Warum verwende ich den Goldenen Schnitt trotzdem gelegentlich in meiner Arbeit? Weil er ein hilfreiches Werkzeug sein kann, um Proportionen aufeinander abzustimmen. Nicht, weil er jede Gestaltung automatisch schöner macht.

Es gibt schließlich noch andere Möglichkeiten, ein stimmiges Verhältnis zwischen Elementen herzustellen. Einfache Proportionen wie 2:3 oder 3:4 können genauso gut funktionieren. Auch die DIN-Papierformate beruhen auf einem durchgängigen Verhältnis, das sich beim Halbieren der Fläche erhält.

Entscheidend ist für mich weniger die konkrete Zahl als die Frage, ob die einzelnen Elemente miteinander in Beziehung stehen.

Wenn Überschriften, Fließtext, Bildgrößen, Spalten und Abstände einem nachvollziehbaren System folgen, wirkt eine Website häufig ruhiger und geschlossener. Das Verhältnis 1,618 kann dabei helfen. Es ist aber kein Geheimrezept.

Wenn wir noch nicht wissen, warum uns etwas gefällt

Ein weiterer interessanter Aspekt ist, dass unsere Wahrnehmung nicht immer mit einer bewussten Erklärung beginnt.

Der Neurologe Antonio Damasio untersuchte mit seinen Kollegen in den 1990er-Jahren unter anderem, wie emotionale und körperliche Reaktionen an Entscheidungen beteiligt sein können. In einem bekannten Experiment, dem sogenannten Iowa Gambling Task, sollten Versuchsteilnehmer aus verschiedenen Kartenstapeln wählen. Einige Stapel führten langfristig zu Gewinnen, andere zu Verlusten.

Die Forschung deutete darauf hin, dass körperliche Reaktionen bei manchen Teilnehmern bereits mit ungünstigen Entscheidungen zusammenhingen, bevor sie die zugrunde liegenden Zusammenhänge bewusst erklären konnten. Wie genau diese Reaktionen zu interpretieren sind und welche Rolle sie bei Entscheidungen spielen, wird bis heute diskutiert.

Für die Gestaltung einer Website lässt sich daraus keine direkte Regel ableiten. Aber es erinnert mich daran, dass Wahrnehmung nicht erst beim Lesen beginnt.

Wenn jemand eine Website öffnet, nimmt diese Person zunächst die Gestaltung als Ganzes wahr. Erst danach beschäftigt sie sich vielleicht mit der Biografie, den Angeboten oder den Preisen. Ein stimmiger erster Eindruck kann dazu beitragen, dass jemand länger bleibt und sich näher mit den Inhalten beschäftigt.

Eine ansprechende Gestaltung ersetzt dabei weder gute Texte noch ein überzeugendes Angebot. Sie kann aber den Rahmen schaffen, in dem beides überhaupt wahrgenommen wird.

Mobiles empathisches Webdesign

Was bedeutet das für deine Website?

Die Erkenntnisse aus der Wahrnehmungspsychologie lassen sich nicht in eine feste Formel übersetzen. Es gibt keine bestimmte Anzahl an Farben, Schriften oder Abständen, die jede Website schön und erfolgreich macht.

Ein paar Prinzipien haben sich in meiner Arbeit dennoch bewährt.

Weniger Elemente, die miteinander konkurrieren. Wenn jede Überschrift groß, jede Farbe auffällig und jeder Abschnitt besonders gestaltet ist, fällt es schwer, Wichtiges von weniger Wichtigem zu unterscheiden. Eine klare visuelle Hierarchie hilft dabei, den Blick zu führen.

Proportionen, die zusammenpassen. Schriftgrößen, Abstände und Bildformate sollten nicht unabhängig voneinander gewählt werden. Ein durchgängiges System sorgt für Zusammenhalt. Ob es auf dem Goldenen Schnitt oder auf einfacheren Verhältnissen beruht, ist zweitrangig.

Weißraum, der seinen Platz bekommt. Freie Flächen sind kein ungenutzter Raum. Sie können Inhalte voneinander trennen, Schwerpunkte setzen und dafür sorgen, dass eine Seite nicht überladen wirkt.

Eine Gestaltung, die zum Menschen und zum Angebot passt. Eine therapeutische Praxis braucht nicht dieselbe Bildsprache wie ein Musikprojekt oder ein Keramikatelier. Vertrautheit kann Orientierung geben, aber Wiedererkennbarkeit entsteht nicht dadurch, dass alle Websites gleich aussehen.

Und schließlich: Eine Website muss nicht nur auf den ersten Blick gefallen. Sie muss auch verständlich sein, auf dem Smartphone funktionieren und Menschen dabei helfen, die Informationen zu finden, die sie suchen.

Gerade bei spirituellen oder therapeutischen Angeboten finde ich es wichtig, eine eigene Bildsprache zu entwickeln, ohne dabei in Klischees zu verfallen. Tiefe lässt sich nicht durch möglichst viele Symbole herstellen. Oft entsteht sie gerade dann, wenn Bild, Schrift, Farbe und Inhalt sorgfältig aufeinander abgestimmt sind.

Wie eine passende Farbwelt entsteht

Authentische Imagefotografie für Heilberufe, Retreats und Zeremonien

Was gutes spirituelles Webdesign ausmacht

Bei CELA beginnt die Gestaltung deshalb nicht mit der Frage, welche Farben gerade angesagt sind oder welches Layout besonders modern wirkt. Mich interessiert zuerst, was eine Website vermitteln soll und wie sie sich für die Menschen anfühlen soll, die sie besuchen.

Aus dieser Grundlage entwickeln sich die Entscheidungen über Typografie, Bildsprache, Proportionen und Aufbau. In der Signature-Branding-Strategie geht es genau darum: eine Gestaltung zu entwickeln, die nicht nur gut aussieht, sondern zu deiner Arbeit und deiner Persönlichkeit passt.

Denn eine Website muss nicht möglichst viel Eindruck machen. Sie sollte den richtigen Eindruck vermitteln.

Wenn du wissen möchtest, wie deine Website heute wirkt und ob Gestaltung, Inhalte und Aufbau noch zu deiner Arbeit passen, können wir uns das gemeinsam in einem Erstgespräch ansehen.

Unverbindliches Erstgespräch buchen

Quellen

  • Bechara, A., Damasio, A. R., Damasio, H. & Anderson, S. W. (1994). Insensitivity to future consequences following damage to human prefrontal cortex. Cognition, 50(1–3), 7–15. https://doi.org/10.1016/0010-0277(94)90018-3
  • Bechara, A., Damasio, H., Tranel, D. & Damasio, A. R. (1997). Deciding advantageously before knowing the advantageous strategy. Science, 275(5304), 1293–1295. https://doi.org/10.1126/science.275.5304.1293
  • Falbo, C. (2005). The golden ratio – a contrary viewpoint. The College Mathematics Journal, 36(2), 123–134. https://doi.org/10.1080/07468342.2005.11922119
  • Fechner, G. T. (1876). Vorschule der Aesthetik, Kap. XIV: Experimentale Ästhetik. Goldner Schnitt und Quadrat. Leipzig: Breitkopf & Härtel. Online bei Projekt Gutenberg
  • Green, C. D. (1995). All that glitters: A review of psychological research on the aesthetics of the golden section. Perception, 24(8), 937–968. https://doi.org/10.1068/p240937
  • Ishizu, T. & Zeki, S. (2011). Toward a brain-based theory of beauty. PLoS ONE, 6(7), e21852. https://doi.org/10.1371/journal.pone.0021852
  • ISO 216:2007. Writing paper and certain classes of printed matter – Trimmed sizes – A and B series. iso.org/standard/36631
  • Lindgaard, G., Fernandes, G., Dudek, C. & Brown, J. (2006). Attention web designers: You have 50 milliseconds to make a good first impression! Behaviour & Information Technology, 25(2), 115–126. https://doi.org/10.1080/01449290500330448
  • Maia, T. V. & McClelland, J. L. (2004). A reexamination of the evidence for the somatic marker hypothesis: What participants really know in the Iowa gambling task. PNAS, 101(45), 16075–16080. https://doi.org/10.1073/pnas.0406666101
  • Markowsky, G. (1992). Misconceptions about the golden ratio. The College Mathematics Journal, 23(1), 2–19. https://doi.org/10.1080/07468342.1992.11973428
  • McManus, I. C., Cook, R. & Hunt, A. (2010). Beyond the golden section and normative aesthetics: Why do individuals differ so much in their aesthetic preferences for rectangles? Psychology of Aesthetics, Creativity, and the Arts, 4(2), 113–126. https://doi.org/10.1037/a0017316
  • Reber, R., Schwarz, N. & Winkielman, P. (2004). Processing fluency and aesthetic pleasure: Is beauty in the perceiver’s processing experience? Personality and Social Psychology Review, 8(4), 364–382. https://doi.org/10.1207/s15327957pspr0804_3
  • Tractinsky, N., Cokhavi, A., Kirschenbaum, M. & Sharfi, T. (2006). Evaluating the consistency of immediate aesthetic perceptions of web pages. International Journal of Human-Computer Studies, 64(11), 1071–1083. https://doi.org/10.1016/j.ijhcs.2006.06.009
  • Tuch, A. N., Presslaber, E. E., Stöcklin, M., Opwis, K. & Bargas-Avila, J. A. (2012). The role of visual complexity and prototypicality regarding first impression of websites: Working towards understanding aesthetic judgments. International Journal of Human-Computer Studies, 70(11), 794–811. https://doi.org/10.1016/j.ijhcs.2012.06.003
  • Ulrich, R. S. (1984). View through a window may influence recovery from surgery. Science, 224(4647), 420–421. https://doi.org/10.1126/science.6143402
  • Winkielman, P. & Cacioppo, J. T. (2001). Mind at ease puts a smile on the face: Psychophysiological evidence that processing facilitation elicits positive affect. Journal of Personality and Social Psychology, 81(6), 989–1000. https://doi.org/10.1037/0022-3514.81.6.989
  • Zajonc, R. B. (1980). Feeling and thinking: Preferences need no inferences. American Psychologist, 35(2), 151–175. https://doi.org/10.1037/0003-066X.35.2.151