7 Tipps für digitale Barrierefreiheit auf deiner Website

Hier erfährst du, wie du das Erlebnis für ALLE Menschen auf deiner Website optimierst.

Was dich digitale Barrierefreiheit kümmern soll?

Vor zehn Jahren hat die Schweiz die UN-Behindertenrechtskonvention unterzeichnet. Diese sieht vor, dass alle Menschen mit und ohne Behinderungen über gleiche Rechte verfügen. Seither ist leider zu wenig für eine tatsächliche Gleichstellung geschehen.

Was dich das kümmern soll? Eine von vier Personen in der Schweiz hat eine Behinderung. Wir müssen eine digitale Welt schaffen, in der sich alle Menschen zurecht finden. Nicht nur aus wirtschaftlicher Sicht – sondern vor allem auch aus moralischer Sicht.

Digitale Barrierefreiheit stellt sicher, dass alle Menschen gleichberechtigten Zugang zu Inhalten haben. Deshalb haben wir für dich sieben Tipps für eine barrierefreie Website. Diese und mehr haben wir in einem Kurs der Stiftung «Zugang für alle» gelernt.

1. Farbkontraste einhalten

Ein ausreichender Farbkontrast ist essenziell, um Texte und Grafiken gut lesbar zu machen. Menschen mit Sehschwächen oder Farbsehstörungen können Inhalte besser erkennen, wenn der Kontrast zwischen Text und Hintergrund hoch ist. Tools wie der WebAIM Contrast Checker helfen dir, die Kontrastverhältnisse zu überprüfen. So stellst du sicher, dass sie den Richtlinien für barrierefreie Webinhalte (WCAG) entsprechen.

Schwarzer Text auf hellgrünem Grund liest sich gut, während schwarzer Text auf blauem Grund ungenügend lesbar ist.

2. Nicht nur farblich, sondern auch formlich unterscheiden

Farben allein sollten nicht das einzige Unterscheidungsmerkmal für Informationen sein. Verwende zusätzlich Formen, Muster oder Texturen, um wichtige Informationen hervorzuheben. So nehmen auch Menschen mit Farbsehstörungen die Unterschiede wahr.

Drei grüne Vierecke und ein violetter Kreis zeigen das gute Beispiel, während drei grüne Vierecke und ein violettes Viereck das schlechte Beispiel darstellen.

3. Bedienbarkeit der Tastatur prüfen

Viele Menschen, insbesondere solche mit motorischen Einschränkungen, navigieren mithilfe der Tastatur durch Websites. Stelle sicher, dass alle interaktiven Elemente wie Links, Buttons und Formulare über die Tastatur bedienbar sind. Teste dies, indem du deine Website nur mit der Tabulatortaste und den Pfeiltasten durchgehst. Alle wichtigen Funktionen sollten ohne Verwendung der Maus zugänglich sein.

4. Überschriften richtig verwenden

Überschriften strukturieren den Inhalt und machen ihn für Nutzer*innen von Screenreadern verständlicher. Verwende die korrekte HTML-Überschriftenhierarchie, beginnend mit <h1> für den Haupttitel und fortlaufend mit <h2>, <h3> usw. Dies hilft nicht nur der Barrierefreiheit, sondern verbessert auch die SEO deiner Website, da Suchmaschinen den strukturierten Inhalt besser verstehen.

Fette Schriftart ist nicht gleich Überschrift. Viele Screenreader erkennen fett markierte Texte nicht als Überschriften.

5. Informative Grafiken mit Alternativtexten ergänzen

Versehe informative Bilder und Grafiken immer mit Alternativtexten (Alt-Tags). So nehmen auch alle, die einen Screenreader benutzen, die Bildinhalte wahr. Sie bieten auch einen Mehrwert für Suchmaschinen, indem sie den Inhalt deiner Bilder besser verstehen und indexieren können. Achte darauf, dass die Alternativtexte präzise und informativ sind.

Digitale Barrierefreiheit für Onlineshops

Eine Studie des Baymard Institute zeigt: 94 % der grössten Onlineshops weltweit sind nicht barrierefrei. So erstellen beispielsweise vier von fünf Onlineshops keine Alternativtexte für ihre Bilder.

 

Dabei sind die Regeln für digitale Barrierefreiheit die selben wie bei allen anderen Websites: Achte darauf, dass Text, Bilder und Grafiken für alle zugänglich sind. Setze unsere Tipps für deinen Onlineshop um. Dadurch übernimmst du eine Vorbildrolle und hebst dich obendrein von deiner Konkurrenz ab.

6. Videos mit Untertiteln erstellen

Untertitel sind unverzichtbar für gehörlose oder schwerhörige Menschen. Sie ermöglichen es, den gesprochenen Inhalt eines Videos zu verstehen. Darüber hinaus sind Untertitel dienlich für alle Nutzer*innen, die Videos in einer lauten Umgebung oder ohne Ton ansehen. Plattformen wie YouTube bieten automatische Untertitel, die du nachbearbeiten und anpassen kannst, um die Genauigkeit zu verbessern.

7. Einfache (oder Leichte) Sprache anwenden

Komplexe Sprache kann für viele Menschen eine Barriere darstellen. Verwende klare und einfache Sprache. So versteht ein breites Publikum deine Inhalte. Dies schliesst Menschen mit kognitiven Behinderungen, Lernschwierigkeiten oder geringer Sprachkenntnis ein. Vermeide Fachbegriffe und lange, verschachtelte Sätze. Auf diese Weise sind deine Texte besser lesbar.

Fazit

Digitale Barrierefreiheit ist in erster Linie unsere moralische Pflicht. Gleichzeitig bietet sie praktische Vorteile. Sie verbessert die Erfahrung für alle Menschen und erhöht das Ranking auf Suchmaschinen. Durch die Umsetzung dieser sieben Tipps wird deine Website zugänglicher und inklusiver. Investiere in die Barrierefreiheit und stelle sicher, dass deine Inhalte für alle zugänglich sind.

 

Selbst, wenn du (wie auch wir) noch nicht alle Tipps umgesetzt hast: Lass uns dranbleiben. So schaffen wir Schritt für Schritt eine inklusive Gesellschaft.

Yannick Waeny

Ameen Mahdi

Ameen ist Growth Marketer und Lead Conversion Copywriting & Storytelling bei Okitah. Erfahre mehr über Ameen und Okitah.