Barrierefreie Website für KMU, warum es sich lohnt und worauf es ankommt
Eine barrierefreie Website lässt sich von möglichst allen bedienen, auch mit Sehschwäche, ohne Maus oder mit dem Handy bei greller Sonne. Als Richtschnur dient der internationale Standard WCAG, und für ein KMU genügen zehn Punkte, die Sie selbst prüfen können.
Warum sich Barrierefreiheit für ein KMU lohnt
Barrierefrei heisst nicht, dass Ihre Seite für einen kleinen Kreis gebaut wird. Es heisst, dass sie in möglichst vielen Situationen funktioniert:
- Für Menschen mit Sehschwäche, Farbfehlsichtigkeit, Hörbehinderung oder eingeschränkter Beweglichkeit, die ohne Maus arbeiten.
- Für ältere Kundschaft, die mit kleiner Schrift und schwachem Kontrast Mühe hat. In Handwerk, Praxis und Gastro ist sie oft ein wesentlicher Teil der Kundschaft.
- Für alle, die vorübergehend eingeschränkt sind: ein gebrochener Arm, ein Daumen auf dem Handy, grelle Sonne auf der Baustelle, ein Zug ohne Kopfhörer.
Was dafür nötig ist, hilft allen. Gut lesbare Schrift, klarer Kontrast und eine saubere Struktur machen jede Seite angenehmer, und dieselbe Struktur aus Überschriften und Bildbeschreibungen lesen auch Suchmaschinen. Ein Formular, das sich nicht per Tastatur bedienen lässt, verliert dagegen Anfragen, ohne dass Sie es merken.
Zur Rechtslage: Verbindliche Vorgaben bestehen vor allem für Behörden und Stellen mit öffentlichem Auftrag. Für private Firmen ist die Lage in der Schweiz weniger klar und hängt von Branche und Zielmarkt ab. Wer gezielt Kundschaft in der EU anspricht, etwa im Online-Handel, sollte sich nach den dortigen Regeln erkundigen. Dieser Beitrag ist keine Rechtsberatung. Bei Unsicherheit ziehen Sie eine Fachperson bei.
Was WCAG bedeutet
WCAG steht für Web Content Accessibility Guidelines. Das Regelwerk stammt vom Internetgremium W3C und gilt weltweit als Massstab. Es kennt die Stufen A, AA und AAA. Für Firmenwebsites ist Stufe AA das übliche Ziel, und verbreitet ist die Version 2.2. Die Regeln folgen vier Grundgedanken: Inhalte müssen wahrnehmbar, bedienbar, verständlich und robust sein. Das Regelwerk und Erläuterungen finden Sie bei der Web Accessibility Initiative des W3C.
Die zehn wichtigsten Punkte
- Bildbeschreibungen. Jedes Bild mit Aussage bekommt einen kurzen Alternativtext, zum Beispiel «Monteur setzt eine Wärmepumpe im Keller an». Reine Dekoration bleibt leer. So erfahren auch Blinde, was zu sehen ist.
- Kontrast. Text und Hintergrund müssen sich deutlich abheben. Die Faustregel nach WCAG AA lautet: normaler Text mindestens 4,5 zu 1, grosse Schrift mindestens 3 zu 1. Hellgrauer Text auf weissem Grund ist der klassische Fehler. Kostenlose Kontrastrechner im Netz zeigen das Verhältnis.
- Tastatur. Alles, was Sie mit der Maus erreichen, muss auch mit der Tab-Taste erreichbar sein, in sinnvoller Reihenfolge und mit sichtbarem Rahmen um das gerade angewählte Element.
- Überschriften. Eine Hauptüberschrift, darunter logisch gegliedert. Überschriften sind Wegweiser für Screenreader und keine blossen Schriftgrössen.
- Linktexte. «Offerte anfragen» statt «hier klicken». Links erkennt man auch ohne Farbe, zum Beispiel an der Unterstreichung.
- Formulare. Jedes Feld hat eine sichtbare Beschriftung. Ein Platzhaltertext, der beim Tippen verschwindet, ersetzt sie nicht. Pflichtfelder sind markiert, Fehlermeldungen stehen beim Feld und sagen, was zu tun ist. Mehr dazu im Beitrag Kontaktformular optimieren.
- Schrift und Zoom. Die Seite lässt sich auf die doppelte Grösse vergrössern, ohne dass Text verschwindet oder man seitwärts scrollen muss. Die Grundschrift ist gross genug zum Lesen.
- Farbe nie allein. Ein Fehler wird neben der roten Farbe auch mit Text oder Symbol gekennzeichnet. Rot und Grün unterscheiden nicht alle Menschen.
- Video und Ton. Videos erhalten Untertitel, nichts läuft automatisch mit Ton, bewegte Elemente lassen sich anhalten.
- Klickflächen und Spamschutz. Knöpfe sind gross genug und haben Abstand, damit man sie auf dem Handy trifft (WCAG 2.2 nennt mindestens 24 mal 24 Pixel). Rätsel-Captchas sind für viele Menschen eine Hürde, ein unsichtbarer Spamschutz im Formular ist besser. Mehr zur Handy-Ansicht im Beitrag Mobile Website.
Ablauf: Der Kurztest für Ihre Seite
Sie brauchen keine Spezialsoftware, um Ihre Seite einzuordnen:
- Maus weglegen. Drücken Sie die Tab-Taste und gehen Sie die ganze Startseite durch. Sehen Sie immer, wo Sie sind? Erreichen Sie Menü und Formular?
- Zoomen. Vergrössern Sie die Seite im Browser auf die doppelte Grösse (Strg oder Cmd und Plus). Bleibt alles lesbar?
- Handy im Freien. Öffnen Sie die Seite bei Tageslicht oder mit gedimmtem Bildschirm. Erkennen Sie Text und Knöpfe?
- Formular ausfüllen. Füllen Sie es ohne Maus aus und machen Sie absichtlich einen Fehler. Erklärt die Meldung, was zu tun ist?
- Automatische Prüfung. Der Chrome-Browser bringt mit Lighthouse eine Prüfung mit. Sie findet nur einen Teil der Probleme, ein gutes Ergebnis ist darum kein Freibrief.
- Sortieren. Beheben Sie zuerst, was Anfragen verhindert (Formular, Kontakt), dann den Kontrast, dann den Rest. Weitere Prüfpunkte stehen im Beitrag Website-Check-Checkliste. Weitere Beiträge finden Sie in der Ratgeber-Übersicht.
Wenn Sie Ihre Seite neu aufbauen möchten
Edelweiss vermittelt Ihr Vorhaben an eine Agentur, die dazu passt. Für Sie ist das kostenlos, bezahlt werden wir von den Agenturen. Sie können Ihr Vorhaben in sechs Fragen beschreiben. Wenn Sie zuerst einen Überblick wollen, ist der kostenlose Website-Check ein guter Anfang.
Häufige Fragen
Muss mein KMU eine barrierefreie Website haben?
Verbindlich ist Barrierefreiheit vor allem für Behörden und Stellen mit öffentlichem Auftrag. Für private Firmen hängt es von Branche und Zielmarkt ab. Unabhängig davon spricht der Nutzen für die Kundschaft dafür, die wichtigsten Punkte umzusetzen. Im Zweifel fragen Sie eine Fachperson.
Reicht ein Overlay-Plugin, das Barrierefreiheit per Knopfdruck verspricht?
Solche Zusatzwerkzeuge beheben typische Mängel im Aufbau einer Seite in der Regel nicht. Fachleute raten dazu, die Ursachen in der Seite selbst zu beheben, also bei Kontrast, Struktur und Bedienung.
Wie aufwendig ist Barrierefreiheit?
Am geringsten ist der Aufwand, wenn sie von Anfang an in Gestaltung und Aufbau einfliesst. Nachträglich hängt er vom Zustand der Seite ab: Anzahl der Seiten, Formulare, Videos und Funktionen. Den Umfang nennt Ihnen die Agentur in ihrem Angebot.
Welche Stufe sollte ich anstreben?
Stufe AA ist für Firmenwebsites das übliche Ziel. Sie deckt die wichtigsten Hürden ab, ohne die Gestaltung stark einzuschränken. Höhere Stufen lassen sich für einzelne Inhalte umsetzen.