UX Design: Nutzer verstehen, Reibung entfernen

UX beginnt mit der richtigen Frage

Nicht „Wie sieht es aus?“, sondern: Kann jemand in 5 Sekunden verstehen, was Sie anbieten, und den nächsten Schritt finden?

Dafür brauchen Sie wenig Magie, aber klare Arbeit:

1. Zielgruppe: Wer kommt auf die Seite, mit welchem Anliegen?
2. Hauptaktion: Kontakt, Termin, Kauf, Download?
3. Hindernisse: Wo brechen Nutzer ab (Analytics, kurze Interviews)?

Ohne diese Basis optimieren Sie Pixel, nicht Ergebnisse.

Informationsarchitektur: Orientierung

Navigation: Wenige, klare Einträge. Tiefe Hierarchien nur, wenn der Inhalt es erfordert. Breadcrumbs bei verschachtelten Bereichen.

Konsistente Begriffe: „Leistungen“ und „Services“ nicht mischen. Ein Glossar intern hilft Redaktion und Design.

Scanbarkeit: Kurze Absätze, Zwischenüberschriften, Listen. Nutzer scannen zuerst, lesen selten linear.

Für technische Sites: SEO-Struktur und UX müssen zusammenpassen (URLs, H1, interne Links).

Visuelle Hierarchie ohne Lärm

Priorität: Eine Hauptbotschaft pro Screen. CTA sichtbar, aber nicht im Wettbewerb mit zehn gleich lauten Buttons.

Whitespace ist Struktur, kein Leerraum: Das menschliche Sehsystem gruppiert Elemente automatisch nach Nähe (Gestalt-Prinzip der Nähe). Was räumlich zusammensteht, wird als zusammengehörig wahrgenommen, auch ganz ohne Rahmen oder Trennlinie. Fehlt der Abstand, muss das Gehirn diese Gruppierung erst selbst herausrechnen, bevor das eigentliche Verstehen des Inhalts überhaupt beginnen kann, das kostet Zeit und Aufmerksamkeit, die dem Lesen fehlt. Dazu kommt der Isolationseffekt: Ein Element, das von Weißraum umgeben ist, sticht stärker hervor als eines im dichten Umfeld. Ein einzelner, freigestellter CTA-Button wirkt deshalb oft stärker als derselbe Button in einer engen Leiste mit fünf gleichrangigen Links, unabhängig von Farbe oder Größe.

Typografie: Mindestens 16 px Fließtext, ausreichender Zeilenabstand, max. 2-3 Schriftfamilien.

CTAs: konkret statt generisch. „Absenden” sagt nichts über Aufwand oder Ergebnis und wirkt im B2B-Kontext wie das Ende eines Formulars, nicht der Anfang eines Gesprächs. Wer stattdessen Verb, Aufwand und Nutzen benennt, senkt die wahrgenommene Hürde:

Touch-Targets auf Mobile mindestens 44×44 px, unabhängig vom Text.

Usability und Barrierefreiheit

WCAG 2.1 Level AA ist für viele Unternehmen rechtlich relevant und hilft allen Nutzern:

• Farbkontrast prüfen
• Alt-Texte für Bilder
• Tastaturbedienung testen
• Formulare mit Labels und verständlichen Fehlermeldungen

Barrierefreiheit und Web-Sicherheit (sichere Formulare, HTTPS) gehören zusammen.

Performance ist UX

Langsame Seiten fühlen sich kaputt an, egal wie schön das Design ist. Core Web Vitals messen echte Nutzererfahrung (Details im Performance-Artikel).

Wahrgenommene Geschwindigkeit: Skeleton-Loader, progressive Bilder, sofortiges Feedback bei Klicks.

Conversion ohne Dark Patterns

Klare Pfade: Jede Seite sollte wissen, wohin der Nutzer als Nächstes soll.

Reibung reduzieren: Formularfelder streichen, Gast-Checkout, Fortschrittsanzeigen.

Vertrauen: Referenzen, Team, Impressum, Datenschutz, echte Kontaktmöglichkeit. Keine fake Dringlichkeit.

Testen: A/B-Tests brauchen eine Hypothese und genug Traffic, um überhaupt ein belastbares Ergebnis zu liefern. Bei wenigen hundert Besuchern im Monat ist ein Test oft auch nach Wochen nicht signifikant, dann sind moderierte Nutzertests der bessere Hebel. Für Usability-Probleme reichen oft schon fünf Testnutzer:innen mit einer konkreten Aufgabe: Nach der bekannten Faustregel von Jakob Nielsen (Nielsen Norman Group) deckt bereits diese kleine Stichprobe rund 85 % der Usability-Probleme auf, weitere Tester bringen unterproportional wenig zusätzliche Erkenntnis. Das ersetzt keine quantitative Validierung bei großen Redesigns, schlägt aber endlose Pixel-Debatten ohne jeden Nutzerkontakt.

Formulare und B2B-Kontakt

Bei Dienstleister-Websites ist das Kontaktformular oft der wichtigste Conversion-Punkt. Gute UX heißt:

• Pflichtfelder auf das Nötige reduzieren (Name, Kontakt, Anliegen reicht oft)
• Klare Fehlermeldungen direkt am Feld, nicht nur oben in Rot
• Erwartung setzen: „Antwort innerhalb von 24 Stunden“ nur, wenn das stimmt
• Datenschutzhinweis verständlich, nicht nur Checkbox-Pflicht

Telefon und E-Mail sichtbar lassen. Manche Nutzer vertrauen direkten Kontakt mehr als Formularen, besonders bei höheren Auftragswerten.

Grenzen von Formularen: Ein Formular funktioniert gut für klar umrissene Anfragen. Sobald Interessenten variierende Rückfragen haben (Umfang, Zeitrahmen, welches Leistungspaket passt), stößt ein starres Formular an Grenzen: entweder wird es zu lang, oder zu unspezifisch für eine gute erste Einordnung. Hier übernehmen zunehmend Telefon- oder Chat-Agenten die Qualifizierung im Dialog und übergeben strukturiert an das Team, ohne dass Besucher ein zweites Formular ausfüllen müssen. Das ersetzt kein gutes Kontaktformular, sondern ergänzt es für komplexere Anfragen außerhalb der Bürozeiten.

BitAutor-Praxis bei Relaunch-UX

Vor Design starten wir mit drei Fragen: Wer kommt auf die Seite, welche Hauptaktion soll passieren, wo brechen Nutzer heute ab? Daraus entsteht Wireframe und Informationsarchitektur, bevor Farben und Animationen diskutiert werden.

Bei Responsive Design und Performance testen wir Mobile zuerst, weil dort die meisten Erstkontakte entstehen.

Diese Fünf-Nutzer-Tests laufen bei uns am Klickdummy oder Prototyp, nicht erst am fertigen Livesystem: Eine Änderung an der Informationsarchitektur ist vor Build-Start eine Konfigurationsfrage von Stunden, danach ein Entwicklungsauftrag mit Testaufwand.

Für B2B-Seiten gilt: weniger Animation, mehr Klarheit. Nutzer kommen mit einer Aufgabe, nicht für ein Design-Portfolio.

Ein frühes Warnsignal für schlechte UX zeigt sich oft nicht zuerst in Analytics, sondern im Vertrieb: Taucht im Erstgespräch wiederholt dieselbe Rückfrage auf (Preisrahmen, Ablauf, für wen das Angebot passt), obwohl die Website das eigentlich beantworten sollte, ist das meist eine Lücke in der Informationsarchitektur, kein Vertriebsproblem. Ein zweites, oft unterschätztes Signal ist das Protokoll der internen Suchfunktion, falls vorhanden: Suchen Besucher wiederholt nach Inhalten, die über die Hauptnavigation in zwei Klicks erreichbar sein sollten, zeigt das zuverlässiger als jede Heatmap, wo die IA nicht funktioniert.

Bei Relaunch-Projekten dokumentieren wir UX-Entscheidungen kurz im Team: warum diese Navigation, warum dieser CTA. Das spart spätere Diskussionen, wenn jemand eine Entscheidung ohne neue Erkenntnis wieder aufmachen will.

Häufige Fragen zu UX Design

Was ist der häufigste UX-Fehler?

Unklare Navigation und Begriffe, die nicht zur Zielgruppe passen. Nutzer finden das Ziel nicht in wenigen Sekunden.

Brauche ich A/B-Tests von Anfang an?

Nein. Qualitative Tests mit 5 Nutzern und klaren Aufgaben finden oft mehr als endlose Pixel-Debatten.

Ist Barrierefreiheit nur Pflicht-Thema?

Nein. Gute Kontraste, Tastaturbedienung und verständliche Formulare verbessern Usability für alle Nutzer.

Wie hängen UX und Performance zusammen?

Langsame Seiten wirken kaputt, unabhängig vom Design. Core Web Vitals sind Teil der Nutzererfahrung.

Produktseiten

• Leistungen
• Best AI als BitAutor-Plattformprodukt
• Web- und App-Entwicklung