.avif)
Barrierefreies Webdesign klingt nach Vorschrift und Technik, meint aber vor allem eines: mehr Menschen können Deine Website sehen, verstehen, bedienen und am Ende zu Anfragen werden. In diesem Guide erkläre ich Dir die WCAG-Grundlagen ohne Fachchinesisch: die vier Prinzipien, die Stufen A bis AAA und was BFSG und BaFG seit 2025 wirklich von Dir verlangen, und was nicht.
Barrierefreies Webdesign bedeutet, dass möglichst jeder Mensch Deine Website nutzen kann: sehen, hören, bedienen und verstehen, unabhängig von einer Behinderung, dem Alter oder der eingesetzten Technik. Das betrifft blinde Menschen mit Screenreader genauso wie jemanden, der nach einem Armbruch nur die Tastatur nutzt oder bei Sonnenlicht auf dem Handy Deine Öffnungszeiten sucht.
Wichtig zu verstehen: Barrieren treffen weit mehr Menschen, als die meisten denken. Manche Einschränkungen sind dauerhaft, andere vorübergehend (ein gebrochener Arm), wieder andere situativ (grelles Sonnenlicht, laute Umgebung ohne Kopfhörer). Wenn Deine Website nur unter idealen Bedingungen funktioniert, verlierst Du still und leise Interessenten, ohne es je in der Statistik zu sehen.
Genau hier setzen die Web Content Accessibility Guidelines (WCAG) an. Sie sind der internationale Standard des W3C dafür, wie Webinhalte zugänglich gestaltet werden, und die Grundlage für die Gesetzgebung in Deutschland, Österreich und vielen weiteren Ländern. Vom Kunden Deines Kunden her gedacht ist die Rechnung simpel: Wer Deine Telefonnummer nicht lesen oder Dein Kontaktformular nicht ausfüllen kann, ruft nicht an und schickt keine Anfrage.
Praxis-Tipp: Mach den schnellsten Selbsttest, den es gibt. Leg die Maus weg und versuche, Deine Website nur mit der Tab-Taste zu bedienen. Kommst Du damit bis zum Kontaktformular und wieder zurück? Wenn nicht, hast Du Deine erste konkrete Barriere gefunden.
Die WCAG stehen auf vier Prinzipien, im Englischen als POUR bekannt: wahrnehmbar, bedienbar, verständlich und robust. Jede einzelne Anforderung an eine barrierefreie Website lässt sich einem dieser vier Prinzipien zuordnen. Wer die vier versteht, versteht die ganze Logik dahinter, ohne sich durch hunderte Einzelkriterien wühlen zu müssen.
Abb. 1: Die vier POUR-Prinzipien der WCAG im Überblick (Quelle: DesignTribe)
Wahrnehmbar heißt, dass jeder Besucher die Inhalte mit den ihm verfügbaren Sinnen erfassen kann. Bilder brauchen einen Alternativtext, den ein Screenreader vorliest. Videos brauchen Untertitel. Und Text braucht genug Kontrast zum Hintergrund. Die WCAG fordern auf Stufe AA für normalen Text ein Kontrastverhältnis von mindestens 4,5:1 und für großen Text mindestens 3:1. Hellgraue Schrift auf weißem Grund fällt hier gnadenlos durch.
Bedienbar bedeutet, dass sich jede Funktion auch ohne Maus nutzen lässt, allen voran mit der Tastatur. Menschen mit motorischen Einschränkungen, aber auch viele ältere Nutzer, navigieren per Tab-Taste. Dazu gehören außerdem genug Zeit für Eingaben, der Verzicht auf schnell blinkende Effekte und Klickflächen, die auch mit dem Daumen auf dem Smartphone sicher zu treffen sind.
Verständlich meint, dass Inhalt und Bedienung nachvollziehbar sind. Dazu zählen einfache Sprache, erklärte Fachbegriffe, eine konsistente Navigation und Formulare, deren Felder dauerhaft beschriftet sind. Ein reiner Platzhaltertext, der beim Tippen verschwindet, reicht nicht: Wer sich verklickt, weiß sonst nicht mehr, was in welches Feld gehört.
Robust heißt, dass Deine Website mit unterschiedlicher und zukünftiger Technik zusammenarbeitet. Die Basis ist valides, semantisch korrektes HTML: eine Überschrift ist als Überschrift ausgezeichnet, ein Button als Button. Nur so können assistive Technologien wie Screenreader die Seite korrekt interpretieren. Genau hier zahlt sich sauberes Handwerk in der Webentwicklung aus.
„In der Praxis sehe ich immer wieder dieselbe Überraschung: Betriebe glauben, Barrierefreiheit sei ein riesiges Extra-Projekt. Wenn eine Website aber von Anfang an sauber gebaut ist, sind die vier Prinzipien zu 80 Prozent einfach gute Handwerksarbeit, kein Aufpreis."
– Nicolas Mondré, DesignTribe
Die WCAG kennen drei Konformitätsstufen: A, AA und AAA. Stufe A deckt die grundlegenden Mindestanforderungen ab, AAA das Maximum, das in der Praxis selten vollständig erreichbar ist. Der entscheidende und rechtlich relevante Maßstab in Deutschland und Österreich liegt dazwischen: Stufe AA. Genau dieses Niveau solltest Du im Blick haben.
Abb. 2: Die drei WCAG-Konformitätsstufen und ihr praktischer Maßstab (Quelle: DesignTribe)
Ein Blick auf die aktuelle Fassung hilft beim Einordnen: Die WCAG 2.2 sind seit Oktober 2023 der offizielle W3C-Standard und seit Oktober 2025 zusätzlich als ISO-Norm anerkannt. Sie umfassen 13 Richtlinien unter den vier Prinzipien und ergänzen gegenüber der Vorversion 2.1 neun weitere Erfolgskriterien, etwa zu Fokus-Sichtbarkeit und Mindestgröße von Klickzielen. Für die gesetzliche Bewertung in Deutschland und Österreich ist über die Norm EN 301 549 weiterhin WCAG 2.1 AA maßgeblich; weil WCAG 2.2 abwärtskompatibel ist, bist Du mit dem neueren Stand automatisch auf der sicheren Seite.
Praxis-Tipp: Kontrast musst Du nicht schätzen. Kostenlose Tools wie der WebAIM Contrast Checker oder die Lighthouse-Prüfung im Chrome-Browser zeigen Dir in Sekunden, ob Deine Textfarben die 4,5:1-Marke schaffen. Das ist einer der häufigsten und am schnellsten behebbaren Fehler.
Ob Deine Website gesetzlich barrierefrei sein muss, hängt vor allem von zwei Fragen ab: Schließt Du online Verträge ab, und wie groß ist Dein Betrieb? Seit dem 28. Juni 2025 gelten in Deutschland das Barrierefreiheitsstärkungsgesetz (BFSG) und in Österreich das Barrierefreiheitsgesetz (BaFG). Beide setzen dieselbe EU-Richtlinie um, den European Accessibility Act.
Wichtiger Hinweis vorweg: Das hier ist eine Orientierung, keine Rechtsberatung. Deinen konkreten Einzelfall solltest Du im Zweifel fachkundig prüfen lassen. Trotzdem lässt sich die Lage für die allermeisten kleinen Betriebe klar zusammenfassen, und die Wahrheit ist erfreulicher als die Panikmache mancher Anbieter vermuten lässt.
Abb. 3: Vereinfachter Entscheidungspfad zur Betroffenheit (Quelle: DesignTribe, keine Rechtsberatung)
Beide Gesetze zielen auf denselben Kern: Verbraucher sollen digitale Dienstleistungen eigenständig nutzen können. Betroffen sind vor allem Angebote im elektronischen Geschäftsverkehr an Endkunden, also Online-Shops, Bankdienstleistungen, Telekommunikation, E-Books und verbindliche Online-Buchungen. Wenn Kunden bei Dir online einen Vertrag abschließen oder verbindlich einen Termin buchen, fällt das in den Anwendungsbereich.
Und jetzt die Entlastung für viele kleine Betriebe: Für reine Info- und Präsentations-Websites ohne Möglichkeit eines Online-Vertragsabschlusses gilt die Pflicht in der Regel nicht. Geht bei Dir online nur eine Anfrage ein, die Du danach selbst manuell annimmst, ist das kein Online-Vertragsabschluss im Sinne des Gesetzes. Zusätzlich gibt es die Kleinstunternehmen-Ausnahme: Wer weniger als 10 Personen beschäftigt und höchstens 2 Mio. Euro Jahresumsatz oder Bilanzsumme hat, ist bei Dienstleistungen von der Pflicht ausgenommen. Diese Ausnahme greift allerdings nicht, wenn Du bestimmte Produkte wie Smartphones oder E-Book-Reader verkaufst.
Ein anschauliches Beispiel macht die Logik greifbar: Bietet ein Betrieb auf seiner Website eine verbindliche Online-Terminbuchung an, fällt das in den Anwendungsbereich, selbst wenn die eigentliche Dienstleistung gar nicht in der Gesetzesliste steht. Denn entscheidend ist der Online-Vertragsabschluss, nicht die Branche. Ist derselbe Betrieb aber ein Kleinstunternehmen unter der genannten Schwelle, gilt für seine Dienstleistung wieder die Ausnahme. Genau diese Kombination aus Betriebsgröße und Art des Online-Angebots bestimmt am Ende, ob die Pflicht überhaupt zieht.
In der Grundstruktur sind BFSG und BaFG fast deckungsgleich, weil beide dieselbe EU-Richtlinie umsetzen. Die Unterschiede liegen im Detail, etwa bei den zuständigen Behörden und den Höchststrafen. Die folgende Tabelle fasst die für Dich wichtigsten Punkte zusammen.
| Aspekt | Deutschland (BFSG) | Österreich (BaFG) |
|---|---|---|
| In Kraft seit | 28. Juni 2025 | 28. Juni 2025 |
| Setzt um | European Accessibility Act (EU 2019/882) | European Accessibility Act (EU 2019/882) |
| Technischer Maßstab | EN 301 549 (verweist auf WCAG 2.1 AA) | EN 301 549 (verweist auf WCAG 2.1 AA) |
| Kleinstunternehmen | bei Dienstleistungen ausgenommen (unter 10 MA und max. 2 Mio. Euro) | bei Dienstleistungen ausgenommen (unter 10 MA und max. 2 Mio. Euro) |
| Info-Website ohne Online-Vertrag | in der Regel nicht betroffen | in der Regel nicht betroffen |
| Aufsicht | Marktüberwachungsbehörden der Länder | Sozialministeriumservice |
Für öffentliche Stellen gelten übrigens eigene, ältere Regeln, in Deutschland über die BITV 2.0 und das BGG, in Österreich über das Web-Zugänglichkeits-Gesetz. Diese Pflichten bestehen unabhängig vom BFSG oder BaFG und richten sich nicht an private Betriebe.
In einem kostenlosen Erstgespräch ordnen wir Deine Situation ehrlich ein und zeigen Dir, wie Du Deine Website zugänglich und anfragestark aufstellst. Als Webflow Experts Premium Partner bauen wir Barrierefreiheit von Anfang an mit ein, ohne Angstverkauf.
Jetzt Angebot anfragenFast alles, was Deine Website barrierefrei macht, hilft gleichzeitig bei Google: sauberes HTML, eine sinnvolle Überschriften-Struktur, beschreibende Alternativtexte, schnelle Ladezeiten und klare Sprache sind sowohl Barrierefreiheits- als auch SEO-Grundlagen. Du investierst also nie nur in Zugänglichkeit, sondern immer auch in Deine Sichtbarkeit.
Der Grund ist einfach: Eine Suchmaschine liest Deine Seite ähnlich wie ein Screenreader. Beide sind auf saubere Struktur angewiesen und beide profitieren von aussagekräftigen Alt-Texten und einer logischen Reihenfolge der Inhalte. Wer für Menschen mit Einschränkungen sauber baut, baut fast automatisch auch für den Google-Bot verständlich. Genau deshalb überschneiden sich barrierefreies Webdesign und viele Strategien für mehr Traffic so stark.
Konkret heißt das: Ein Alternativtext, den Du für blinde Nutzer schreibst, hilft Google zu verstehen, was auf einem Bild zu sehen ist. Eine saubere Überschriften-Hierarchie, die Screenreadern die Orientierung gibt, signalisiert der Suchmaschine gleichzeitig die Struktur Deiner Inhalte. Und eine schnelle, schlanke Seite ist für Menschen mit langsamer Verbindung genauso ein Gewinn wie für Dein Ranking. Du machst diese Arbeit also ohnehin, sobald Du Deine Sichtbarkeit ernst nimmst.
Und daraus folgt die Conversion-Logik, die für Dich zählt: Eine zugängliche Seite erreicht mehr Menschen, hält sie länger und macht es allen leichter, den Weg zum Kontaktformular zu finden. Mehr erreichte Besucher bei gleicher Werbung bedeuten schlicht mehr mögliche Anfragen. Barrierefreiheit ist damit kein Kostenfaktor, sondern ein Hebel, der auf dieselbe Kennzahl einzahlt wie gutes Webdesign insgesamt.
Die meisten Barrieren auf Firmen-Websites sind wenige, immer gleiche Fehler: zu schwache Kontraste, fehlende Alternativtexte, per Tastatur nicht bedienbare Menüs und Formulare ohne echte Beschriftung. Die gute Nachricht ist, dass sich genau diese Punkte systematisch abarbeiten lassen, oft ohne Deine Seite komplett neu zu bauen.
| Prinzip | Typische Barriere | Konkrete Maßnahme |
|---|---|---|
| Wahrnehmbar | Hellgraue Schrift, Bilder ohne Alt-Text | Kontrast auf mindestens 4,5:1 bringen, jedes inhaltstragende Bild beschreiben |
| Bedienbar | Menü nur per Maus, winzige Buttons | Tastatur-Navigation sicherstellen, Klickflächen vergrößern |
| Verständlich | Formularfelder nur mit Platzhalter | Sichtbare, dauerhafte Beschriftungen und klare Fehlermeldungen |
| Robust | Überschriften nur optisch groß gemacht | Semantisch korrekte Auszeichnung mit H1 bis H3 und echten Buttons |
Am wirksamsten ist es, diese Punkte nicht als nachträgliche Reparatur zu behandeln, sondern beim nächsten Relaunch oder Neubau direkt mitzudenken. Wer eine Website ohnehin frisch aufsetzt, baut Barrierefreiheit mit geringem Mehraufwand ein. Nachträgliches Flicken einer alten, unsauber gebauten Seite ist dagegen fast immer aufwändiger.
Wie sich Barrierefreiheit konkret auswirkt, hängt stark davon ab, was Deine Website leisten soll. Bei einer Arztpraxis mit Online-Terminbuchung ist das Buchungssystem der kritische Punkt: Es muss per Tastatur bedienbar und für Screenreader verständlich sein, sonst bleiben genau die Patienten außen vor, die auf diese Zugänglichkeit angewiesen sind. Und weil eine verbindliche Online-Buchung als Dienstleistung im elektronischen Geschäftsverkehr gilt, ist sie zugleich der Teil, der rechtlich am ehesten relevant wird.
Ähnlich sieht es bei Friseuren und Kosmetikstudios aus, die Termine online vergeben: Das Buchungstool entscheidet, ob wirklich alle Kunden bis zum Abschluss kommen. In der Gastronomie sind es oft die Speisekarte und das Reservierungssystem. Eine Karte, die nur als schwer lesbares Bild oder unstrukturiertes PDF vorliegt, ist für Screenreader eine Sackgasse; besser ist echter, strukturierter Text direkt auf der Seite. Der schöne Nebeneffekt: Genau diese Textform liest auch Google problemlos.
Praxis-Tipp: Finger weg von Overlay-Widgets, die per Klick angeblich jede Seite barrierefrei machen. Solche Ein-Klick-Lösungen decken die eigentlichen Probleme oft nur oberflächlich ab und erfüllen die Anforderungen meist nicht vollständig. Echte Zugänglichkeit entsteht im Aufbau der Seite, nicht in einem aufgesetzten Tool.
Wir gestalten und entwickeln Websites, die alle Nutzer erreichen und trotzdem klar auf Anfragen ausgerichtet sind. Sag uns, wo Du stehst, und wir geben Dir eine ehrliche Einschätzung, was sinnvoll ist und was nicht.
Kostenloses Erstgespräch sichernDie WCAG sind der internationale technische Standard des W3C dafür, wie Webinhalte zugänglich gestaltet werden. Das BFSG ist das deutsche Gesetz, das über die Norm EN 301 549 auf die WCAG verweist. In Österreich übernimmt das BaFG diese Rolle. Kurz: Die WCAG liefern das Wie, die Gesetze das Ob und Für-wen.
In der Praxis und rechtlich ist Stufe AA der Maßstab in Deutschland und Österreich. Die Norm EN 301 549 verweist derzeit auf WCAG 2.1 Stufe AA. Weil die aktuelle Fassung WCAG 2.2 abwärtskompatibel ist, erfüllst Du mit ihr automatisch auch die älteren Anforderungen und bist damit gut aufgestellt.
Reine Info- und Präsentations-Websites ohne Möglichkeit eines Online-Vertragsabschlusses fallen in der Regel nicht unter die Pflicht. Zusätzlich sind Kleinstunternehmen unter 10 Beschäftigten und höchstens 2 Mio. Euro bei Dienstleistungen ausgenommen. Das ist keine Rechtsberatung; im Zweifel lass Deinen Einzelfall fachkundig prüfen.
Das hängt vom Umfang und vom Zustand Deiner aktuellen Seite ab. Bei einem Neubau ist der Mehraufwand gering, weil Zugänglichkeit von Anfang an mitgedacht wird. Das nachträgliche Anpassen einer alten Seite ist aufwändiger. Pauschalpreise sind unseriös; wir schauen uns Deine Situation an und geben Dir eine klare Einschätzung.
Ja, und das ist der eigentliche Punkt. Eine zugängliche Website erreicht mehr Menschen, ist für alle besser bedienbar und schneidet bei Google oft besser ab, weil saubere Struktur und Alt-Texte auch SEO-Faktoren sind. Barrierefreiheit zahlt damit direkt auf mehr Reichweite und mehr Anfragen ein.
Barrierefreies Webdesign wirkt von außen kompliziert, folgt aber einer klaren Logik: vier Prinzipien, drei Stufen und die praktische Zielmarke AA. Für viele kleine Betriebe mit reiner Info-Website ist die gesetzliche Pflicht sogar entspannter, als die Schlagzeilen vermuten lassen. Und selbst dort, wo keine Pflicht besteht, lohnt sich Zugänglichkeit, weil sie Reichweite, Nutzerfreundlichkeit und Sichtbarkeit gleichzeitig verbessert. Am einfachsten baust Du sie beim nächsten Webdesign-Projekt von Anfang an mit ein.
Lass uns über Deine Website sprechen: Stell hier unverbindlich Deine Anfrage, und wir melden uns mit einer ehrlichen Einschätzung, wo Deine Seite steht und was für Dich wirklich sinnvoll ist.
Ich bin Nicolas Mondré, Gründer von DesignTribe in Wien. Mit meinem Team gestalte und entwickle ich Websites, die Kunden gewinnen: Strategie, Webdesign und Webentwicklung auf Webflow, als zertifizierter Webflow Experts Premium Partner. In unserem Blog teile ich, was ich aus über fünf Jahren Projekt-Praxis über Websites gelernt habe, die wirklich Anfragen bringen.
.avif)