Wenn ich mit Kundinnen und Kunden über ihre neue Website spreche, kommt das Thema Barrierefreiheit oft erst spät – manchmal gar nicht. „Machen wir später“ oder „Das brauchen wir nicht“ höre ich dann. Dabei lohnt es sich von Tag eins, daran zu denken. Nicht nur wegen des Gesetzes, sondern weil Ihre Seite einfach für mehr Menschen funktioniert. Und ehrlich: Vieles davon ist keine Zauberei, sondern schlicht gutes Handwerk.
Warum Barrierefreiheit?
Der European Accessibility Act (EAA) und die WCAG 2.2 werden oft als „Pflicht“ abgehakt. Klar, für viele Unternehmen gibt es rechtliche Vorgaben. Aber ich finde, der wichtigere Grund ist ein anderer: Sie schließen niemanden aus. Menschen mit Sehbeeinträchtigung, die einen Screenreader nutzen. Jemand, der aus gesundheitlichen Gründen nur die Tastatur bedienen kann. Oder Nutzer mit langsamer Internetverbindung, die schlanke Seiten brauchen. Oder ältere Menschen, die sich mit winzigen Buttons und grauem Text auf grauem Grund schwer tun. All das hat mit Barrierefreiheit zu tun – und am Ende profitieren alle davon, auch Sie.
Eine Seite, die klar strukturiert ist, lädt schneller, ist für Suchmaschinen verständlicher und wirkt oft auch auf den ersten Blick aufgeräumter. Barrierefreiheit ist kein Extra, das man „drumherum“ baut. Sie ist die Basis, wenn man sie von Anfang an mitdenkt.
Semantisches HTML – die unsichtbare Stütze
Am Anfang steht die Struktur. Überschriften als Überschriften (h1, h2, h3 in der richtigen Reihenfolge), Listen als Listen, Buttons als Buttons – und nicht als divs mit Klick-Handler. Das klingt banal, ist aber der größte Hebel. Screenreader springen von Überschrift zu Überschrift und geben so eine Art Inhaltsverzeichnis. Wenn Ihre h1 bis h6 wild durcheinandergehen oder nur zur Optik missbraucht werden, wird die Seite für blinde Nutzer zur Stolperfalle. Ich achte deshalb von Projektstart an darauf, dass die Auszeichnung stimmt. Kein „h3, weil der Absatz kleiner aussehen soll“, sondern: Was ist wirklich die nächste logische Ebene?
Links und Buttons müssen aussagekräftig sein. „Hier klicken“ oder „Mehr“ hilft niemandem, der sich nur die Linkliste vorlesen lässt. Besser: „Preise anzeigen“ oder „Zum Kontaktformular“. Das ist oft nur eine kleine Formulierung – aber sie macht den Unterschied.
Kontrast und Tastatur – sichtbar und erreichbar
Kontrast klingt nach Design-Thema, ist aber eine harte Barriere. Grauer Text auf hellem Grau sieht vielleicht modern aus, ist aber für viele kaum lesbar. Die WCAG empfehlen mindestens 4,5:1 für Fließtext (bei großer Schrift etwas weniger). Ich prüfe das mit Tools wie dem Contrast Checker – und wenn es knapp ist, wird nachgebessert. Lieber ein kräftigeres Schwarz als „fast gut“.
Genauso wichtig: Alles muss mit der Tastatur erreichbar sein. Kein „hover hier, dann erscheint der Button“. Kein Menü, das sich nur per Maus öffnen lässt. Und der Fokus muss sichtbar sein – dieser oft unscheinbare Rahmen um den aktuell angesteuerten Link oder Button. Manche Designs entfernen ihn mit CSS, weil er „nervt“. Dann nervt die Seite aber alle, die mit Tab durchklicken. Ich lasse den Fokus immer sichtbar (oder gestalte ihn dezent, aber klar).
Zeitgesteuerte Inhalte sind ein Klassiker der Barrieren: Carousel, die von selbst wechseln, oder Meldungen, die nach wenigen Sekunden verschwinden. Wer langsam liest oder den Fokus nicht so schnell setzen kann, verpasst etwas. Wo es geht, vermeide ich automatische Wechsel oder sorge zumindest für Pause- und Wiederhol-Optionen.
Bilder und Medien
Bilder brauchen Alternativtexte – nicht „Bild_01.jpg“, sondern eine kurze Beschreibung dessen, was für das Verständnis wichtig ist. Bei rein dekorativen Bildern kann man sie für Screenreader ausblenden. Bei Infografiken oder Diagrammen reicht ein Alt-Text oft nicht; dann braucht es eine textliche Alternative oder eine gut strukturierte Tabelle. Das klingt nach Mehrarbeit, zwingt aber dazu, Inhalte klar zu durchdenken. Oft wird die Seite dadurch für alle verständlicher.
Von Anfang an statt nachträglich
Barrierefreiheit nachträglich einzubauen ist teuer und fehleranfällig. Wenn die Struktur von vornherein stimmt, die Kontraste passen und die Bedienung mit Tastatur möglich ist, spart man sich späteres Refactoring. Ich habe schon Projekte gesehen, bei denen „Accessibility“ als letzter Punkt auf der Liste stand – und dann musste halb die Seite umgebaut werden. Besser: gleich richtig machen.
Fazit
Barrierefreiheit ist für mich kein lästiges Pflichtthema, sondern Teil von gutem Webdesign. Klare Struktur, lesbarer Kontrast, Tastaturbedienbarkeit und sinnvolle Texte für Bilder – das kommt allen zugute und macht Ihre Website zukunftssicher. Wenn Sie möchten, können wir in Ihrem nächsten Projekt genau darauf achten. Einfach ansprechen.