Nutzerzentriertes Design & Optimierung

UX vs. UI

User-Erlebnis (User experience (UX))

Das User-Erlebnis (UX) bezeichnet das Nutzungserlebnis, welches aus dem Gebrauch und/oder voraussichtlichem Gebrauch eines Produkts, Systems oder einer Dienstleistung resultiert. Es spiegelt Erfahrungen sowie auch Empfindungen und Gefühle einer Person während der Benutzung eines Produkts, Systems oder einer Dienstleistung wieder.

Das Klicken auf eine Seite oder das Ausfüllen eines Formulars gehört alles zum User-Erlebnis dazu.

Benutzeroberfläche (User interface (UI))

Die Benutzeroberfläche (UI) ist die Plattform, auf welcher der User mit der Website interagiert. Dies umfasst interaktive Elemente wie anklickbare Links, Formulare und weitere Aktionen, welche der User auf der Website ausführen kann.

Unterschiede zwischen UX and UI

UX - das Erlebnis UI - das Medium

  • Interaktionsdesign: Was sich User anschauen, was sie lesen und anklicken

  • Basiert auf Daten, Emotions- & User-Forschung

  • Drahtgittermodell, Sitemap & Personas

  • Visuelles Design: Medium durch welches dies geschieht (z.B. Video-Player, Infografik etc.)

  • Basiert auf Userdaten-Feedback, Design-Trends & Marken-Richtlinien

  • Farben, Typografie & Layout > wie die Website aussieht

UX- und UI-Prinzipien

Die Vorteile von UX und UI:

  • Mehr Traffic auf Ihre Website

  • Stärkere Kundenbindung

  • Verlängerte verbrachte Zeit auf der Website

  • Fördert eine emotionale Bindung: Je mehr man als potenzieller Kunde auf Ihrer Website über Sie und Ihr Unternehmen erfahren kann, desto persönlicher die Bindung und desto mehr steigt das Vertrauen in Ihre Marke/Produkte

  • Mehr Konversionen

  • Höhere Rückkehrraten

Die 5 wichtigsten UX- & UI-Prinzipien:

Zugänglichkeit

Ihre Website sollte optimalerweise für jeden User gut zugänglich sein, auch für Personen mit visuellen oder motorischen Beeinträchtigungen.

Klarheit

Die Texte auf jeder Seite sollten klar verständlich sein, die Navigation möglichst einfach, die Botschaft unmissverständlich. Diese sollte sich wie ein roter Faden durch Ihre Website ziehen, der die User auf Ihrem Weg durch Ihre Website begleitet.

Lernförderlichkeit

Bieten Sie Ihren Lesern wertvolle Informationen an und bringen Sie ihnen etwas aus Ihrer Branche bei. Dies ist oftmals genauso wichtig als etwas zu verkaufen, weil Sie den Usern damit zeigen, dass Sie ein Experte in Ihrer Branche sind und sie Ihnen vertrauen können.

Glaubwürdigkeit

Je glaubwürdiger Ihre Website ist, als desto glaubwürdiger wird Ihre Marke empfunden.

Relevanz

Die Website soll nicht zu off-topic abdriften.

UX erfassen

Was sollte in Hinblick auf das User-Erlebnis (UX) getestet werden?

User-Absicht

E-Commerce Website: Suchen die User nach einem spezifischen Produkt?

Es ist hilfreich, die User und Kunden zu fragen, was sie möchten, wonach sie suchen und was sie von Ihrer Website erwarten. Nehmen Sie nicht einfach an, dass Sie wissen, was die User möchten.

Reibungspunkte

Wenn Sie z.B. in Google Analytics eine hohe Absprungrate auf einer bestimmten Seite Ihrer Website sehen, ist diese Seite ein Reibungspunkt. Dies könnte beispielsweise ein langwieriger Online-Shopping-Prozess sein, welcher zu umfangreich und/oder wenig intuitiv ist. Führen Sie A/B-Tests durch, um herauszufinden, was sich am besten bewährt.

Einfluss des Webdesigns auf das User-Erlebnis (UX)

Das Layout und beliebte Trends haben Einfluss auf das User-Erlebnis.

Navigation

In Google Analytics können Sie sehen, wie User durch Ihre Website navigieren und auf welchen Seiten sie die Website verlassen.

Beispiele eines schlechten Webdesigns:

  • Kein Navigationsmenü

  • Text schwer lesbar (z.B. durch eine kleine Schriftgrösse oder einen geringen Kontrast zwischen der Text- und Hintergrundfarbe)

  • Keine Vorteile für den User aufgeführt (User springen auf Adjektive wie “preiswert”, “preisgekrönt”, “qualitätsgeprüft” etc. an → benutzen Sie diese)

  • Kein oder schlechtes CTA (z.B. ein riesiger Facebook-Button → die User sollen Ihre Website nicht schnell wieder verlassen, wenn sie nur auf Ihrer Website etwas kaufen können)

  • Nicht modern

  • Nicht Mobile-freundlich

UX verbessern

Die Vorteile einer geeigneten Website-Navigation:

  • Führt zu mehr Klicks und Traffic

  • Verlängert die verbrachte Zeit auf der Website und senkt die Absprungrate

  • Erleichtert es Suchmaschinen, die Website zu crawlen

Die Vorteile eines Responsive Designs:

  • Viel besseres User-Erlebnis auf Mobilgeräten (man muss z.B. nicht viel scrollen)

  • Höheres Ranking auf den Suchergebnisseiten

  • Das Design macht auf verschiedenen Geräten einen guten Eindruck, nicht nur auf dem Desktop

Die User-Erwartungen und Absichten können je nach Gerät variieren. Wonach User auf Mobilgeräten suchen, kann unterschiedlich sein zu dem, wonach sie auf dem Laptop suchen. Beispielsweise sind sie auf Mobilgeräten unterwegs, in Eile und rufen an anstatt eine lange E-Mail zu schreiben, wohingegen sie sich auf dem Desktop mehr Zeit nehmen können und ihre Suche gründlicher gestalten.

Das perfekte CTA erstellen:

  • Verwenden Sie Aktionswörter (z.B. “Jetzt kaufen”, “Jetzt buchen” etc.)

  • Vermitteln Sie ein Gefühl der Dringlichkeit und Knappheit (z.B. mit einem Countdown: “Dieses Angebot ist noch 12 Stunden lang verfügbar”)

  • Minimieren Sie das Risiko

  • Fokussieren Sie sich auf den Wert

  • Unterbreiten Sie den Usern ein exklusives Angebot (z.B. in Ihrem Newsletter), was nicht jeder bekommt, sodass sie sich besonders fühlen

  • Werden Sie persönlich (Warum ist das Angebot nützlich für den User?)

  • Fördern Sie Neugierde

  • Liefern Sie Vorteile und soziale Beweise (fügen Sie dazu beispielsweise Reviews auf Social Media in Ihre Website ein)

Das richtige CTA für Ihre Zielgruppe wählen:

  • Testen Sie verschiedene Formulierungen, Feature-Boxen und Angebote für Ihre Zielgruppe

  • Richten Sie das User-Erlebnis auf Ihre spezifische Zielgruppe aus (z.B. jüngere vs. ältere Zielgruppe)

Website optimieren

Ladegeschwindigkeit:

  • Die Ladegeschwindigkeit ist ein SEO-Rankingfaktor.

  • Besonders wichtig auf Mobilgeräten, da die Aufmerksamkeitsspanne resp. Geduld auf Mobilgeräten kürzer ist. Mobile-User werden die Seite mit einer grösseren Wahrscheinlichkeit verlassen, wenn das Laden länger als 3 Sekunden dauert.

  • Eine langsame Ladegeschwindigkeit ist ein Indikator für weitere Probleme mit der Website (z.B. sehr grosse Bilder, Plugins, die nicht richtig geladen werden etc.)

Wie wirken sich das Hosting & Webdesign auf die Ladegeschwindigkeit aus?

Hosting-Anbieter

Die Ladegeschwindigkeit verschiedener Hosting-Anbieter unterscheiden sich durch die Kapazität, die Qualität des Servers und durch das Team und die Expertise dessen.

Gehostete Dateien / Code

Wenn Du Inhalte von Word oder Google Docs in den Wordpress-Editor kopierst, kann das die Geschwindigkeit beeinträchtigen, da dies zusätzlichen Code generiert. Es ist besser, direkt ins CMS zu schreiben, anstatt Texte zu kopieren, da man auf diesem Weg unnötigen Code im Back-end verhindert. Denn je länger der Code ist, desto länger dauert die Ladegeschwindigkeit einer Webseite.

Website-Elemente

Interaktive Elemente können eine Webseite auch verlangsamen. Wenn solche Elemente nicht unmittelbar zur Konversion eines Users führen, sind sie nicht zielführend und sollten nach Möglichkeit vermieden werden. Dies sind z.B. Slide-Shows, Widgets, Animationen, GIFs…

Bilder

Verkleinere Bilder immer so klein wie es die Bildqualität noch erlaubt. Wenn die Breite der Webseite 700 Pixel ist, sollten die Bilder diesen Wert nicht übertreten.

Elemente, die nicht korrekt geladen werden, können darauf Einfluss haben, welche Informationen den Usern gezeigt werden. Ist z.B. ein Navigations-Plugin defekt oder veraltet ist und auf Codes basiert, die heutzutage nicht mehr in Gebrauch sind,kann es passieren, dass die gesamte Navigation nicht mehr sichtbar ist.

Zusammenfassung:

  • UX steht für User-Erlebnis (user experience) und entspricht dem Erlebnis durch UI (user interface) resp. der Benutzeroberfläche, auf welcher die User mit der Website interagieren.

  • UX & UI können den Traffic, Verkäufe, die verbrachte Zeit auf der Website und die Rückkehrrate erhöhen.

  • Zu den UX- und UI-Prinzipien gehören die Zugänglichkeit, Klarheit, Lernförderlichkeit, Glaubwürdigkeit und Sachbezogenheit/Relevanz.

  • Vergewissern Sie sich bei der Beurteilung des User-Erlebnisses, dass Sie die User-Absicht, Reibungspunkte, das Webdesign und die Navigation testen, um herauszufinden, was den Usern am besten gefällt.

  • Verbessern Sie das User-Erlebnis durch eine verbesserte Website-Navigation, ein Responsive Design, verbesserte CTAs und UX, welches auf Ihre Zielgruppe ausgerichtet ist.

  • Die Ladegeschwindigkeit ist ein SEO-Rankingfaktor und kann auf andere Website-Fehler hindeuten, welche zu einem schlechten User-Erlebnis führen können.