Erst vor kurzem haben wir euch einige UX-Elemente vorgestellt, die jeder Nutzer hasst. Hier zeigen wir Elemente, die auf keiner Website fehlen sollten und die für eine gute UX unerlässlich sind.

User-Experience (UX) kann man mit dem Nutzererlebnis oder der Nutzerfahrung übersetzen, insbesondere im Bereich der digitalen Medien. Ein gutes Nutzererlebnis ist einer der wesentlichen Erfolgsfaktoren für digitale Geschäftsmodelle: Erkundet der User die Website oder Applikation? Verlässt oder löscht er sie? Nutzt er sie regelmäßig oder empfiehlt er sie sogar? Das Nutzererlebnis hängt vor allem vom User-Interface ab (UI). Denn umso einfacher und intuitiver die Anwendung oder Website zu bedienen ist, desto besser ist die UX.

Mit UX-Elementen schlagen wir uns täglich herum, sie sind fester Bestandteil in unserem Alltag. Das muss nicht immer im Internet sein: Das Freizeichen beim Anrufen, das Geräusch beim Versenden einer E-Mail oder der pfeifende Twitter-Vogel, all das sind Rückmeldungen und Bestätigungen an den Anwender.

Natürlich kann man das Ganze auch noch extremer auf die Realität übertragen. Manche Töne sind so selbstverständlich, dass sie uns gar nicht mehr bewusst sind. Wie zum Beispiel das Schließen einer Autotür oder das Geräusch eines vorbeifahrenden Autos. Ein gutes Bespiel sind E-Autos: Besonders blinde Menschen, die auf ihren Gehörsinn angewiesen sind, gehen bei nicht vorhanden Geräuschen zum Beispiel von einer freien Straße aus. Dasselbe lässt sich auf Websites oder Apps übertragen: Bekommt ein Nutzer kein Feedback oder eine Bestätigung über seine Handlung, fühlt er sich verloren oder kann sich nicht identifizieren und verlässt eventuell die Anwendung.

Feedback-Beispiele: So macht ihr’s richtig

Ihr wollt eure Nutzer nicht im Stich lassen? Prima! Dann zeigen wir hier vier Beispiele, mit denen ihr eure Nutzer richtig abholt. Bevor wir zu den Beispielen kommen, wollen wir noch auf zwei wichtige Punkte hinweisen: Erstens, die Implementierung an der richtigen Stelle. Was bringen Fehlermeldungen am Ende eines Formulars? Und zweitens, die emotionale Botschaft: Das Erstellen von Content kann manchmal eine emotionale Achterbahn sein – achtet auf die richtigen Farben, Töne und Wortwahl.

Vor zehn Jahren waren Links und Buttons eindeutig zu erkennen. Sobald etwas blau unterstrichen war, war klar: das ist ein Link – der Link war ein Standartsymbol. Auch Buttons waren eindeutig erkennbar.

Inzwischen haben uns die modernen Webtrends eingeholt und ein Link muss – ein Glück – nicht mehr blau unterstrichen sein. Der Nachteil: Oft sind Links und Buttons nicht mehr als Solche erkennbar. Es fehlen die Effekte! Tut euren Nutzern den Gefallen und markiert einen Link eindeutig – zum Beispiel mit einem Farbkontrast beim Hovern. Und auch Buttons, besonders im Flat-Design, lassen sich mit Farben oder Animationen als solche erkennbar gestalten. Du brauchst Inspiration?

Für den Fall, dass der Upload einer Datei etwas länger dauert, ist eine Progress-Bar der beste Weg dem Anwender den Status zu visualisieren. Je nach Browserunterstützung lassen sich Progress-Bars wunderbar schmücken – zum Beispiel mit Thumbnails.

Ein Preloader gehört zu den typischen Elementen, die ein Website-Nutzer nicht sehen will. Dennoch lassen sie sich nicht immer vermeiden. Wenn das der Fall ist, lasst euch vorher ein bisschen inspirieren und implementiert keinen 08/15-Spinner, der sich einfach nur im Kreis dreht.

Fehlermeldungen gehören nicht zu den UX-Elementen, die sich ein Anwender wünscht. Aber es kann immer mal passieren, dass eine Kreditkarte nicht akzeptiert wird oder ein Upload fehlgeschlagen ist. Für solche Vorgänge sollten Websites vorbereitet sein und nicht einfach eine leere Seite ausgeben.

Um den Nutzer trotz Fehlermeldung nicht zu verlieren, spielen besonders hier die richtigen Worte und Farben eine wichtige Rolle. Hier findet ihr kreative Fehlerseiten, die ihr gesehen haben müsst.

Die meisten Formulare sind gut beschriftet, sodass jeder weiß, wo was eingetragen wird. Auch hier gibt es Ausnahmen: Oft findet man Websites, bei denen die Beschriftung in den Formularfeldern steht. Der Nutzer fängt also an zu schreiben und… Moment, nur die Straße oder auch die Hausnummer? Mist! Alles wieder löschen und nochmal genau lesen, bevor spätestens beim Absenden eine Fehlermeldung ausgegeben wird.

Es gibt ausreichend Möglichkeiten genau solche Schritte zu vermeiden. Die Kennzeichnung kann dabei auch im Formularfeld stehen, sollte aber spätestens beim Tippen an eine andere Stelle rutschen – zum Beispiel über das Feld.

Frustration ist ein echter Killer des guten Benutzererlebnis, und so oft vermeidbar. Das richtige Feedback durch UX-Elemente kann nicht nur dabei helfen, die Konversationsrate nach oben zu bringen, sondern auch das Vertrauen der Kunden zu gewinnen und dazu verhelfen, dass sie sich mehr mit der Marke identifizieren.

In der Galerie findet ihr weitere Beispiele: