Wie wichtig der erste Eindruck einer Webseite ist, habe ich in einem früheren Artikel beschrieben. Der zweite Eindruck entscheidet aber, ob der Anwender auf der Seite länger verweilt. Welche Faktoren sind für den zweiten Eindruck von Bedeutung und wie können diese beeinflusst werden? Damit beschäftigt sich dieser Artikel.
Um den Anwender von sich oder seinen Produkten / Leistungen zu überzeugen, bleiben einer Webseite meistens nur wenige Sekunden. Dieser zweite Eindruck entscheidet, ob der Anwender weiter auf der Webseite bleibt oder sie verlässt. Je nach Literatur / Studie und je nachdem wie eng man den zweiten Eindruck fasst, kann man hier von ca. zwei bis gar zu zehn Sekunden ausgehen. In diesen ersten Sekunden also, will der Anwender unbewusst folgende Fragen beantwortet bekommen:
- Wo bin ich hier?
- Wo kann ich hin?
- Wo finde ich die Information, die ich suche?
Ergänzt durch die unbewussten Überlegungen, ob die Webseite seriös genug ist und ihr zuzutrauen ist, seine Bedürfnisse und Erwartungen zu stillen.
Welche Bedeutung hat der zweiten Eindruck?
Zum einen möchte der Anwender seinen ersten – hoffentlich schon positiven — Eindruck bestätigt bekommen, da wir unbewusst immer die Bestätigung unser Erwartungen suchen. Entscheidend ist dann die Glaubwürdigkeit der Seite. Trauen wir ihr zu, hier die Informationen zu finden, die ich suche und / oder schnell zu ihr zu kommen!
Was kann der User in den ersten Sekunden überhaupt aufnehmen?
Das so genannte Look & Feel – also das Aussehen und die Anmutung – nehmen wir unbewusst in Sekundenbruchteilen auf (siehe der Erste Eindruck).
Drei unterschiedliche Beispiele für das Look & Feel von Webseiten. Die Inhalte lassen werden zu Beginn noch nicht wahrgenommen, der Eindruck entsteht zuerst aufgrund der Gesamtgestaltung
In den ersten Sekunden scannt der Anwender die Seite erstmal ab, er überfliegt sie. Hier nehmen wir dann aber auch schon erste konkrete Inhalte wahr, die optisch besonders hervor stechen. Das sind meistens das Logo, die Hauptnavigation und da evtl. schon erste Menüpunkte, die ersten Headlines, Headerbilder, Werbebanner, erste Teaserbilder und Call-to-Action-Buttons.
Konsequenz für die Umsetzung:
Um die Seite leicht scanbar zu machen, sollten die Inhalte übersichtlich gestaltet sein und optische Schwerpunkte gesetzt werden. Mit Farbkontrasten und Größenunterschieden können gezielt Highlights gesetzt werden. Ergänzt mit dem Einsatz von Leerraum lässt sich so die Aufmerksamkeit des Betrachters lenken.
Werden dann noch Design-Konvention beachtet, wie beispielsweise die Platzierung des Logos und der Hautpnavigation an den Stellen, wo es der Betrachter erwartet, kann dieser die Seite mühelos, sprich intuitiv, überfliegen.
Da das Look & Feel sehr prägend für den Gesamteindruck ist, sollte die Farbgebung angenehm und die Auswahl der Bilder / Grafiken passend zum Thema der Seite und zu den Erwartungen der Betrachter sein.
Der Anwender wird auch schon erste Inhalte lesen, so dass die Hauptnavigation kurze klare Menüpunkte beinhalten sollte. Zu lange Namen, bzw. eine uneindeutige Benennung lassen sich nicht schnell aufnehmen und verwirren eher.
Die ersten Headlines sollten ebenso prägnant und verständlich sein, evtl. ergänzt mit passenden Bildern. Bilder sind für eine schnelle Aufnahme sowieso am besten geeignet (siehe Serie Bilderwelten). Sie sollten aber auch schon eine klare Botschaft vermitteln und nicht nur Selbstzweck sein. Also entweder entscheidend zum Look & Feel beitragen oder die Aufmerksamkeit des Lesers gezielt lenken und dann spannende Inhalte vermitteln.
Call-to-Action-Buttons fallen nicht nur im Vergleich zu „normalen Links“ besser auf, sie beinhalten auch gleich eine eindeutigen Handlungsaufforderung, was für den Anwender sehr angenehm ist.
Und bisher noch gar nicht erwähnt, beeinflusst den Anwender auch schon die Ladezeit der Seite, bzw. einzelner Inhalte. Grundsätzlich lässt sich sagen, je schneller die Inhalte geladen werden, umso positiver ist der Anwender der Seite gegenüber gestimmt.
Last but not least: Immer an die „menschlichen“ Faktoren denken: Der Anwender entscheidet oft schnell, unbewusst ohne nachzudenken. Er hat nicht viel Zeit, bzw. nimmt sich viel, um die Seite erstmal ausgiebig zu studieren, sondern trifft meistens die erstbeste Entscheidung!
Beispiel zweiter Eindruck — MailChimp
Logo und Hauptnavigation sitzen da, wo der Anwender es erwartet und sind optisch klar hervorgehoben. Großes ungewöhnliches Teaserbild, große Headline mit klarer Aussage, dazu ein markanter Call-to-Action-Button. Darunter eine Headline mit Teaserbildern. Die Elemente für den zweiten Eindruck sind eindeutig optisch hervorgehoben und der Anwender wird nicht überfordert mit Inhalten. Vorbildlich!
Beispiel zweiter Eindruck — web://contact
Logo und Hauptnavigation sind auch hier wie im ersten Beispiel schnell zu finden — interessant zu sehen, dass das Logo hier rechts steht, beim ersten Beispiel links. Funktioniert also beides! Eine Headline bestehend aus einem einzigen Wort — weniger geht nicht. Auf den Punkt gebracht, nennt man das dann wohl. Großes Teaserbild, die erste Referenz. Diese Elemente — alle in einer grünen Fläche — heben sich somit vom Rest ab. Dann folgt die Subline von viel Weißraum umgeben und ein markanter (Kreis-)Button. Insgesamt sehr übersichtlich und klar strukturiert und die Inhalte lassen sich schnell aufnehmen. Es wird keine Zeit durch unnötige Bilder oder Texte veschwendet. Kompliment!
Beispiel zweiter Eindruck — Versions
Navigation oben, ein rießiges Logo samt kurzer selbsterklärender Wortmarke. Dazu zwei Call-to-Action-Buttons. Fertig ist alles für einen schnellen zweiten Eindruck. Ergänzt noch durch eine Subline, Screenshot und zwei Teasern. Kurz und klar!
Beispiel zweiter Eindruck — cubedroute
Logo und Navigation im roten Balken mit viel Platz klar abgetrennt vom Content. Eine große Headline. Kurz und aussagekräftig. Dann zwei Reihen Headline und Teaserbilder. Wer sich hier nicht schnell einen zweiten Eindruck verschaffen kann… Sehr schön!
Fazit:
Der zweite Eindruck entscheidet, ob sich der Anwender weiter auf der Seite aufhält oder zur nächsten Seite weitergeht, die nur einen Klick entfernt ist. Daher ist seine Bedeutung nicht zu unterschätzen.
Denn bevor der Anwender überhaupt zum groß propagierten „Content is king“ kommt, muss er erstmal überzeugt werden, dass da „königliche“ Inhalte auf ihn warten könnten! Dies geht in erster Linie über optische Gestaltungsmittel in Ergänzung der ersten redaktionellen Inhalte (Navigationspunkte, Headlines, Bildauswahl etc.).