Nutzererfahrung (UX): Definition, Ziele und Beispiele

Bestimmt haben Sie auch schon einmal eine Website verlassen, weil sie grauenhaft zu bedienen war. Wir kennen das Gefühl – Aufblinkende Werbung, nicht auffindbare Seiten und Textwüsten sind nur drei der oft ursächlichen Gründe. Kurzum: Die Nutzererfahrung ist für uns als Userinnen und User negativ.

Wir zeigen Ihnen, basierend auf unseren Erfahrungen, was für eine gute Nutzererfahrung wichtig ist.

Was ist die Nutzererfahrung?

Die Nutzererfahrung, auch User Experience (UX), ist die Gesamtheit der Eindrücke und Interaktion eines Nutzenden mit einem Unternehmen. Es geht darum, wie eine Person eine Website, eine App oder Software wahrnimmt und erlebt. Das Ziel der Nutzererfahrung sollte immer sein, diese so intuitiv und angenehm wie möglich zu gestalten.

Eine gute UX berücksichtigt dabei unsere Bedürfnisse in jedem Schritt der Interaktion. Sie zielt darauf ab, positive Erfahrungen mit einer Website oder einem Produkt zu schaffen. Das erhöht unsere Loyalität zum Unternehmen.

Warum ist eine gute Nutzererfahrung wichtig?

Eine gute Nutzererfahrung ist wichtig, weil sie direkt die Zufriedenheit der Nutzenden, die Conversion Rate und damit den Erfolg einer Website beeinflusst. Wenn User und Userinnen sich während der Interaktion auf der Seite wohlfühlen, tendieren sie eher zum Kauf oder zur Buchung und empfehlen das Unternehmen weiter.

Das führt nicht nur zu einer höheren Kundenbindung, sondern kann auch die Markenwahrnehmung verbessern und neue Kundschaft anziehen.

Eine Website mit guter Nutzererfahrung kennzeichnet sich auch dadurch aus, dass sie für mobile Endgeräte optimiert wurde. Responsive Webdesign ist hier der Schlüssel. Eine Studie der Facit Group sieht hier vor allem drei wichtige Aspekte für eine gute UX sowohl am Desktop als auch mobil:

• Gleicher Content-Umfang für beide Versionen
• Ähnliche Seitenstruktur mit gleichem Look & Feel
• Angepasste Navigationsmechanik an die mobilen Endgeräte

Nutzererfahrung: Ziele

Eine gute Nutzererfahrung verfolgt den Plan, das Wohlbefinden der Nutzenden zu verbessern. Doch auch die Steigerung der Effizienz sowie das Erfüllen der Erwartungen und Bedürfnisse sind übergeordnete Ziele, die sich UX-Profis setzen müssen. Denn eine gute User Experience hat einen wesentlichen Einfluss auf die Markenwahrnehmung.

Wir erklären die wichtigsten Ziele noch einmal genauer:

Benutzerzufriedenheit

Es ist das wichtigste Ziel einer Website. Unternehmen, die dieses Ziel verfolgen, werden auch alle anderen Vorsätze mit höherer Wahrscheinlichkeit erreichen. Positive Erfahrungen sind wichtig, um die eigenen Erwartungen als Besucherin oder Besucher zu übertreffen und ein Gefühl von Freude auszulösen. Benutzerfreundlichkeit ermöglicht der Zielgruppe eine einfache Orientierung. Aspekte wie Ästhetik und Funktionalität sind in diesem Zuge ebenfalls wichtig – sprich der „Joy of Use“.

Nutzerbindung

Wurden Benutzerzufriedenheit und -freundlichkeit erreicht, ist es um einiges leichter, das Ziel der Nutzerbindung zu erfüllen. Denn wer sich auf einer Website wohlfühlt, schnell zum Kaufabschluss geleitet wird und Produkte innerhalb weniger Klicks findet, wird mit Sicherheit wiederkommen.

Kundentreue

Mit der Nutzerbindung geht die Kundentreue einher. Diejenigen, die wiederkommen, sind dem Unternehmen treu und werden als wertvolle Kundschaft behandelt. Feedback sollte zudem immer ernst genommen werden, sodass die Nutzererfahrung kontinuierlich verbessert werden kann.

Mobile UX Design

Auch das mobile Design wird im Zuge des „Mobile First“-Prinzips immer wichtiger. Denn wer sich lediglich auf die Konzipierung der Website fokussiert, verschenkt wertvolles Conversion- sowie Umsatz-Potenzial. Folgende Punkte sollten beim „Mobile First“-Ansatz beachtet werden:

• Smartphones bringen einen kleineren Bildschirm und somit weniger Platz für das Layout mit sich.
• Die Aufteilung der Elemente muss auf Smartphones so angeordnet werden, dass User und Userinnen mit einem Augenaufschlag alles überblicken können.
• Die Abstände zu einzelnen Elementen und Schaltflächen müssen beachtet werden.
• Funktionen wie Swipen, Scrollen und Zoomen müssen einwandfrei funktionieren.

Bei der Erstellung sollten Sie an verschiedene Nutzer-Typen aus Ihrer Zielgruppe denken:

• Stöberer möchten sich inspirieren und beeinflussen lassen. Sie sind noch nicht auf der Suche nach einem expliziten Produkt.
• Suchende wissen genau, welches Produkt sie möchten und suchen es aktiv in der Suchleiste der Website. Gute Filtermöglichkeiten und optimierte Suchen sind in diesem Fall unerlässlich.
• Navigierende nutzen das Menü, um sich über die Kategorien zu ihrem Produkt leiten zu lassen. Die Kategorieauswahl sollte daher genauestens geplant werden.

Nutzererfahrung messen: Kennzahlen und Tools

Um zu verstehen, wie gut oder schlecht die Nutzererfahrung und Benutzerfreundlichkeit auf Ihrer Website ist, müssen Sie diese messen. Dafür gibt es aus unserer Sicht vor allem vier wichtige Kennzahlen und drei Analysetools, die wir Ihnen vorstellen möchten:

Kennzahlen

• Bounce Rate: Dabei handelt es sich um den Prozentsatz der Besuchenden, die Ihre Seite verlassen, ohne weitere Aktionen durchzuführen. Laut Statista ist die Bounce Rate am Smartphone meist zwei Prozentpunkte niedriger als am Desktop-PC.
• Seiten pro Sitzung: Durchschnittliche Anzahl der Seiten, die während einer Sitzung angesehen werden. Je höher, desto besser. Auch die Ladezeiten der Seiten sind wichtig. Hier gilt: je kürzer, umso besser.
• Durchschnittliche Sitzungsdauer: Wie lange User und Userinnen gewöhnlich auf Ihrer Website verbringen.
• Conversion Rate: Der Prozentsatz aller Personen, die eine gewünschte Aktion ausführen – sich also zum Beispiel für einen Ihrer Newsletter anmelden oder etwas kaufen.

Tools

• Google Analytics: Die Analyse-Suite von Google ist ein absoluter Standard. Damit erhalten Sie Einblicke in das Nutzerverhalten, die Bounce Rates, Sitzungsdauer und vieles mehr.
• Hotjar: Mit Hotjar können Sie das Verhalten der Nutzerinnen und Nutzer auf Ihrer Website durch Heatmaps, Session Recordings und Umfragen analysieren.
• Optimizely: Ein Tool für A/B-Tests, mit dem Sie mit verschiedenen Layouts, Designs und weiteren Elementen experimentieren können. Optimizely hilft es, herauszufinden, welche Änderungen die Nutzererfahrung verbessern.

Es gibt darüber hinaus noch weitaus mehr Anbieter auf dem Markt. Unser Tipp: Konzentrieren Sie sich auf wenige, die Sie gut beherrschen. Das hilft oft mehr, als Dutzende im Einsatz zu haben, bei denen der Überblick schnell verloren geht.

Nutzererfahrung verbessern: Fünf Tipps

Die Optimierung der Nutzererfahrung ist entscheidend, um sicherzustellen, dass die Kundschaft Ihre Produkte oder Dienstleistungen reibungslos nutzen kann. Kontinuierliches Feedback und Auswertungen ermöglichen es, Verbesserung auf der Website vorzunehmen und die Kundenzufriedenheit zu steigern.

Wir zeigen Ihnen dafür fünf hilfreiche Tipps:

1. Pop-ups klug einsetzen

Beim Öffnen einer Website wird meist direkt das Cookie-Banner angezeigt. Schnell wird der Button „Auswahl speichern“ angeklickt und das Lesen der Website beginnt.

Plötzlich erscheint schon das nächste Pop-up und bewirbt den Newsletter oder ein aktuelles Angebot der besuchten Website. Und schon wieder ist der Lesefluss unterbrochen, Sie müssen das Banner wegklicken und wissen nicht mehr, welchen Abschnitt Sie gerade gelesen haben. Nervig, oder?

Pop-ups sorgen schnell für Verärgerung, gerade auf Mobilgeräten. Wir empfehlen daher: Verwenden Sie keine Pop-ups, die die gesamte Seite einnehmen. Wenn sie doch zum Einsatz kommen sollen, dann möglichst unaufdringlich. Zum Beispiel, wenn der User die Website verlassen möchte oder erst, wenn ein gewisser Prozentsatz der Seite gesichtet wurde.

Da es seit dem 1. Dezember 2021 allerdings eine Cookie-Banner-Pflicht gibt, kommen Sie um diese Meldung nicht drum herum. Allerdings können Sie es schlau lösen und lediglich ein kleines Banner im Header- oder Footer-Bereich installieren.

2. Werbebanner dezent gestalten

Ähnlich verhält es sich mit aufdringlichen Werbebannern. Sogar auf den Websites vieler großer Magazine wimmelt es nur so vor animierter, blinkender und reißerischer Werbung. Dadurch geraten die eigentlichen Website-Inhalte merklich in den Hintergrund.

Einige Nutzerinnen und Nutzer empfinden Werbebanner als so störend, dass sie gezielt Adblocker einsetzen. Laut einer Studie von Hootsuite nutzen weltweit 37 Prozent der Personen zwischen 16 und 64 Jahren Adblocker. Als Hauptgrund mit 62 Prozent wurde angegeben, dass oft zu viele Ads auf einer Seite untergebracht sind. Auch die Irrelevanz der angezeigten Werbung wird mit knapp 41 Prozent genannt.

Denken Sie also auch daran, solche Banner bewusst und nicht zu auffällig einzusetzen. Dafür können Sie beispielsweise den Raum um den Inhalt herum nutzen. Ein neben dem Text platziertes Banner greift weniger in die Nutzererfahrung ein, ähnlich wie die Werbung oberhalb oder unterhalb des Seiteninhalts.

3. Texte lesen einfach gemacht

Texte an Bildschirmen – vor allem mobil – zu konsumieren ist deutlich einfacher, wenn sie eine ordentliche sowie lockere Formatierung haben und gleichzeitig gut strukturiert sind. Darum sollten Websites und insbesondere deren Artikel nicht nur inhaltlich gut geschrieben sein, sondern auch ansprechend aussehen. Das ist für die Suchmaschinenoptimierung ebenfalls ein wichtiger Faktor.

Damit die Nutzererfahrung und SEO gleichermaßen gefördert werden, hier sind unsere wichtigsten Tipps für UX Writing:

1. Einleitung auf den Punkt bringen: Die Aufmerksamkeitsspanne der Menschen nimmt immer weiter ab. Generelle Medienwahrnehmungen sind kurz, sagt das Ergebnis einer umfangreichen Meta-Analyse von „eye square“. Gerade einmal 2,5 Sekunden fokussiert sich der durchschnittliche Mensch auf einen Inhalt, bevor er beschließt, eine Seite wieder zu verlassen oder weiter zu scrollen. Die Einleitung einer Seite muss also pointiert und aussagekräftig sein.
2. Kurze Sätze: Nutzen Sie kurze Sätze und Absätze. Das macht einen Text deutlich besser lesbar. Wenn eine Seite zudem mit genügend Weißraum formatiert ist, hilft das auch den Nutzenden, die Texte schnell zu überfliegen.
3. Bilder, Grafiken und Videos: Ein weiteres visuelles Hilfsmittel, das die Benutzererfahrung verbessert und die Absprungrate senkt, sind Bilder und Grafiken. Bei schwierigen Themen sollten zudem Videos genutzt werden, um den Sachverhalt einfacher erklären zu können.

Alle drei Elemente helfen Besuchenden, die Themen der Seite besser und umfassender zu verstehen. Vor allem Videos sind bei Konsumierenden sehr beliebt: Laut der Studie von Wyzowl, informieren sich 44 Prozent der Befragten am liebsten mit kurzen Videos über ein Produkt oder eine Dienstleistung. Nur 13 Prozent bevorzugen textbasierte Artikel.

4. Chatbots

Mittlerweile haben laut einer Umfrage von Userlike über 80 Prozent der Websitebesucherinnen und -besucher mindestens einmal mit einem Chatbot interagiert.

Chatbots sind also ein toller Weg, um Ihrer potenziellen Kundschaft hilfreich zur Seite zu stehen und sofort Antworten zu liefern. Dabei gilt es darauf zu achten, dass der Chatbot eine klare Funktion erfüllt.

Einsatzgebiete für einen Chatbot gibt es viele:

• Beantwortung wiederkehrender Fragen
• Direkter Support häufiger Probleme
• Vorqualifizierung von Kundschaft
• Verteilung von Anfragen an Mitarbeitende
• Komplette Bestellabwicklung
• Kaufberatung
• Beschwerdemanagement

Die Vorteile liegen auf der Hand: Ein Chatbot kann neben einer großen Zeitersparnis für das Unternehmen auch eine großartige Hilfestellung für die Seitenbesuchenden darstellen.

Wir bieten sogar im HubSpot CRM eine Chatbot-Funktion an: Sie macht es dank KI einfach, die Logik hinter einem Chatbot zu verstehen und ihn auf Ihrer eigenen Website einzubinden.

5. Achten Sie auf Details

Natürlich spielt das Große und Ganze bei einer positiven Nutzererfahrung eine wichtige Rolle. Dazu zählen beispielsweise ein ansprechend einheitliches Design, gleiche Farben für gleiche Elemente und andere, sich auf der gesamten Website durchziehende Faktoren.

Gerne werden jedoch die Details vergessen. Dabei ist genau das der Punkt, mit dem Sie sich von der Konkurrenz abheben können. Einige Beispiele, die wir immer wieder mal negativ, mal positiv erleben:

• Die 404-Seite führt ins Leere. Hier müssen Sie direkt eine Alternative für Ihre Besucherinnen und Besucher anbieten. Seien Sie kreativ. Disney macht das, wie wir finden, sehr gut vor.

Quelle: Screenshot Disney

• Zeigen Sie den Personen, die ein Formular ausfüllen, woran es noch hakt. Weisen Sie Fehlermeldungen direkt an den entsprechend ausgefüllten Feldern aus. So wissen Besuchende sofort, an welchen Stellen sie fehlende oder falsche Angaben eingesetzt haben.
• Wenn es bei einer Suche auf Ihrer Seite keine Treffer gibt, sollten Sie das Ihren Nutzenden sagen. Im besten Fall teilen Sie ihnen mit, dass leider kein passendes Ergebnis gefunden wurde und dass sie eine erneute Suchanfrage mit einem anderen Begriff starten sollen.

Barrierefreiheit verbessern: Sechs wirksame Maßnahmen

Ein barrierefreies Webdesign zielt darauf ab, für jede Person zugänglich und bedienbar zu sein. Dabei spielt es keine Rolle, ob der Besuchende körperliche Einschränkungen oder begrenzte technische Möglichkeiten hat.

Wir haben Ihnen dafür sechs Maßnahmen zusammengestellt.

1. Alternative Tags für Bilder

Kennzeichnen Sie jedes Bild mit einem sogenannten „Alternative Tag“. Das bedeutet, dass der Inhalt des Bildes in möglichst wenigen Worten beschrieben wird.

Das hilft insbesondere den Menschen, die einen Screenreader nutzen, sich Bilder vorstellen zu können oder aber die Bildersuche zu nutzen und zu hören, ob sie ein passendes Bild gefunden haben.

2. Klare Kontraste

Nicht nur Menschen mit Seheinschränkungen freuen sich über klare Kontraste. Dadurch sind Schriften einfacher lesbar, Elemente besser zu erkennen und das grafische Gesamtbild einer Website wirkt harmonischer.

Achten Sie vor allem bei Schaltflächen, Buttons, Bildern mit darüber liegendem Text und anderen Elementen mit einer Hintergrund- und Vordergrundfarbe auf einen möglichst hohen Kontrast.

Möchten Sie prüfen, ob die Farben Ihrer Schrift in Kombination mit einer Hintergrundfarbe genug Kontrast für eine gute Lesbarkeit bieten, können Sie dafür den Farbkontrast-Check von Siteimprove nutzen.

3. Logische Überschriften-Strukturen

Alle Texte und Inhalte verfügen über diverse Überschriften oder Titel und das oft in der gleichen Struktur. In der HTML-Auszeichnung werden sie absteigend von h1 bis h6 bezeichnet.

Eine logische Überschriften-Struktur (eine h1, mehrere h2 und so weiter) aufzubauen ist nicht nur vorteilhaft für das Leseerlebnis und die Nutzererfahrung, sondern auch für Ihre SEO. Dadurch können Sie wichtige Keywords nach Relevanz in Ihre Texte einbauen.

4. Inhaltsverzeichnis für lange Artikel

Fügen Sie am besten bei allen, besonders aber bei langen Artikeln, Inhaltsverzeichnisse ein. Angelehnt an den letzten Tipp bezüglich logischer Überschriften-Strukturen sind die Inhaltsverzeichnisse natürlich nur so gut wie eben diese. Kontrollieren Sie also besser vor der Veröffentlichung, ob das Inhaltsverzeichnis mit Ihren Überschriften übereinstimmt.

Ein Tipp: Für WordPress-Websites können Inhaltsverzeichnisse ganz einfach mit kostenlosen Plugins (z. B. Easy Table of Contents) erstellt und eingebaut werden.

5. Links aussagekräftig benennen

Externe und interne Links sind essenzielle Bestandteile von Websites, um Nutzerinnen und Nutzer zu führen und nützliche Inhalte zu zeigen.

Benennen Sie Verlinkungen so, dass rein anhand des Linktextes erkannt werden kann, wohin diese führen. Ein aussagekräftiger Link wäre also beispielsweise benannt mit „Mehr Infos zu Thema XY“ oder „Klicken Sie, um das PDF herunterzuladen“.

6. Video und Audio in jeglicher Form anbieten

Wie bereits erwähnt, sind es vor allem Videos, die Website-Besuchende sehen möchten. Doch wie ist es für Menschen, die nicht sehen oder hören können? Im Falle von Podcasts bietet sich in etwa ein Transkript an, welches Sie bereitstellen können. Gleiches wäre auch für Videos denkbar.

Oftmals gibt es für blinde oder sehbehinderte Menschen Audio-Transkripte von Videos, die erklären, was im Video zu sehen ist. Diese Audiodeskription wird optional zugeschaltet oder als separates Video zur Verfügung gestellt.

Auch Untertitel sind eine einfache Lösung, um Videos barrierefreier zu gestalten.

Beispiele für Websites mit guter Nutzererfahrung

Wer eine Website mit guter Benutzererfahrung erstellen möchte, sollte sich an die oben genannten Punkte halten, um Besuchenden das Erlebnis so positiv wie möglich zu machen. In den untenstehenden Beispielen gelingt das unserer Meinung nach bereits sehr gut.

Airbnb

Quelle: Screenshot Airbnb

Die Airbnb-Seite ist in ihrem User Interface sehr simpel gehalten – sowohl mobil als auch in der Desktop-Version. Am PC leitet uns die Seite direkt zur Suche, damit wir nach Unterkünften Ausschau halten können.

Das Besondere für das Nutzererlebnis: Wir müssen nicht zwingend einen spezifischen Ort und ein genaues Datum eingeben. Airbnb macht bereits Vorschläge. Darüber hinaus bestechen sowohl die Desktop-Version als auch die mobile Website und die App mit ihrer Einfachheit.

Denn insbesondere in der App, und das ist nicht bei jedem Anbieter der Fall, lässt sich der Buchungsprozess in Windeseile abschließen. Es ist möglich, Zahlungen sicher abzuwickeln, da die individuellen Zahlungsdaten gespeichert werden. Zeitgleich können wir mit den Vermieterinnen und Vermietern in Kontakt treten.

Durch Gästebewertungen können wir uns ein eigenes Bild der Anbieter machen. Am unteren Bildrand können wir sofort auf die eigenen Wunschlisten zugreifen, Reisen planen, das Postfach betreten oder das Profil besuchen.

Nicht zuletzt wurden die wichtigsten Elemente in der App sowie auf der Website gleichermaßen integriert, um Nutzenden die Möglichkeit der Wiedererkennung und schnellen Orientierung zu bieten.

Twitch

Quelle: Screenshot Twitch

Die Streaming-Plattform Twitch ist hauptsächlich für ihre Gaming-Inhalte bekannt. Die Seite mag auf den ersten Blick überladen wirken, hat sich jedoch genau auf die eigene Zielgruppe spezialisiert – indem sie auf der linken Seite beliebte Streamerinnen und Streamer vorstellt sowie aktuell beliebte Streams priorisiert anzeigt.

Die Vielfalt an Inhalten macht die Plattform zu einem eigenen Kosmos. Wir haben die Möglichkeit, ein eigenes Konto anzulegen, um unsere Nutzererfahrung personalisieren zu lassen. Über das eigene Konto besteht damit auch die Möglichkeit, mit anderen Personen in Kontakt zu treten.

Was uns außerdem gut gefällt, ist die Qualität und Stabilität der Übertragungen. Für eine Plattform wie Twitch von außerordentlicher Wichtigkeit.

Wer sich Twitch über das mobile Endgerät anschauen möchte, hat mit der App die Möglichkeit dazu. Die App ist überdies darauf ausgelegt, die Videos im Hintergrund laufen zu lassen, während wir eine andere Aktion am Smartphone ausführen.

Calm

Quelle: Screenshot Calm

Die Entspannungs-Website Calm bietet Möglichkeiten für das Erlernen von Meditation und Achtsamkeit. Genau diese Gefühle der Ruhe zu vermitteln, ist den Entwicklerinnen und Entwicklern gelungen: Die Farben sind gedeckt, ein großes Bild eines Bergsees dominiert den Hintergrund der Landingpage. Besucherinnen und Besucher werden nicht durch unnötige Buttons abgelenkt.

Wer zum ersten Mal zu Besuch auf der Seite ist, kann zunächst einen Fokus auf die Meditation wählen. Dieser Fokus wird durch verschiedene Fragen spezifiziert, bis am Ende eine Präferenz erstellt wird, die über ein eigenes Nutzerkonto abgerufen werden kann.

Calm stellt zudem Musik und tageszeitabhängige Meditationen zur Verfügung.

In der App ist es uns möglich, die Offline-Funktion zu wählen. Im Flugmodus oder ohne Zugriff auf das Internet ist eine Nutzung dennoch möglich. Wer zwischen der App und der Website hin- und herwechselt, wird sich schnell zurechtfinden: Jeweils am linken Bildrand befindet sich eine dunkelblaue Sidebar, im Zentrum des Bildschirms sind die verschiedenen Meditationen und Musikstücke angesiedelt.

Quelle: Screenshot Calm

Fazit: Gute User Experience (UX) auf einer Website ist Pflicht

Es ist entscheidend, dass Sie auf Ihrer Website eine gute Nutzererfahrung bieten. Ein positives UX-Design nimmt die Bedürfnisse der Kundschaft ernst und unterstützt sie in jedem Interaktionsschritt. Ihre Seitenbesucherinnen und -besucher müssen sich wohlfühlen, schnell finden, was sie suchen und sollen die Seite erst wieder verlassen, nachdem sie zufrieden damit interagiert haben.

Titelbild: HubSpot