Webdesigner kümmern sich um ansprechende Rahmenbedingungen für den Inhalt einer Website und müssen die Aufmerksamkeit der Seitenbesucher erreichen und steuern. Seitenbesucher interessieren sich allerdings mehr für den Inhalt als für die Form. Nach einer Studie von HubSpot empfinden 76 Prozent der befragten Nutzer leicht auffindbare Informationen als den wichtigsten Faktor beim Webdesign. Die schnelle und zielführende Bereitstellung intuitiv auffindbarer Informationen ist es also, was Seitenbesucher vom Design einer Website erwarten.

Zur Studie von HubSpot

Beim Design spielen neben dem Gespür für das Schöne insbesondere wissenschaftliche Erkenntnisse und damit objektive Daten in den Prozess der grafischen Gestaltung hinein. Die folgenden Webdesign-Tipps basieren auf Ergebnissen wissenschaftlicher Studien.
 

1. Die Ladegeschwindigkeit hat Priorität

Abbildung - Test your mobile Speed Google - Speedtesting Tool mobile WebsiteTesten Sie die Ladegeschwindigkeit. Wenn Ihre Website nicht schnell genug lädt, springen Besucher nach wenigen Sekunden ab. (Quelle: Screenshot von testmysite.thinkwithgoogle.com)

Niemand wartet gerne. Ist die Website nicht innerhalb von drei Sekunden geladen, verlassen 40 Prozent der potenziellen Besucher diese wieder. Untersuchungen von Google und Microsoft haben bereits vor vielen Jahren festgestellt, dass sich die Ladegeschwindigkeit auf alle Bereiche wie Zufriedenheit der Besucher, Bounce-Rate, Conversions und Umsatz auswirkt. In der Folge ranken Suchmaschinen langsam ladende Seiten schlechter. Achten Sie daher immer darauf, dass die Seite möglichst schnell lädt. Google kann Ihre Website testen und Tipps zur Optimierung geben. Die folgenden Artikel helfen bei Optimierungen für WordPress, Joomla! und Magento:

 

2. Hick´s Law: Durch eine geringere Auswahl die Conversion-Rate steigern

Das Hicksche Gesetz besagt, dass ein Mensch umso länger für eine Entscheidung braucht, je mehr Wahlmöglichkeiten dieser hat. Dazu wurde in einem Supermarkt ein interessanter Test durchgeführt, (zum Test) Probanden konnten mehr oder weniger Sorten von Marmeladen ausprobieren. Das Ergebnis: Die Personen mit mehr Auswahlmöglichkeiten haben sich am Ende mit geringerer Wahrscheinlichkeit für eine Marmelade entschieden und diese gekauft als die Personen mit weniger Auswahlmöglichkeiten.

Daraus folgt, dass Sie Conversions einfach steigern können, indem Sie die Auswahlmöglichkeiten der Seitenbesucher einschränken. Zum Beispiel können Sie die Anzahl der Menüpunkte reduzieren, sich auf ein Ziel und eine Call-to-Action pro Seite konzentrieren und nur die Social-Media-Buttons der Netzwerke anzeigen, in denen Sie tatsächlich aktiv sind.
 

3. Die Reihenfolge: Wichtiges an Anfang und Ende

Die Aufmerksamkeitsspanne der Seitenbesucher wird immer kürzer. Kurze Absätze werden gelesen, längere Absätze überflogen und lange Absätze übersprungen.

Der Primacy-Recency-Effekt besagt, dass Leser in Texten früh und spät dargestellte Informationen besser erinnern. Dieser Effekt ist für optimales Marketing von Bedeutung: Die wichtigen Infos gehören an den Anfang und das Ende der Website. Mehr Informationen zum Primacy-Recency-Effekt

Abbildung des Primacy Recency Effekts - Quelle Wikipedia

Grafische Darstellung des Primacy-Recency-Effekts. (Quelle: https://en.wikipedia.org/wiki/Serial-position_effect)

 

Hinweis: Beim Menü spielt der Primacy-Recency-Effekt hingegen keine Rolle. Wie eine im Journal of Usability veröffentliche Studie zeigt, hat die Reihenfolge der Menüpunkte für den Erfolg eine untergeordnete Rolle. Der Home-Button sollte links sein, danach folgen die Punkte nach Ihrem Geschmack. Zu den Journal of Usability Studies

 

4. Webdesign und Wissenschaft: Aufmerksamkeit mit Farben steuern

Eine Studie von EvaQuant über die Farben von Schaltflächen bestätigt die Bedeutung von Farben zum Lenken der Aufmerksamkeit. Farbige Buttons sind jedoch nicht immer effektiv – folgende Tipps helfen dabei, dass Schaltflächen prominent hervorstechen:

  • Die Button-Farbe sollte im Kontrast zum Hintergrund stehen.
  • Die Farbe des Buttons und des enthaltenen Textes sollte sich unterscheiden.
  • Die Button-Farbe sollte sich von naheliegenden Objekten abheben.

Zur Studie EyeQuant

Tipp: Wählen Sie eine Action-Farbe für alle Links und Schaltflächen aus, die sich von den (passiven) Unternehmensfarben unterscheidet. Die Action-Farbe verwenden Sie nur für anklickbare Objekte.

 

5. Einfache Sprache und kurze Absätze mit begrenzter Wortzahl pro Zeile

Drei wichtige Tipps aus Studien zur Lesbarkeit von Texten:

  • Je leichter der Text zu lesen ist, desto erfolgreicher ist die Website. Vermeiden Sie daher:
    • lange Sätze mit mehr als 20 Wörtern
    • verschachtelte Sätze
    • besonders schlaue Wörter, deren Bedeutung kaum jemand kennt: Selbst Professoren bevorzugen eine einfache Sprache.

Weitere Tipps zur Lesbarkeit von Texten,

  • Lange Absätze werden von den Lesern übersprungen. Als allgemeine Regel gilt:
    • Absätzen sollten maximal drei bis vier Zeilen lang sein.
    • Lange Zeilen erschweren das Lesen. Der Web Style Guide empfiehlt nicht mehr als zwölf Wörter pro Zeile und enthält viele weitere Informationen – ein Lesetipp!

 Zum Web Style Guide

Die folgende Tabelle veranschaulicht den Erfolg einer Website nach Überarbeitung des Textes.

Erfolgsrate Original Website Überarbeitete Website
Besucher mit geringen Lesekenntnissen 46% 82%
Besucher mit hohen Lesekenntnissen 68% 93%

 

6. Fotos von Personen verwenden

Abbildung - Eyetracking Studie

Fotos von Personen können die Aufmerksamkeit auf relevante Inhalte steuern, (Quelle: https://www.linkedin.com/pulse/20140813103409-1146575-here-s-looking-at-you/.)

Fotos von Personen wirken anziehend und sind ein wichtiges Hilfsmittel im Webdesign. Die Darstellung von Gesichtern und Zitaten steigert die Aufmerksamkeit und zugleich Conversion. Zu diesem wichtigen Ergebnis ist eine Fallstudie von Basecamp gekommen. Wichtig: Verwenden Sie keine Stock-Fotos! Nach einer Studie der NN Group schauen Besucher sich Bilder von echten Personen an und filtern Stock-Fotos von Personen aus. Wichtig ist auch, wohin die Personen schauen: Wenn die Augen in die Kamera schauen, sehen Besucher nur die Person. Schaut die Person jedoch zur Überschrift, schauen Personen ebenfalls auf die Überschrift oder zum Beispiel zu einem „Jetzt bestellen“-Button.

Zur Fallstudie von Basecamp

Zur Studie der NN Group

Die vorgestellten Studien und Tipps stellen nur eine Auswahl dar. Es existieren viele weitere Studien, deren Erkenntnisse Webdesigner für eine bessere Seitengestaltung nutzen können. Wir freuen uns, von Ihren Erfahrungen zu hören und welche wissenschaftlich fundierten oder aus dem Bauch heraus getroffenen Veränderungen bei Ihnen zu mehr Erfolg geführt haben.

Titelmotiv: Pixabay Free Pictures

10 thoughts on “Webdesign trifft Wissenschaft: 6 Webdesign-Tipps auf Basis wissenschaftlicher Erkenntnisse

    • Hallo Matt,
      das kann man so allgemein nicht beantworten, denn das hängt sehr stark vom übrigen Design der Webseite ab.
      Ich persönlich bevorzuge Buttons, die farblich mit den Logofarben harmonieren, aber zugleich einen ausreichend großen Kontrakt zur Umgebung aufweisen.
      Diese Frage eignet sich hervorragend für A/B Tests. Test einfach einmal verschiedene Varianten (Größen und/oder Farben) bei Deiner Zielgruppe.
      Mit besten Grüßen
      Wolf-Dieter

  1. Ich bin damit einverstanden und glaube, dass Farben eine wichtige Rolle spielen. Buttons sollen die Priorität haben und sollen die Aufmerksamkeit ziehen. Ich werde definitiv deine Tipps folgen und die richtigen Farben wählen. Danke für den Beitrag!

  2. Hallo zusammen,

    als Webagentur in Düsseldorf achten wir bei unseren Kundenprojekten besonders darauf, das die Website Geschwindigkeit möglichst hoch liegt, da dies auch als neuer Google Ranking Faktor sehr relevant ist. Der Artikel hier hat uns nochmal einige Gedankenstöße gegeben. Vielen Dank und beste Grüße.

  3. Für ein neues Unternehmen möchte ich eine Website erstellen. Durch den Artikel weiß ich, dass die Ladezeit so gering wie möglich sein sollte. Daher werde ich die Webseiten designen lassen, da diese hiervon mehr Ahnung haben.

    • Das ist für eine erfolgreiche Webseite auch immer das Beste. Zwar kann es ein Laie schaffen das seine selbstgebastelte Seite relativ nett ausschaut. Was ein Laie aber definitiv nicht schafft sind gute SEO Werte eine klare Seiten Struktur und die optimalste Performance zu erreichen. Oft fängt es bei der Bilderkomprimierung an und hört bei Alt Attributen und Überschriftenstrukturen auf. Alles sollte stimmig sein. Aber auch bei der Wahl des Web Designers ist Obacht geboten! Viele machen auch nur das was der Kunde sehen kann. Schau doch einfach mal bei Seobility oder gtmetrix und analysiere mal paar der erstellten Webseiten der jeweiligen Agentur. Ich für mich biete gar keine Webseiten an ohne das Mindestmaß an SEO und Performance. Leider sehen das nicht alle so. Gruß

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Die von Ihnen hier erhobenen Daten werden von der Host Europe GmbH zur Veröffentlichung Ihres Beitrags in diesem Blog verarbeitet. Weitere Informationen entnehmen Sie bitte folgendem Link: www.hosteurope.de/AGB/Datenschutzerklaerung/