Beispiele: Mit und ohne Barrieren

Barrierefreiheit ist ein Qualitätsmerkmal. Barrierefreie Webseiten sind intuitiv, einfach zu nutzen, verlässlich. Der gute Eindruck färbt auch auf deine Produkte oder Services ab. Ohne Barrieren werden mehr Interest:innen auch zu Kund:innen.

Die folgenden Beispiele zeigen, wie sich verschiedene Einschränkungen auf die Webseitennutzung auswirken und wie angenehm barrierefreies Webdesign ist.

Sehkraft

Webseiten vermitteln Information grösstenteils über Text, Bild, Symbol. Die Beispiele zeigen, wie die Auswahl der Farben, Kontraste und Schriften die Nutzung der Website schon bei geringer Beeinträchtigung der Sehkraft bzw. dem Fehlen der Brille erschwert.

Beispieltitel

In diesem Text werden Kontraste nach WCAG-Standard 2.1 AAA für digitale Barrierefreiheit verwendet.

Nicht Barrierefrei

In diesem Text werden Kontraste verwendet, die knapp nicht dem WCAG-Standard und künftigen gesetzlichen Vorgaben entsprechen. Bereits bei geringen Einschränkungen ist die Lesbarkeit erheblich eingeschränkt. 

Lichtverhältnisse

Die Lesbarkeit einer Website hängt neben der Sehkraft auch von den Lichtverhältnissen ab. Die Beispiele zeigen, wie eine optimierte Gestaltung der Website die Lesbarkeit auch bei ungünstigen Lichtverhältnissen – Sonne oder Sonnebrille - ermöglicht.

Barrierefrei

Das ist ein einfacher Text geschrieben mit der Schrift meiner Webseite. So siehst du wie man mit verschieden gradigen die Texte wahrnimmt.

Nicht Barrierefrei

In diesem Text werden Kontraste verwendet, die knapp nicht dem WCAG-Standard und künftigen gesetzlichen Vorgaben entsprechen. Bereits bei geringen Einschränkungen ist die Lesbarkeit erheblich eingeschränkt. 

Vergrösse­rungen

Mit der Grösse von Bildschirm oder Anzeige verändert sich die Darstellung von Texten, Bildern und Symbolen. Die Beispiele zeigen, wie viel einfacher Navigation und Lesbarkeit sind, wenn Buttons, Bilder und Texte im fluiden Webdesign vollständig sichtbar bleiben und sich nicht überlappen.

Nicht Barrierefrei:

Barrierefrei:

Hinweis: Betätige Control (oder Cmd) + Mausscroll um die Anzeige der Website zu vergrössern. Nun kannst du sehen, wie viel einfacher Navigation und Lesbarkeit sind, wenn sich Buttons, Bilder und Texte im fluiden Webdesign nicht überlappen

Macht Sinn, oder?

Dies ist nur eine kleine Auswahl an Beispielen, denn barrierefreie Webseiten entspannen die Nutzung der Webseite in zahlreichen Alltagssituationen. Oft merken wir erst im Real Life, etwa beim Pendeln oder Multitasking, wie wichtig ein durchdachtes und zugängliches Webdesign ist. 

Barrierefreiheit ist also keine Nische, sondern ein Qualitätsmerkmal, das allen Nutzer:innen zugutekommt.

Möchtest du wissen, wie barrierefrei deine Website ist? Nutze meinen kostenlosen Accessibility-Test und erhalte konkrete Verbesserungsvorschläge.