Im Bauwesen machen Arbeiter*innen Treppen zugänglich oder bauen Rampen. Bei digitaler Barrierefreiheit geht es weniger handfest, dafür mit mehr Fingerspitzengefühl zu. Entwickler*innen, Designer*innen oder Texter*innen beseitigen Barrieren mit Tastatur und Maus. Es braucht nur ein paar Codezeilen, ein smartes Design und Redakteur*innen, die ein paar einfache CMS-Regeln beachten. Wie bei einer Treppe vor dem Rathaus geht es bei digitaler Barrierefreiheit darum, allen den Zugang zu ermöglichen. Wie das klappt, erfährst du hier.

Grundlagen kurz erklärt: Was musst du über BFSG & Barrierefreiheit wissen?

Die Grundlagen der digitalen Barrierefreiheit und das kommende Barrierefreiheitsstärkungsgesetz (BFSG) haben wir in unserem Artikel Barrierefreiheit. Voraussetzung. Nicht Feature. bereits ausführlich beschrieben. Die wichtigsten Grundlagen zusammengefasst:

  • Barrierefreiheit bedeutet Zugänglichkeit ohne fremde Hilfe: Digitale Angebote sollten so gestaltet sein, dass sie ohne besondere Erschwernis und grundsätzlich ohne fremde Hilfe nutzbar sind.
  • Barrierefreiheit ist für alle von Vorteil: Etwa 30 % der Bevölkerung sind auf barrierefreie Angebote angewiesen, aber 100 % profitieren davon.
  • Das BFSG macht digitale Barrierefreiheit zur Pflicht für viele privatwirtschaftliche Unternehmen: Ab dem 28. Juni 2025 müssen Unternehmen, die digitale Produkte oder Dienstleistungen für Verbraucher anbieten, diese barrierefrei gestalten. Barrierefreiheit bedeutet Zugänglichkeit ohne fremde Hilfe: Digitale Angebote sollten so gestaltet sein, dass sie ohne besondere Erschwernis und grundsätzlich ohne fremde Hilfe nutzbar sind.  
  • Barrierefreiheit bedeutet inklusive Gestaltung von Anfang an: Digitale Angebote sollten von Beginn an barrierefrei konzipiert werden, statt Barrieren erst nachträglich zu beseitigen.
  • Mehrkanalige Zugänglichkeit ist entscheidend: Digitale Inhalte sollten über mehr als einen Sinneskanal zugänglich sein, um verschiedene Nutzerbedürfnisse zu berücksichtigen.

Wenn du schon Beratung hattest, erfüllt deine Website vielleicht schon viele Barrierefreiheitsstandards. Für alle anderen gilt die oben genannte Frist. Gute Nachricht: Viele Anpassungen kannst du selbst mit einem CMS wie TYPO3 machen. Tipps dazu gibt's im Abschnitt "Content optimieren". Für Design- und Technik-Anpassungen brauchst du oft Profis aus den hiesigen Agenturen. Noch eine gute Nachricht: Barrierefreiheitsanpassungen kosten oft weniger als gedacht, je nach Website-Umfang. Mit 2.000 € bis 10.000 € kannst du deine Website längerfristig fit machen. Folgekosten können zwar immer entstehen, da sich Gesetze ändern, aber die sind meist deutlich günstiger als die Anfangskosten. Bei neuen Websites ist Barrierefreiheit generell günstiger, da die Seite "from scratch" barrierefrei konzipiert werden kann.

Schneller Website-Check: Wie barrierefrei ist deine Website aktuell

Du kannst die Barrierefreiheit deiner Website mit etwas technischem Know-how selbst checken. Es gibt viele Tools, die wir getestet haben. Besonders gut ist "Silktide" [Verlinkung: de.silktide.com/loesungen/web-barrierefreiheit/], das auf verschiedene WCAG-Konformitätslevel vom W3C prüft. Es ist kostenlos und kann in Chrome integriert werden. Neben Silktide gibt es auch andere kostenfreie und kostenpflichtige Tools, die einen schnellen Überblick über die digitale Barrierefreiheit im Rahmen des Barrierefreiheitstärkungsgesetzes geben. Etwa Wave Accessibility oder Lighthouse. Unsere Digitalberater*innen bieten gerne eine unverbindliche und kostengünstige Vorprüfung an. Dabei zeigen wir dir den aktuellen Stand und schließen bei Beauftragung die größten Lücken oft günstiger als externe Prüfstellen.

Technische Tools sind nützlich, aber auch ein simpler User-Test hilft. Lass ihn intern durchführen. Nutzer*innen, auch ohne Behinderungen, entdecken leicht offensichtliche Probleme durch einfache Navigation. Sie stoßen zum Beispiel auf eine oder mehrere der folgenden Hürden:

  • Texte lassen sich durch unzureichende Kontraste der Hintergrundfarben nur schwer lesen. Das Lesen von Texten dauert länger und ist fehleranfälliger. 
  • Bei besonders komplexen Menüs mit vielen Unterseiten fällt die Auswahl der wichtigsten Links häufig schwer. Wer mehr statt weniger Menüpunkte unterbringt, überfordert schnell seine Nutzer*innen und schafft frustrierende Situationen bei der Navigation der Website.
  • Folgen Überschriften und Inhalte nicht logisch aufeinander, können Nutzer*innen dem Gedankengang der verfassenden Person schlechter folgen. Die Folge: Missverständnisse, Frust, Verlassen der Website. 

Wenn Barrierefreiheit fehlt, nervt das alle Nutzer*innen und macht Inhalte schwer zugänglich. Das führt schnell zum Absprung. Digitale Barrierefreiheit ist wichtig, um Menschen mit Behinderungen Teilhabe zu ermöglichen, und sie hilft jedem. Um dich und dein Unternehmen für das BFSG fit zu machen, haben wir eine Checkliste mit typischen Website-Barrieren und Lösungen erstellt.

Content optimieren: Wie machst du Texte und Inhalte barrierefrei?

Klar und verständlich schreiben, damit alle Nutzer*innen dich verstehen

Einfache Sprache ist einfach. Verwende leicht zu verstehende Worte. Und kurze Sätze mit einfachem Satzbau. Beginne neue Sätze in einer neuen Zeile. Spare dir, wo immer möglich, Fremdwörter und Abkürzungen. Denn was dir die Arbeit leichter macht, erschwert anderen das Lesen. Und Leben. Schreibe für deine Leser*innen. Alle. Nebensätze sind okay, aber achte darauf, dass sie nicht zu lang werden.  Natürlich darfst du auch mal wichtige Worte fetten. Verwende eine Schriftart in ausreichender Schriftgröße und ohne unnötige Schnörkel. Vermeide Blocksatz und formatiere immer linksbündig. Und wenn du denkst, da stecken ganz schön viele Informationen in diesem Absatz, stimmt's meistens auch. Verwende daher auch immer gerne Listen. Also hier noch einmal von vorn:

  1. Verwende einfache Sprache.        
  2. Nutze kurze Sätze und einfache Wörter.
  3. Starte jeden Satz in einer neuen Zeile.
  4. Verzichte auf Fremdwörter, wo immer es geht.
  5. Lass Abkürzungen weg.
  6. Schreibe immer für deine Leser*innen.
  7. Nebensätze sind erlaubt, aber halte sie kurz.
  8. Markiere wichtige Wörter fett.
  9. Wähle eine Schriftart, die groß genug ist.
  10. Die Schriftart sollte klar und ohne Schnörkel sein.
  11. Nutze linksbündigen Text und vermeide Blocksatz.

Gar nicht so schwer, die einfache Sprache? Diese einfache Checkliste kann als gedruckter Cheat Sheet deinen Mitarbeiter*innen bei der täglichen Textarbeit helfen. 

Das musst du bei Bildern und Alternativtexten beachten

Bilder sind schnell hochgeladen, aber nicht alle können sie sehen. In Deutschland gibt es etwa 1,2 Millionen blinde und sehbehinderte Menschen. Vermutlich kennst du einige persönlich. Auch bei leichter Seheinschränkung hilft es, wenn du es leichter machst. Ohne Alt-Text verlieren Symbolbilder, Infografiken oder Produktfotos ihren Zweck für Sehbehinderte. Erstell also für jedes Bild auf deiner Website einen Alt-Text. Er sollte die wichtigsten Inhalte kurz und präzise beschreiben. Alt-Texte sind für Maus- und Tastatur-Nutzer*innen unsichtbar, aber Screenreader können sie vorlesen. So wird deine Website zugänglicher und attraktiver.

Schon gewusst? Vermeide Text auf Bildern. Das ist oft nicht barrierefrei und erschwert das Lesen. Platziere den Text lieber als Bildunterschrift oder Überschrift, je nach Bildposition.

Wie bringst du schnell Struktur und Übersichtlichkeit in deinen Content?

Achte auf eine logische und klare Überschriftenstruktur mit maximal einer H1-Überschrift und mehreren H2-Überschriften als Unterüberschriften des Themas. Auf jede Überschrift folgt mindestens ein Absatz, je nach Thema auch mehreren in sich geschlossenen Absätzen. Prüfe anhand von Leitfragen für jeden Absatz, ob dieser auch tatsächlich nur ein Thema und eine Leitfrage behandelt. Eine gelungene H-Struktur sieht wie folgt aus:

H1-H2--H3--H3-H2--H3--H3-H2--H3--H3

Merke: Jede Seite hat maximal eine H1 Überschrift mit dem Thema der Seite. Die H2-Überschriften sind Unterthemen der H1. Und die H3 Unterthemen der H2. Sind diese für dich logisch angeordnet? Dann sind sie es für die Nutzer*innen vermutlich auch.

Design anpassen: Welche Design-Maßnahmen erhöhen sofort die Barrierefreiheit?

Achte auf ausreichende Farbkontraste

Hast du mal einen Text wegen seiner Hintergrundfarbe nicht gut lesen können? Bestimmt. Was für den Designer toll aussieht, ist für viele ein Test für die Augen. Schrift und Hintergrund brauchen genug Kontrast. "Genug" heißt laut WCAG: 4,5:1 für normalen Text, 3:1 für großen Text.

Beispiel: Hellgrüner Text auf grauem Hintergrund ist okay. Wird der Text dunkler, wird es schwerer zu lesen. Testen kannst du bestimmte Kontraste mit Silktide.

 

Abbildung 1: Barrierefreie Textbühne bei NC

Abbildung 1:Barrierefreie Textbühne bei NC

 

 

Abbildung 2: Barrierefreie Farbkontraste

Abbildung 2: Barrierefreie Farbkontraste

 

 

Abbildung 3: nicht barrierefreie Farbkontraste

Abbildung 3: nicht barrierefreie Farbkontraste

 

 

Welche Schriftarten und -größen funktionieren barrierefrei?

Verwende stets gut lesbare Schriftarten. Dazu zählen insbesondere serifenlose Schriften wie die Arial oder die Roboto. Von Handschriften und geschwungener Kalligrafie lassen wir lieber die Finger. Neben der Schriftart spielt die Größe der Schrift eine wichtige Rolle bei der Auswahl der passenden Schrift. Zwar können Nutzer*innen auch mittels Browser die Schriftgröße einstellen. Dafür ist aber erst ein Extraklick nötig, der nicht sein muss.

 

Abbildung 4: Vergleich serifenlose und Serifenschrift

Abbildung 4: Vergleich serifenlose und Serifenschrift

 

Vermeide diese häufigen Design-Fehler auf deiner Website

Farben allein reichen nicht aus, um Informationen zu vermitteln. Rote Farbe wird allzu häufig eingesetzt, um zu warnen. Aber wovor eigentlich: einem Serverausfall, einem Barrierefreiheitsprüfer, einem frei laufenden Löwen? Ohne textlichen Hinweis verlieren Hinweisfarben ihre Wirkung.

Blinkende, animierte oder bewegte Elemente lassen Websites dynamischer wirken. Sie sorgen aber auch dafür, dass einige Menschen die Inhalte schwerer wahrnehmen können und in eine Überforderungssituation gezwungen werden. Die Wahrheit, oder eben das richtige Maß, liegen bekanntlich in der Mitte. Spannendes und effektvolles Design muss nicht weg, sondern lediglich an die richtigen Stellen und ergänzt durch hilfreiche Hinweise.

Technische Sofortlösungen: Wie behebst du technische Barrieren sofort?

Du findest technische Defizite genau wie Probleme mit Content und Design mit den genannten technischen Werkzeugen. Aber Achtung: Deine technischen Mitarbeiter*innen oder die Entwickler*innen deiner Agentur kennen deine Website besser als das Tool und können im Einzelfall am besten einschätzen, was zu tun ist. Die technischen Verbesserungen können vielfältig sein, dabei geht es häufig um:

  • Label für Bedienelemente 
  • Technisch korrekte Verlinkung und Auszeichnung von Links
  • Semantisch korrekte Menüs
  • und viele andere mehr ...

Kurzum: Die technische Prüfung und Einschätzung geeigneter Maßnahmen sollten Techniker*innen oder Entwickler*innen durchführen.

Langfristige Qualitätssicherung: Wie sorgst du dauerhaft für digitale Barrierefreiheit?

Die Anforderungen an barrierefreie Websites verändern sich stetig. Daran müssen sich auch Websitebetreiber anpassen, damit sie stets rechtssicher agieren. Umso wichtiger ist die Beratung durch ausgewiesene Expert*innen. Denn deine Agentur oder deine von dir beauftragte Prüfstelle arbeitet täglich mit den neuen Normen und bringt diese in zahlreichen Projekten zur Anwendung. Hundertprozentige Sicherheit für eine barrierefreie Website gibt es nicht. Aber kompetente Beratung hilft, auf dem aktuellen Stand zu bleiben und bei erfolgter Prüfung keine Konsequenzen fürchten zu müssen.

Fazit und nächster Schritt

Barrierefreiheit ist kein vorübergehender Trend. Und das ist gut so. Denn die Vorteile gelungener Barrierefreiheit sind vielfältig.

  1. Haltung zeigen: Unternehmen zeigen mit ihrem Engagement den Willen, Menschen mit Behinderungen am gesellschaftlichen Leben und im Internet teilhaben zu lassen. Das kommt gut an bei denjenigen, die es betrifft – und auch in der allgemeinen Bevölkerung. 
  2. Sichtbar werden und die eigene Marke stärken: Barrierefreiheit gehört längst zu den Qualitätskriterien bekannter Suchmaschinen wie Google. Wer hier gut performt, verbessert seine Chancen auf Top-Rankings in den Suchergebnissen.  
  3. Zielgruppen diversifizieren und Leads gewinnen: Wer Menschen mit Behinderungen verprellt, verliert eine substanzielle Gruppe potenzieller Kund*innen. 

Barrierefreiheit ist ein Kann und ab dem 28. Juni ein Muss für viele Unternehmen. Egal, ob du Haltung zeigen und das Richtige tun willst. Oder ob du erkannt hast, dass dich der Gesetzgeber zum Handeln zwingt: Wir unterstützen dich bei der Umsetzung der neuen Norm auf dem Weg in eine barrierefreie Zukunft.

Quellen

de.silktide.com

aktion-mensch.de

rehadat-statistik.de

seokratie.de

lebenshilfe-bw.de

 

Neels ist Online-Berater bei New Communication. Der studierte Kommunikationswissenschaftler hält den agenturinternen Rekord für die längsten Sprachnachrichten. Die nötige Puste dafür holt sich Neels beim Training auf dem Fahrrad oder an der Kletterwand. Wir sind ganz Ohr, Neels!