--- title: "ND-freundliches Webdesign: UX für die übersehenen 20 %" lang: de type: knowledge canonical: https://www.arocom.de/wissen/inklusion/nd-freundliches-webdesign alternate: https://www.arocom.de/en/knowledge/inclusion/nd-friendly-webdesign author: "Axel Roth" last_updated: 2026-10-31 --- # ND-freundliches Webdesign: UX für die übersehenen 20 % Rund 15–20 % aller Nutzer sind neurodivergent: ADHS, Autismus-Spektrum, Hochsensibilität oder LRS/Dyskalkulie. Sie sind die am häufigsten übersehene Accessibility-Zielgruppe. ND-freundliches Webdesign ruht auf vier Prinzipien: klare Sprache (B1-Zielniveau, kurze Sätze), reduzierte Reize (kein Auto-Play, Bewegung nur bei Nutzer-Intent), vorhersehbare Navigation (stabile Muster, klare URLs, Breadcrumbs), großzügige Fehler-Toleranz (Undo, Zwischenspeichern, Bestätigung vor irreversiblen Aktionen). Genau diese Muster erfüllen parallel das BFSG auf WCAG-2.1-AA-Mindestniveau. ## ND-freundliches Webdesign, UX für die übersehenen 20 % ## Die übersehene Accessibility-Zielgruppe Wenn Teams über Barrierefreiheit sprechen, denken die meisten an Screenreader, Farbkontraste, Tastatur-Navigation. Das ist richtig und wichtig. Es ist aber nur ein Teil des Bildes. Rund 15–20 % aller Nutzer sind neurodivergent, das heißt, sie verarbeiten Information anders. ADHS, Autismus-Spektrum, Hochsensibilität, LRS und Dyskalkulie gehören dazu ([CDC 2023](https://www.cdc.gov/adhd/data/index.html), [NIH 2024](https://www.ninds.nih.gov/health-information/disorders/autism-spectrum-disorder)). Für diese Nutzer entscheidet nicht der Farbkontrast, sondern der Reiz-Haushalt. Nicht das ARIA-Label, sondern die Satzlänge. Nicht die Tab-Reihenfolge, sondern die Vorhersehbarkeit der Navigation. Der [Neurodivergenz-Selbsttest](https://www.arocom.de/wissen/inklusion/neurodivergenz-test) zeigt, in welchen dieser vier Bereiche ihr selbst Muster erkennt. Dieser Artikel zeigt, was daraus für digitale Produkte folgt. ## Warum ND-Freundlichkeit direkt das BFSG erfüllt Seit Juni 2025 gilt das [Barrierefreiheitsstärkungsgesetz (BFSG)](https://www.arocom.de/barrierefreiheit) für viele Unternehmen im B2C-Bereich. Der Mindeststandard ist [WCAG 2.1 AA](https://www.w3.org/TR/WCAG21/). Drei Erfolgskriterien treffen ND-Nutzer besonders: - **3.1.5 Lesbarkeit** (AAA): verständliche Sprache für Nutzer mit geringerer Lesekompetenz, deckt LRS ab. - **2.2.2 Pausieren, Stoppen, Ausblenden** (A): automatisch bewegte Inhalte pausierbar, deckt HSP und ADHS ab. - **3.2.3 Konsistente Navigation** (AA): gleiche Elemente an gleicher Stelle, deckt Autismus-Spektrum ab. Wer ND-freundlich baut, erfüllt diese Kriterien automatisch. Wer nur WCAG-Checklisten abarbeitet, übersieht oft die ND-Nutzer. ## Vier Prinzipien für ND-freundliche UX ### 01 Klare Sprache Kurze Sätze, aktive Verben, konkrete Substantive. Zielniveau B1–B2 für Hauptnavigation und Fehlertexte. Reduziert Last für LRS-Nutzer, kognitiv erschöpfte Nutzer und alle, die scannen statt lesen. ### 02 Reduzierte Reize Keine Auto-Play-Videos. Keine rotierenden Banner. Keine Notification-Flut. Bewegung nur nach Nutzer-Intent und respektiert `prefers-reduced-motion`. Audio-Kontext niemals überraschend. ### 03 Vorhersehbare Navigation Gleiche Elemente an gleicher Stelle. Keine Scroll-Hijacks, keine Overlay-Pop-ups ohne Nutzer-Trigger. Breadcrumbs, klare URLs und stabile Navigations-Struktur als kognitive Anker. ### 04 Großzügige Fehler-Toleranz Formulare, die mit Tippfehlern und Reihenfolgen umgehen. Undo-Optionen und Zwischenspeichern. Bestätigung vor irreversiblen Aktionen. Klare, hilfreiche Fehler-Texte statt „Ungültige Eingabe". ## Vier konkrete Muster aus unserer Praxis Prinzipien sind abstrakt. Hier sind vier Patterns, die wir in Kundenprojekten umgesetzt haben und die messbar den Unterschied machen. ### Formulare mit Auto-Save und sichtbarem Fortschritt Jeder Feld-Wechsel speichert den Zwischenstand. Nutzer sieht eine dezente „Gespeichert"-Meldung. Browser-Tab schließen oder Netzverbindung verlieren verliert keine Eingaben. ADHS-Nutzer mit Zeitblindheit profitieren am meisten. ### Typografie-Stellschrauben für LRS Mindest-Schriftgröße 18 px, Zeilenhöhe 1,6, max. 75 Zeichen pro Zeile. Optionale „OpenDyslexic"-Schrift per Toggle. Absätze nicht länger als 3–4 Sätze. Senkt Leseanstrengung für LRS-Nutzer um bis zu 40 % ([British Dyslexia Association 2023](https://cdn.bdadyslexia.org.uk/uploads/documents/Advice/style-guide/BDA-Style-Guide-2023.pdf)). ### Reiz-Reduktion als Theme-Option Neben Light- und Dark-Mode einen dritten Modus „Fokus" anbieten: keine Animationen, monochrome Akzente, breitere Abstände, größere Touch-Targets. Ein Klick vom Theme-Toggle aus erreichbar. HSP- und Autismus-Nutzer bleiben länger auf der Seite. ### Vorhersehbare CTA-Positionierung Primärer CTA immer rechts, sekundärer immer links, tertiärer nur als Text-Link. Keine Floating-Buttons, die je nach Scrolltiefe die Position wechseln. Autismus-Nutzer bauen mentale Karten, die zerstört man nicht. ## Wie ihr ND-UX messen könnt Standard-UX-Metriken (Bounce, Time-on-Page, Conversion) reichen nicht. Ergänzt sie durch: **40%** Weniger Lese-Anstrengung mit LRS-Typografie ([British Dyslexia Association, 2023](https://cdn.bdadyslexia.org.uk/uploads/documents/Advice/style-guide/BDA-Style-Guide-2023.pdf)) **15–20%** Nutzer sind neurodivergent (DE/EU) ([CDC, NIH, 2023–2024](https://www.cdc.gov/adhd/data/index.html)) **2,5×** Höhere Abschluss-Rate mit Auto-Save ([Baymard Institute, 2024](https://baymard.com/blog/save-for-later-feature)) Qualitativ helfen Methoden wie **moderierte Sessions mit ND-Nutzern**, etwa über [Fable](https://makeitfable.com/) oder eigene Tester-Pools. Sie zeigen Muster, die keine Heatmap sichtbar macht: etwa den Moment, in dem ein Nutzer aussteigt, weil drei Reize gleichzeitig konkurrieren. ## Wie arocom ND-freundlich baut Wir prüfen in unseren Projekten standardmäßig gegen zwei Ebenen: die WCAG-2.1-AA-Checklist und eine eigene ND-Heuristik. Die Heuristik umfasst unter anderem: - **Reiz-Inventar pro Seite**: wie viele konkurrierende Bewegungen, Farben, Elemente laufen parallel? - **Sprach-Score**: Hemingway-App für Lesbarkeit, Ziel B1–B2 in Navigation und Fehlertexten. - **Reversibilitäts-Check**: welche Aktionen sind irreversibel, welche brauchen Bestätigung? - **Konsistenz-Audit**: treten gleiche Funktionen an unterschiedlichen Stellen unterschiedlich auf? Das Ergebnis fließt in die [Leistung Entwicklung](https://www.arocom.de/leistungen/entwicklung) und in den [Zukunfts-Check](https://www.arocom.de/zukunfts-check) ein. ## Häufige Fragen ### Ist ND-freundliches Design nicht einfach gutes UX für alle? Teilweise. Klare Sprache und vorhersehbare Navigation nutzen allen. Aber bestimmte Entscheidungen, OpenDyslexic als Option, Auto-Save pro Feld, Fokus-Mode, helfen ND-Nutzern spürbar mehr. Neurotypische merken sie nicht, ND-Nutzer spüren den Unterschied zwischen „funktioniert" und „funktioniert nicht". ### Muss ich WCAG 2.2 erfüllen, oder reicht 2.1 AA? Das BFSG fordert [EN 301 549](https://www.etsi.org/deliver/etsi_en/301500_301599/301549/) und damit WCAG 2.1 AA als Mindest-Level. WCAG 2.2 bringt 9 neue Kriterien, die ND-Nutzer zusätzlich adressieren, etwa 3.3.7 „Redundant Entry" (weniger Tipparbeit in Formularen). Wir bauen neue Projekte direkt gegen 2.2. ### Wie weit muss eine Startseite klar-sprachig sein? Hauptnavigation und CTAs: B1–B2. Einleitungs-Texte: B2. Fach-Artikel: B2–C1 erlaubt, solange mindestens eine Zusammenfassung auf B1-Niveau existiert. Der arocom-Redaktions-Workflow prüft Hemingway-Readability für jeden neuen Artikel. ### Müssen wir eine Dyslexie-Schrift anbieten? Nicht zwingend, aber empfehlenswert. Studien sind gemischt ([Wery/Diliberto 2017](https://link.springer.com/article/10.1007/s11881-016-0127-1)), aber: einige LRS-Nutzer schwören darauf, und die Option kostet wenig (Webfont + Toggle). Als Standard-Font eignen sich stattdessen leicht unterscheidbare Sans-Serifen wie Atkinson Hyperlegible, Lexend oder Inter.