Einfach ausgedrückt: Die Nutzer lesen eine Webseite nicht, sondern scannen sie nach einzelnen Wörtern und Sätzen.
Ein typisches Muster, das sich in Eye-Tracking-Berichten zeigt, ist, dass die Nutzer eine Seite schnell überfliegen und dabei nach unten scrollen. Dann klicken sie entweder auf die Schaltfläche „Zurück“ und erhöhen die Absprungrate, oder sie scrollen nach oben und beschäftigen sich erneut mit dem Inhalt.
Selbst wenn Inhalt, Umfang und Qualität alle Kriterien erfüllen und der Nutzer auf Ihrer Website bleibt, liest er nicht, sondern scannt – zwar etwas tiefer, aber immer noch.
Daher ist es wichtig, Websites so zu gestalten, dass sie leicht zu scannen sind, sowohl in einem Sekundenbruchteil, um zu entscheiden, ob deine Seite die Zeit des Lesers wert ist, als auch bei einem zweiten oder dritten Durchgang.
Mache den Zweck der Seite sofort klar
Jede Seite sollte ein Hauptziel haben. In den meisten Fällen wird dieses Ziel durch einen CTA (Call to Action) verkörpert.
Die gute Nachricht ist, dass dein Ziel (etwas zu verkaufen) und das Ziel des Nutzers (etwas zu kaufen) übereinstimmen werden, wenn Ihre Suchmaschinenoptimierung (SEO) nach Plan verläuft. Indem du den Zweck der Seite klärst, kannst du dem Nutzer zeigen, dass deine Ziele übereinstimmen.
Du kannst experimentieren, wenn du ein etabliertes Unternehmen hast und der Nutzer weiß, was er zu erwarten hat. Wenn du jedoch neu auf dem Markt sind oder ein geringeres Profil hast, musst du dich an etablierte Designmuster halten. Das bedeutet, dass ein SaaS wie ein SaaS aussehen sollte, ein Shop sollte wie ein Shop aussehen und ein Blog sollte wie ein Blog aussehen.
Du solltest deine CTA oberhalb der Falz platzieren – was im Webkontext bedeutet, dass der Benutzer nicht interagieren muss, um sie zu sehen. Dadurch wird es für den Nutzer einfacher, weiterzukommen, und er erfährt deutlich, was du anbietest.
Verwende visuelle Hierarchien
Der Von-Restorff-Effekt besagt, dass wir etwas umso eher wahrnehmen und uns daran erinnern, je mehr es hervorsticht.
Visuelle Hierarchien eignen sich hervorragend, um einen Benutzer durch den Inhalt zu führen. In HTML gibt es die Überschriftsebenen h1-h7 – obwohl in Wirklichkeit nur h1-h4 von großem Nutzen sind -, wodurch du mehrere Überschriftsebenen erhältst, die von verschiedenen Lesern mit unterschiedlicher Geschwindigkeit gescannt werden können.
Wir wissen zum Beispiel, dass Zwischenüberschriften wenig Wirkung haben, wenn ein Benutzer die Seite sorgfältig von oben nach unten liest, aber sie sind hervorragend geeignet, um die Aufmerksamkeit von Lesern zu erregen, die nur flüchtig lesen.
Amnesty verwendet eine sehr einfache Hierarchie, wobei die einzige Änderung bei den Zwischenüberschriften in einer stärkeren Gewichtung besteht. Aber das reicht aus, um die Aufmerksamkeit des Benutzers zu erregen.
Du kannst visuelle Hierarchien auch mit anderen Formen des Kontrasts schaffen; Gewicht und Farbe werden oft zusätzlich zur Größe verwendet. Im Hinblick auf Barrierefreiheit und integratives Design ist es ratsam, bei der Erstellung einer Hierarchie visuelle Indikatoren zu kombinieren; Überschriften sind beispielsweise in der Regel größer, fetter und farbig.
Verwende Negativraum
Stell dir eine Person vor, die in einer Menschenmenge steht. Nehmen wir an, sie trägt einen rot-weiß gestreiften Pullover und eine rot-weiße Pudelmütze – ziemlich unverwechselbar. Aber wenn Hunderte von anderen Personen um sie herum stehen, ist sie vielleicht schwer zu erkennen.
Stell dir nun die gleiche Person in der gleichen Kleidung vor, die allein steht. Wie lange würdest du brauchen, um sie zu erkennen? Auch ohne das gestreifte Outfit ist das keine große Herausforderung.
Isolierte Elemente sind nicht nur leichter zu erkennen, sondern ziehen auch das Auge an, weil der Negativraum (manchmal auch als Weißraum bezeichnet) um sie herum einen Kontrast erzeugt.
Bei der Verwendung von Negativraum kommt es darauf an, den Elementen genügend Raum zum Atmen zu geben und das Auge zu fesseln, ohne ihnen so viel Raum zu geben, dass sie vom Rest des Inhalts losgelöst sind.
Bilder mit Gesichtern einbinden
Bilder sind ein hervorragendes Mittel, um Markenwerte zu vermitteln und eine Website ansprechend zu gestalten. Aber wenn es darum geht, das Auge des Nutzers beim Scannen Ihres Designs zu fesseln, enthalten die besten Bilder Gesichter.
Ein Testimonial mit einem Bild des Kunden fällt zum Beispiel mehr ins Auge als ein reines Text-Testimonial.
