Bitcatcha wird durch Leser unterstützt. Bei einem Kauf über unsere Links verdienen wir möglicherweise eine Provision.

25 wichtige Überprüfungen für Website-UI und -UX

Die Idee hinter UX-Design ist einfach: Glückliche, selbstbewusste Nutzer kaufen eher bei Ihnen. Sie vertrauen Ihnen eher, melden sich für Ihre Mailinglisten an oder laden Ihre App herunter.

Ich betrachte User Experience Design (oder UX-Design) oft eher als Psychologie denn als Entwicklung.

Gutes UX-Design dreht sich komplett darum, in den Kopf Ihrer Besucher zu schlüpfen.

Es geht darum, jeden ihrer Schritte vorauszuahnen und eine Website zu erstellen, die einfach, intuitiv und angenehm zu benutzen ist.

Leider gibt es keine einfache Antwort oder Patentlösung für gutes UX-Design. Es ist die Summe vieler kleiner Anpassungen. Jede einzelne verbessert die Erfahrung auf Ihrer Website.

Mit diesem Gedanken habe ich eine Checkliste mit 25 kleinen (und einfachen) Anpassungen zusammengestellt, die Ihr UX-Design zum Strahlen bringen werden.

1. Geschwindigkeit

Die Geschwindigkeit der Website ist Ihre allererste Chance, einen guten Eindruck zu hinterlassen. Es ist Ihre erste UX-Hürde.

Zu langsam und Ihre Besucher sind bereits genervt und vertrauen Ihnen weniger. Wir verbinden Geschwindigkeit instinktiv mit Professionalität, und die meisten Besucher erwarten, dass Ihre Website innerhalb von zwei Sekunden lädt.

Alles, was langsamer ist, bedeutet von Anfang an eine schlechte Benutzererfahrung.

Stellen Sie sicher, dass Ihre Servergeschwindigkeit angemessen ist, und verringern Sie das Gewicht Ihrer Website, damit sie schnell geöffnet wird. Sehen Sie weitere umsetzbare Tipps zur Verbesserung Ihrer Website-Geschwindigkeit hier.

2. Wer sind Sie und was machen Sie?

Ihre nächste große Herausforderung besteht darin, Ihre Besucher schnell zu informieren. Wer sind Sie? Was machen Sie? Und welchen Mehrwert können Sie ihnen bieten?

netflix value

Dies wird als Wertversprechen bezeichnet, und es ist so wichtig, dass wir einen ganzen Blogbeitrag darüber geschrieben haben. Sie haben nur wenige Sekunden Zeit, um Ihre Besucher zu überzeugen, also machen Sie es zählbar!

Versuchen Sie es jetzt: fassen Sie Ihre gesamte Website in einem Satz zusammen und weisen Sie darauf hin, wohin Besucher als Nächstes gehen sollen.

3. Stellen Sie sicher, dass Besucher mit Ihnen in Kontakt treten können

Ein wesentlicher Teil des UX-Designs besteht darin, alle Sorgen oder Ängste Ihrer Besucher zu beseitigen.

Eine der größten Sorgen für neue Besucher ist, ob sie Ihnen vertrauen sollten oder nicht – besonders wenn Sie eine neue Website sind.

Eine Möglichkeit, diese Angst zu beseitigen, besteht darin, ihnen zu zeigen, dass hinter den Kulissen eine echte Person steht. Fügen Sie eine Geschäftsadresse, eine Telefonnummer und eine echte E-Mail-Adresse hinzu. (KEIN Kontaktformular – Menschen misstrauen diesen tendenziell im Vergleich zu einer direkten E-Mail-Adresse).

Noch besser: Verwenden Sie einen Live-Chat, damit Benutzer sofort Fragen stellen können.

tagove live chat

Wenn etwas schief geht, ist es gut zu wissen, dass sie leicht Kontakt aufnehmen können.

4. Geben Sie Besuchern immer einen Weg zurück zur Startseite

Wir alle haben uns schon einmal auf Websites verirrt. Sie folgen Links und landen am Ende in einem Kaninchenbau.

Wenn dies passiert, werden Ihre Besucher unruhig und frustriert. Sie drücken instinktiv auf die „X“-Schaltfläche, um den Browser zu schließen.

Stellen Sie stattdessen sicher, dass es eine klare und definierte ‚Home‘-Schaltfläche gibt, damit sie immer von vorne beginnen können. Typischerweise erwarten Benutzer auch, dass Ihr Logo zurück zur Startseite verlinkt, also stellen Sie sicher, dass es das tut.

5. Noch besser, hinterlassen Sie Brotkrümel, damit sie wissen, wo sie sind

Neben einem schnellen Neustart können Sie ‚Breadcrumbs‘ verwenden, um zu erklären, wo sie sich im Prozess befinden.

Große Fortschrittsbalken sind dafür hervorragend geeignet. Wenn es beispielsweise während des Bezahlvorgangs ist, lassen Sie Ihren Benutzer genau wissen, wo er sich befindet und was noch zu tun ist.

checkout progress bar

Auch hier handelt es sich um einfache Psychologie. Ein Spaziergang ist zum Beispiel viel anstrengender, wenn man nicht weiß, wo das Ende ist. Wir fühlen uns viel wohler, wenn wir eine Karte haben. Die gleiche Idee gilt auch online.

6. Entfernen Sie alle sich wiederholenden Aktionen

Es ist super frustrierend, die gleichen Daten zweimal in ein Formular einzugeben (wie eine Rechnungsadresse und eine Lieferadresse). Versuchen Sie, alle sich wiederholenden Aktionen zu beseitigen, die den Kaufprozess verlangsamen.

Es sind Dinge wie diese, die zum Warenkorbabbruch führen. Ihre Besucher werden anderswo suchen.

Noch besser: Erstellen Sie ein System, das die Präferenzen Ihrer Kunden speichert. Es wird sie überraschen und erfreuen, wenn alles wieder auf sie wartet. Es ist eine einfache Sache, die die Chancen auf Stammkunden verbessert.

7. Verwenden Sie Tooltips, um Neulingen zu helfen (aber behindern Sie nicht die Experten!)

Einige Ihrer Besucher werden Stammgäste sein. Sie werden durch Ihre Anmeldebögen und den Kaufprozess rasen. Andere werden ganz neu sein und könnten unterwegs einige Fragen haben.

Kleine ‚Tooltip‘-Symbole (oft mit einem Fragezeichen gekennzeichnet) helfen den Neulingen zu verstehen, was sie tun müssen. Aber gleichzeitig stehen sie Ihren Experten nicht im Weg.

Sie können sogar Abkürzungen oder Schnellwege anbieten, um die Experten zu beschleunigen. Sie sehen zum Beispiel oft „Überspringen“-Links auf den meisten Website- und App-Erklärungen.

8. Erstellen Sie einen großen, auffälligen Call-to-Action

Ein Call-to-Action sagt Ihrem Besucher genau, was zu tun ist: zum Beispiel ‚Anmelden‘ oder ‚Jetzt kaufen‘. Stellen Sie sicher, dass er bestimmend, unkompliziert ist und den Wert der Aktion erklärt.

big bold cta

Noch besser: Machen Sie ihn in einer klaren, kräftigen Farbe (Grün und Orange wirken hier Wunder) und umgeben Sie ihn mit Weißraum. Das sollte das Auge Ihrer Benutzer direkt darauf lenken und ihnen einen klaren Hinweis geben, dass dies ist, was Sie möchten, dass sie tun.

9. Machen Sie einen klaren Unterschied zwischen primären und sekundären Calls-to-Action

Bei vielen Calls-to-Action werden Sie zwei Optionen sehen. Zum Beispiel ‚Absenden‘ und ‚Abbrechen‘. Oder ‚Jetzt herunterladen‘ und ‚Kostenlose Testversion‘.

primary secondary cta

Es ist klar, welche Aktion Sie vom Besucher erwarten, also stellen Sie sicher, dass sie es wissen. Schauen Sie sich Spotifys Homepage an. Sie haben die Schaltfläche ‚Premium werden‘ fett und auffällig gemacht. Sie haben die Schaltfläche ‚Kostenlos spielen‘ im Hintergrund verblassen lassen.

Dies ist wieder einfache Psychologie. Sie zeigen Ihren Benutzern subtil, worauf sie klicken sollen.

10. Verwenden Sie Hierarchie, um Benutzern zu zeigen, wohin sie als Nächstes gehen sollen

Hoffentlich haben Sie eine klare ‚Benutzerreise‘ im Sinn. Nehmen wir an, Sie unterrichten Online-Kurse über Ihre Website. Eine einfache Benutzerreise könnte so aussehen:

Neuesten Blog lesen > kostenlosen Bericht herunterladen und für die Mailingliste anmelden > in Ihren bezahlten Online-Kurs einschreiben.

Wenn Sie eine klare Reise haben, können Sie eine visuelle Hierarchie erstellen, um Benutzer dorthin zu leiten, wo Sie sie haben möchten. In diesem Fall würden Sie sicherstellen, dass Ihr Blog das Erste ist, was sie sehen. Dann beginnen Sie, viele Links zu Ihrer Mailingliste einzufügen.

11. Spielen Sie nicht mit erwarteten Elementen herum!

Es ist oft schwer, dem Drang zu widerstehen, bei Layouts und Elementen kreativ zu werden. Aber die Sache ist, wir alle wissen, wie ein Online-Shop aussehen sollte. Wir erwarten, dass Produkte in einfachen Kategorien angeordnet sind. Wir erwarten Produktbeschreibungen, Bewertungen und einen vertrauten Kaufprozess.

familiar checkout

Versuchen Sie nicht, bei diesen entscheidenden Aspekten das Rad neu zu erfinden! Halten Sie es einfach.

12. Halten Sie sich an eine einfache 3-Farben-Palette

Auch hier geht es darum, dem Drang zu widerstehen, die Dinge zu verkomplizieren. Die Kombination von mehr als 3 Primärfarben ist schwierig und wird Ihre Benutzer oft verwirren.

simple colot palette

Farbe ist auch sehr nützlich bei der Gestaltung der Benutzererfahrung, da sie eng mit Psychologie und Emotion verbunden ist. Zum Beispiel verbinden wir Blau mit Vertrauen (es gibt einen Grund, warum Facebook Blau verwendet!)

Passen Sie Ihre Farbpalette an Ihr Produkt an.

13. Warum bekomme ich einen Fehler? Und was mache ich jetzt?

Manchmal gehen Dinge schief, und 404-Fehler sind unvermeidlich. Sie können dies jedoch tatsächlich in eine positive Benutzererfahrung verwandeln.

Erklären Sie genau, warum sie diesen Fehler erhalten, indem Sie benutzerdefinierte 404- und 504-Seiten erstellen. Twitters ‚Fail Whale‘ war dafür berühmt.

custom error page twitter fail whale

Bei unbekannten Fehlern beruhigen Sie die Benutzer, dass Sie daran arbeiten, und leiten Sie sie zurück zu Ihrer Website.

Sackgassen, wie Fehlerseiten, sind gefährlich. Benutzer greifen natürlich zum Kreuz. Beruhigen Sie sie und schicken Sie sie zurück.

14. Geben Sie Benutzern ein High-Five, wenn sie etwas abschließen

Menschen werden von einem Gefühl der Leistung und Vollendung angetrieben. Wenn sie eine Aufgabe abschließen, lassen Sie es sie wissen und zeigen Sie ihnen, wohin sie als Nächstes gehen sollen.

Sie können dies tun, nachdem sie ihre E-Mail-Adresse eingereicht haben, nachdem sie ein Produkt gekauft haben, nachdem sie etwas in ihren Warenkorb gelegt haben oder einfach, wenn sie das Ende eines Blogbeitrags erreicht haben.

Es ist eine einfache, leichte, positive Erfahrung. Es gibt Benutzern auch ein Gefühl der Zusammenarbeit; als ob Sie ihnen tatsächlich helfen, ihre Ziele zu erreichen.

15. Beschränken Sie sich auf nur zwei Schriftfamilien

Konsistenz und Branding sind der Schlüssel zu einer guten Benutzererfahrung.

Es ist sehr verwirrend, wenn Ihre Logo-Schrift Futura ist, Ihr Textkörper Times New Roman, Ihr Call-to-Action Comic Sans und Ihre Überschriften Windings sind…

excess fonts families

Beschränken Sie sich auf nur zwei Schriftfamilien. Es ist leichter zu lesen und sieht professioneller und vertrauenswürdiger aus. Sehen Sie die besten Website-Schriften, die zu Ihrer Marke passen.

16. Verwenden Sie eindeutige und konsistente Warnmeldungen

Manchmal werden Ihre Benutzer Fehler machen. Vielleicht haben sie ihr Passwort falsch eingegeben und konnten sich nicht anmelden. Vielleicht haben sie vergessen, eine Postleitzahl auf dem Anmeldeformular anzugeben.

distinct alerts

In diesen Fällen benötigen Sie eine einfache, aber eindeutige Fehler- oder Warnmeldung. Stellen Sie sicher, dass sie sich in Farbe und Stil von allem anderen auf Ihrer Website unterscheidet. Es gibt einen klaren Hinweis darauf, dass etwas Handlung erfordert.

Sie sollten diese Warnmeldungen auch auf Ihrer gesamten Website konsistent gestalten. Verwenden Sie nicht unterschiedliche Farben, Stile oder Platzierungen, da dies nur verwirrend wird.

17. BEGRENZEN SIE GROSSBUCHSTABEN-TEXT

Es ist einfach nervig.

Tatsächlich gibt es wichtigere Gründe als das. Wir lesen Großbuchstaben-Text tatsächlich langsamer als Kleinbuchstaben. Es ist also viel schwieriger, schnell zu lesen (was die Art und Weise ist, wie wir im Allgemeinen das Internet lesen).

Reservieren Sie Großbuchstaben für den Fall, dass Sie wirklich einen Eindruck hinterlassen müssen.

18. Gruppieren Sie zusammengehörige Elemente

Dies gilt speziell für E-Commerce-Websites, funktioniert aber überall.

Versuchen Sie, ähnliche und verwandte Elemente am selben Ort zu halten. Das bedeutet, dass Ihre Besucher und Kunden einen viel maßgeschneiderteren Service erhalten, fast so, als hätten Sie ihre Bedürfnisse vorausgesehen.

Sie können dies mit physischen Produkten tun, wie bei Amazons „Mehr wie dieses“-Auswahl. Sie können auch etwas Ähnliches mit Blogbeiträgen und Artikeln tun, indem Sie einen Bereich für verwandte Inhalte verwenden.

Es hält Besucher auf Ihrer Website am Browsen, reduziert Ihre Absprungrate und schafft eine persönlichere Erfahrung.

19. Halten Sie alles konsistent

Das Letzte, was Sie wollen, ist, dass ein Besucher auf einen Link klickt und das Gefühl hat, zu einer anderen Website navigiert zu sein.

Stellen Sie sicher, dass Ihre Navigationsleiste an derselben Stelle bleibt, egal wo Sie sich auf der Website befinden. Stellen Sie sicher, dass Ihr Logo immer sichtbar ist und die Farbpalette gleich bleibt.

20. Gestalten Sie das Layout für das Überfliegen mit den Augen

Wir lesen Websites nicht wie ein Buch. Unsere Augen springen und scannen nach den wichtigen Informationen.

f pattern scan

Typischerweise lesen wir Websites in einer F-Form, aber kühne Bilder und Calls-to-Action sind auch dafür bekannt, zuerst das Auge zu fangen. Schauen Sie sich unbedingt die beliebten Website-Layouts an, die Sie für Ihre Website verwenden können.

21. Bauen Sie Vertrauen mit Testimonials und sozialen Beweisen auf

Die meisten Besucher Ihrer Website kommen mit erhobener Wachsamkeit an. Sie sind natürlich vorsichtig gegenüber neuen Websites und sicherlich noch nicht bereit, bei Ihnen zu kaufen.

Wie ich bereits sagte, besteht ein Hauptteil des UX-Designs darin, diese Barrieren zu beseitigen und Menschen auf Ihrer Website wohl zu fühlen. Einige gut platzierte Testimonials und soziale Beweise werden die Menschen beruhigen. Wir sehen gerne, dass andere Menschen (idealerweise große Namen) Ihr Produkt und Ihren Service genutzt haben und es gutheißen.

22. Lassen Sie Benutzer wissen, womit sie interagieren können!

Websites bestehen typischerweise aus zwei Teilen: Erstens: Inhalt – er ist statisch und wir können nicht damit interagieren. Und zweitens: Kontrollen – dies sind Dinge, auf die wir klicken, mit denen wir spielen und interagieren können.

interaction button

Twitter ist darin großartig. Einfacher schwarzer Text für Inhalte. Blauer Text zeigt an, worauf Sie klicken und womit Sie interagieren können. Symbole füllen sich mit Farbe, wenn Sie mit der Maus darüber fahren, um zu zeigen, womit Sie spielen können.

Laden Sie Menschen ein, mit Ihrer Website zu spielen!

23. Schaffen Sie eine sanfte Lernkurve

Niemand bleibt gerne auf einer verwirrenden und schwierigen Website stecken.

Versuchen Sie, Ihren Besuchern fast sofort einen schnellen Erfolg zu geben. Erleichtern Sie ihnen den Einstieg und machen Sie es einfach – besonders wenn Sie ein kniffliges Geschäftsangebot machen.

24. Finden Sie einen Weg, schnell mit Ihrem Besucher zu sympathisieren

User Experience dreht sich alles darum, eine menschliche Beziehung nachzuahmen und eine Verbindung mit Ihrem Benutzer herzustellen. Empathie ist ein großer Teil davon – Was sind die Ziele und Träume Ihrer Besucher? Was hat sie bisher zurückgehalten?

Lassen Sie sie sofort wissen, dass Sie ihr Problem verstehen. Sie können dies mit einem Bild tun, mit dem sie sich identifizieren können, oder einem Satz, der ihre größten Probleme zusammenfasst.

Ihr Besucher wird denken: ‚Diese Website versteht mich!‘ was eine großartige Benutzererfahrung ist, die man schaffen kann.

25. Nutzen Sie Mikrointeraktionen, um einen Dialog zu schaffen

Versuchen Sie, Ihrem Benutzer bei jedem kleinen Teil der Reise Feedback zu geben. Es wird eine echte Kommunikation und Beziehung schaffen, auf die Benutzer reagieren.

Sie können dies mit Texten tun, wie „Gut gemacht!“ „Wir dachten, das könnte Ihnen gefallen“, „Möchten Sie mit einem Experten sprechen?“

Oder kleine Grafiken und Visualisierungen, wie ein Daumen hoch, ein Smiley oder eine tickende Uhr auf einer Ladeseite.

———

Kombinieren Sie diese kleinen Anpassungen und Sie werden eine Benutzererfahrung schaffen, die Vertrauen aufbaut, mit Ihrer Zielgruppe in Verbindung tritt und sie glücklich und mit einem Gefühl der Leistung zurücklässt.Verwenden Sie irgendwelche dieser UX-Design-Tricks bei der Verwaltung Ihrer Website? Ich würde gerne von allen hören, die ich vergessen habe! Lassen Sie es mich im Kommentarbereich wissen.

(Zurück zum seitenanfang)

Umfassender Leitfaden zur Verwaltung von Websites

Entdecken Sie Ressourcen zur effektiven Verwaltung Ihrer Website, die Themen wie Website-Backups, Geschwindigkeitsoptimierung, WordPress, Inhalte und Sicherheit abdecken.