Sind Joomla-Websites barrierefrei?
Diese Frage erreicht uns häufig – und die ehrliche Antwort lautet: Es kommt darauf an. Um sie sinnvoll zu beantworten, müssen wir zwischen zwei grundlegend verschiedenen Bereichen einer Joomla-Website unterscheiden.
Der Admin-Bereich: Joomla nimmt Barrierefreiheit ernst
Das Joomla-Projekt hat Barrierefreiheit als strategisches Ziel fest verankert. Der Administrationsbereich – also das Backend, in dem Sie Inhalte pflegen und Ihre Website verwalten – wird aktiv nach WCAG-Richtlinien entwickelt und kontinuierlich optimiert.
Bereits seit Joomla 4 gibt es ein dediziertes Accessibility-Team innerhalb des Projekts, das neue Features und Änderungen auf Barrierefreiheit prüft. Tastaturnavigation, Screenreader-Kompatibilität, Farbkontraste – all das wird im Core-Entwicklungsprozess berücksichtigt. Für Redakteur:innen mit Einschränkungen bedeutet das: Sie können Joomla bedienen.
Diese Haltung ist keineswegs selbstverständlich. Joomla gehört damit zu den Content-Management-Systemen, die Accessibility nicht als nachträgliches Feature, sondern als integralen Bestandteil verstehen.
Das Frontend: Ihre Verantwortung
Ganz anders sieht es im öffentlichen Bereich Ihrer Website aus – dem, was Ihre Besucher:innen tatsächlich sehen und nutzen. Hier hat das CMS nur noch minimalen Einfluss auf die Barrierefreiheit.
Zwei Faktoren entscheiden, ob Ihr Frontend barrierefrei ist:
- Das verwendete Template bildet das technische Fundament. Es bestimmt die HTML-Struktur, die semantischen Auszeichnungen, die Farbkontraste, die Tastaturnavigation und vieles mehr. Ein Template, das ohne Rücksicht auf Accessibility entwickelt wurde, können Sie durch noch so sorgfältige Inhaltspflege nicht barrierefrei machen. Die Basis muss stimmen.
- Die Qualität der Inhaltspflege entscheidet über den Rest. Selbst das technisch beste Template hilft nichts, wenn Bilder ohne Alt-Texte eingepflegt werden, Überschriften-Hierarchien ignoriert werden oder Linktexte nur aus „hier klicken" bestehen. Barrierefreiheit ist keine einmalige Einstellung, sondern eine tägliche Praxis.
Die Kurzfassung
Ja, Sie können mit Joomla barrierefreie Websites bauen. Das CMS steht Ihnen dabei nicht im Weg – im Gegenteil, es bringt gute Voraussetzungen mit.
Aber: Joomla allein macht Ihre Website nicht automatisch barrierefrei. Entscheidend sind zwei andere Faktoren:
- Die Wahl Ihres Dienstleisters. Wer Ihre Website konzipiert, gestaltet und technisch umsetzt, muss Barrierefreiheit verstehen und von Anfang an mitdenken. Ein Template, das erst nachträglich „barrierefrei gemacht" werden soll, verursacht meist mehr Aufwand als Nutzen.
- Das Know-how und die Disziplin Ihrer Redakteur:innen. Jede Person, die Inhalte einpflegt, muss wissen, worauf es ankommt – und diese Standards auch im Alltagsgeschäft konsequent einhalten. Das erfordert Schulung, klare Richtlinien und manchmal auch etwas mehr Zeit bei der Inhaltspflege.
Barrierefreiheit ist kein Schalter, den man umlegt. Sie ist das Ergebnis bewusster Entscheidungen – bei der Technik, beim Design und bei jedem einzelnen Inhalt, der veröffentlicht wird.
Was ist Barrierefreiheit und warum ist sie gesetzlich vorgeschrieben?
Barrierefreiheit im Web – oft als "Web Accessibility" bezeichnet – ist längst kein Nice-to-have mehr. Seit Juni 2025 gilt in Deutschland eine klare gesetzliche Verpflichtung für zahlreiche Unternehmen. Doch was bedeutet digitale Barrierefreiheit eigentlich konkret? Und welche Anforderungen müssen Sie als Website-Betreiber erfüllen?
Was bedeutet Barrierefreiheit im Web?
Eine barrierefreie Website ist so gestaltet, dass alle Menschen sie uneingeschränkt nutzen können – unabhängig von körperlichen, sensorischen oder kognitiven Einschränkungen. Das betrifft weit mehr Nutzergruppen, als viele zunächst vermuten:
- Sehbeeinträchtigte Menschen, die Screenreader oder Vergrößerungssoftware nutzen
- Gehörlose und schwerhörige Nutzer, die auf Untertitel und Transkripte angewiesen sind
- Motorisch eingeschränkte Personen, die keine Maus bedienen können
- Menschen mit kognitiven Beeinträchtigungen, die klare Strukturen und einfache Sprache benötigen
- Ältere Menschen mit nachlassender Sehkraft oder Feinmotorik
Wichtig zu verstehen: Barrierefreiheit nutzt nicht nur den rund 8 Millionen schwerbehinderten Menschen in Deutschland. Sie verbessert die Nutzererfahrung für alle – vom gestressten Smartphone-Nutzer in der U-Bahn bis zum Senior am Tablet.
Das Barrierefreiheitsstärkungsgesetz (BFSG): Fristen und Pflichten
Am 28. Juni 2025 ist das Barrierefreiheitsstärkungsgesetz vollständig in Kraft getreten. Dieses Gesetz setzt die europäische Richtlinie "European Accessibility Act" in deutsches Recht um – und hat weitreichende Konsequenzen für den digitalen Handel.
Wer ist betroffen?
Das BFSG gilt für Unternehmen, die Produkte oder Dienstleistungen für Verbraucher anbieten. Im digitalen Bereich sind das insbesondere:
- Online-Shops und E-Commerce-Plattformen
- Bankdienstleistungen und Finanzportale
- Telekommunikationsdienste
- E-Book-Anbieter und elektronische Medien
- Personenbeförderungsdienste mit Online-Buchung
Ausnahme: Kleinstunternehmen mit weniger als 10 Beschäftigten und maximal 2 Millionen Euro Jahresumsatz sind von den Dienstleistungspflichten ausgenommen. Doch Vorsicht: Sobald Sie Produkte verkaufen, gilt diese Ausnahme nicht.
Die Frist ist bereits abgelaufen
Falls Sie bisher abgewartet haben: Die Übergangsfrist ist vorbei. Seit dem 28. Juni 2025 müssen betroffene Websites und Online-Shops die gesetzlichen Anforderungen erfüllen. Wer jetzt noch nicht barrierefrei ist, handelt bereits rechtswidrig.
BITV 2.0 vs. WCAG 2.1 AA: Die Standards im Überblick
Zwei Abkürzungen begegnen Ihnen beim Thema Web-Barrierefreiheit immer wieder: BITV und WCAG. Doch wie hängen diese Standards zusammen – und welcher gilt für Sie?
WCAG 2.1: Der internationale Standard
Die Web Content Accessibility Guidelines (WCAG) werden vom World Wide Web Consortium (W3C) entwickelt und gelten weltweit als Maßstab für barrierefreie Webinhalte. Die Version 2.1 definiert Erfolgskriterien auf drei Konformitätsstufen:
|
Stufe |
Bedeutung |
Anforderung |
|
A |
Mindestanforderung |
Grundlegende Zugänglichkeit |
|
AA |
Gesetzlicher Standard |
Gute Zugänglichkeit für die meisten Nutzer |
|
AAA |
Höchste Stufe |
Optimale Zugänglichkeit |
Für das BFSG relevant ist die Stufe AA – diese muss Ihre Website mindestens erfüllen.
Die WCAG basieren auf vier Grundprinzipien. Webinhalte müssen sein:
- Wahrnehmbar – Informationen müssen für alle Sinne aufbereitet sein
- Bedienbar – Navigation und Interaktion müssen für jeden funktionieren
- Verständlich – Inhalte und Bedienung müssen nachvollziehbar sein
- Robust – Inhalte müssen mit verschiedenen Hilfstechnologien kompatibel sein
BITV 2.0: Die deutsche Umsetzung
Die Barrierefreie-Informationstechnik-Verordnung (BITV 2.0) ist die deutsche Rechtsverordnung, die primär für Behörden und öffentliche Stellen gilt. Sie basiert vollständig auf der WCAG 2.1 AA und erweitert diese um spezifische Anforderungen:
- Gebärdensprachvideos für bestimmte Inhalte
- Texte in Leichter Sprache
- Detaillierte Vorgaben für die Bundesverwaltung
Für privatwirtschaftliche Unternehmen unter dem BFSG ist die WCAG 2.1 AA der relevante Maßstab. Die zusätzlichen BITV-Anforderungen gelten hier nicht verpflichtend – können aber als Best Practice dienen.
Strafen bei Nicht-Einhaltung: Bußgelder bis zu 100.000 Euro
Das BFSG hat (so langsam) Zähne. Die Marktüberwachungsbehörden der Bundesländer sind befugt, Verstöße zu ahnden – und die Sanktionen sind empfindlich:
- Bußgelder bis zu 100.000 Euro für schwerwiegende oder wiederholte Verstöße
- Vertriebsverbote für nicht konforme Produkte und Dienstleistungen
- Rückrufanordnungen und Untersagungsverfügungen
- Öffentliche Bekanntmachung von Verstößen (Reputationsschaden)
Zusätzliches Risiko: Abmahnungen
Neben behördlichen Sanktionen drohen wettbewerbsrechtliche Abmahnungen durch Konkurrenten oder Verbraucherschutzverbände. Die Kosten einer Abmahnung – Anwaltsgebühren, Unterlassungserklärung, mögliche Vertragsstrafen – kommen zu den Bußgeldern hinzu.
Unser dringender Rat: Betrachten Sie Barrierefreiheit nicht als lästige Pflicht, sondern als Investition. Eine zugängliche Website erreicht mehr Kunden, rankt potenziell besser bei Google und schützt Sie vor rechtlichen Konsequenzen.
Die Low-Hanging-Fruits: So erhalten Sie einen ersten Eindruck vom Zustand Ihrer Website
Bevor Sie sich in die Tiefen der Barrierefreiheit stürzen, lohnt sich ein pragmatischer erster Check. Die gute Nachricht: Viele grundlegende Accessibility-Probleme lassen sich mit einfachen Mitteln aufspüren – ganz ohne Expertenwissen. In diesem Abschnitt zeigen wir Ihnen die wichtigsten Schnelltests, die Sie sofort selbst durchführen können. Bitte beachten Sie jedoch, dass es sich hierbei nur um die offensichtlichen Probleme handelt, die auch ohne technisches Know-How gut geprüft werden können.
Textalternativen für Bilder
Was sind Alt-Tags und wann brauchen Sie welche?
Alt-Tags (kurz für „Alternativtexte") sind unsichtbare Beschreibungen, die Sie Bildern hinterlegen. Sie erfüllen zwei zentrale Funktionen: Screenreader lesen diese Texte vor, sodass blinde oder sehbehinderte Menschen den Bildinhalt erfassen können. Außerdem erscheinen sie, wenn ein Bild nicht geladen werden kann.
Dabei gilt eine wichtige Unterscheidung:
- Inhaltlich relevante Bilder transportieren Informationen oder Emotionen, die für das Verständnis des Inhalts wichtig sind. Ein Produktfoto, ein erklärendes Diagramm oder das Bild eines Teammitglieds gehören in diese Kategorie. Diese Bilder benötigen einen beschreibenden Alt-Text, der den Inhalt und Zweck des Bildes wiedergibt.
- Dekorative Bilder hingegen dienen rein der visuellen Gestaltung – etwa ein abstraktes Hintergrundmuster oder ein schmückendes Icon neben einer bereits aussagekräftigen Überschrift. Solche Bilder erhalten einen leeren Alt-Tag (alt=""). Das signalisiert Screenreadern: „Hier gibt es nichts Relevantes, bitte überspringen."
Was sollten Sie tun?
Gehen Sie Ihre Website systematisch durch und prüfen Sie:
- Sind Alt-Tags für inhaltlich relevante Grafiken gesetzt? Ein fehlendes Alt-Attribut führt dazu, dass Screenreader den Dateinamen vorlesen – und „IMG_20231205_143022.jpg" hilft niemandem weiter.
- Sind dekorative Grafiken als solche ausgezeichnet? Ein leerer Alt-Tag ist hier kein Versäumnis, sondern gewollt. Ohne ihn würden Screenreader-Nutzer mit überflüssigen Informationen belastet.
Wichtig: Es gibt bei dieser Einordnung kein absolutes Richtig oder Falsch. Ob ein Bild inhaltlich relevant ist, bleibt oft Interpretationssache. Fragen Sie sich ehrlich: Würde jemandem, der dieses Bild nicht sehen kann, eine wichtige Information fehlen? Nutzen Sie Ihren gesunden Menschenverstand – und im Zweifel lieber einen beschreibenden Alt-Text setzen als gar keinen.
Wie sehe ich die Alt-Texte meiner Website?
Sie haben mehrere Möglichkeiten, die Alt-Texte Ihrer Seite zu überprüfen:
Browser-Erweiterungen wie „Web Developer" oder „Images On/Off" zeigen Alt-Texte direkt im Browser an – oft als Overlay über den Bildern.
Die Browser-Entwicklertools (F12 oder Rechtsklick → „Untersuchen") erlauben einen Blick in den HTML-Code. Klicken Sie auf ein Bild und suchen Sie im Code nach alt="...".
A11y-Toolkits wie WAVE (wave.webaim.org) analysieren Ihre gesamte Seite und markieren fehlende oder leere Alt-Texte übersichtlich mit Icons.
Wo pflege ich Alt-Texte in Joomla?
In Beiträgen:
Die meisten Bilder werden Sie in Ihren Joomla-Beiträgen finden. Hier gibt es zwei Stellen:
- Einleitungs- und Volltext-Bilder: Öffnen Sie den Beitrag im Backend und wechseln Sie zum Tab „Bilder und Links". Dort können Sie für beide Bildtypen jeweils einen Alt-Text hinterlegen.
- Bilder im Fließtext: Diese fügen Sie über den Editor ein. Klicken Sie auf das Bild-Icon in der Editor-Toolbar (oder doppelt auf ein vorhandenes Bild), um den Alt-Text im erscheinenden Dialog zu bearbeiten.
Im YOOtheme Pro Builder:
Falls Sie YOOtheme Pro nutzen, finden Sie die Alt-Text-Einstellung direkt im jeweiligen Element. Öffnen Sie das Image-Element und tragen Sie den Alt-Text im entsprechenden Feld unter den Bildeinstellungen ein.
Farbkontraste prüfen (WCAG-Konformität)
Welche Vorgaben gelten?
Die Web Content Accessibility Guidelines (WCAG) definieren klare Mindestanforderungen für Farbkontraste:
- Normaler Text: Kontrastverhältnis von mindestens 4,5:1
- Großer Text (ab 18pt oder 14pt fett): Kontrastverhältnis von mindestens 3:1
- Grafische Elemente und UI-Komponenten (z.B. Buttons, Formularfelder): mindestens 3:1
Diese Werte gelten für die Konformitätsstufe AA – den gängigen Standard, der auch im Barrierefreiheitsstärkungsgesetz referenziert wird. Die strengere Stufe AAA fordert 7:1 bzw. 4,5:1, ist aber für die meisten Websites nicht verpflichtend.
Was sollten Sie tun?
Nutzen Sie Kontrastprüfer: Tools wie der WebAIM Contrast Checker oder die Browser-Erweiterung „WCAG Color Contrast Checker" helfen Ihnen, problematische Farbkombinationen zu identifizieren.
Achten Sie besonders auf:
- Helle Schrift auf hellem Hintergrund (der Klassiker: hellgrau auf weiß)
- Text auf Bildern oder Farbverläufen
- Placeholder-Texte in Formularen
- Links, die sich nur durch Farbe vom Fließtext unterscheiden
In Joomla anpassen: Kontrastprobleme lassen sich meist nur über Änderungen am Template beheben – entweder über die Template-Einstellungen oder durch Anpassungen im CSS. Bei YOOtheme Pro können Sie Farben direkt im Customizer unter „Style" ändern.
Tastaturnavigation testen
Warum ist das wichtig?
Nicht alle Menschen können eine Maus verwenden. Menschen mit motorischen Einschränkungen, aber auch Power-User und viele Screenreader-Nutzer navigieren ausschließlich mit der Tastatur. Wenn Ihre Website nur mit der Maus bedienbar ist, schließen Sie diese Nutzergruppen aus.
Was sollten Sie tun?
Machen Sie den Selbsttest – legen Sie die Maus beiseite und versuchen Sie, Ihre Website nur mit der Tastatur zu bedienen:
- Rufen Sie Ihre Startseite auf.
- Drücken Sie die Tab-Taste, um von Element zu Element zu springen.
- Prüfen Sie dabei:
- Ist immer klar erkennbar, welches Element gerade fokussiert ist (sichtbarer Fokusrahmen)?
- Können Sie alle interaktiven Elemente erreichen (Links, Buttons, Formulare, Menüs)?
- Ist die Reihenfolge logisch, also entspricht sie dem visuellen Aufbau der Seite?
- Können Sie Dropdown-Menüs öffnen und die Unterpunkte ansteuern?
- Funktionieren Buttons und Links mit der Enter-Taste?
Häufige Probleme:
- Fokus-Outline wurde aus Design-Gründen per CSS entfernt (outline: none)
- Interaktive Elemente sind nur über Hover erreichbar
- Modale Fenster/Pop-ups fangen den Fokus nicht korrekt ein
- Die Tab-Reihenfolge springt wirr über die Seite
Screenreader-Kompatibilität sicherstellen
Warum ist das wichtig?
Screenreader wandeln den Inhalt Ihrer Website in gesprochene Sprache um. Sie sind für blinde und stark sehbehinderte Menschen das zentrale Werkzeug zur Internetnutzung. Eine Website, die für Screenreader nicht verständlich ist, ist für diese Nutzer faktisch nicht existent.
Wie können Sie es testen?
Sie müssen kein teures Hilfsmittel kaufen – jedes gängige Betriebssystem bringt einen Screenreader mit:
Auf Windows: Aktivieren Sie die „Sprachausgabe" über Windows-Taste + Strg + Enter (oder über Einstellungen → Barrierefreiheit → Sprachausgabe).
Auf Mac: Aktivieren Sie VoiceOver mit Cmd + F5.
Auf Mobilgeräten: TalkBack (Android) bzw. VoiceOver (iOS) finden Sie in den Bedienungshilfen.
Navigieren Sie nun durch Ihre Seite und achten Sie auf:
- Werden Überschriften als solche erkannt und vorgelesen?
- Ergeben die vorgelesenen Linktexte Sinn (oder hören Sie nur „hier klicken")?
- Werden Bilder mit sinnvollen Alt-Texten beschrieben?
- Ist bei Formularen klar, welches Feld gerade aktiv ist?
- Gibt es offensichtliche Fehler oder verwirrende Ausgaben?
Ein wichtiger Disclaimer
Dieser Selbsttest hat Grenzen. Menschen, die täglich mit Screenreadern arbeiten, navigieren in einem Tempo und mit Techniken, die für Ungeübte kaum vorstellbar sind. Sie nutzen Shortcuts, Überschriften-Navigation und andere Funktionen, die wir in einem kurzen Test gar nicht erfassen.
Ein Selbsttest kann grobe Fehler aufdecken – er ersetzt aber niemals das Feedback tatsächlich betroffener Nutzer. Betrachten Sie ihn als erste Annäherung, nicht als abschließende Prüfung.
Formulare barrierefrei gestalten
Warum ist das wichtig?
Formulare sind Konversionspunkte: Kontaktanfragen, Newsletter-Anmeldungen, Bestellungen – wer Ihre Formulare nicht bedienen kann, kann nicht mit Ihnen in Kontakt treten oder bei Ihnen kaufen. Gleichzeitig sind Formulare ein häufiger Stolperstein für die Barrierefreiheit.
Wie können Sie testen?
Prüfen Sie Ihre Formulare anhand dieser Checkliste:
Sichtbare Beschriftungen:
- Hat jedes Eingabefeld ein sichtbares Label?
- Bleibt das Label sichtbar, auch wenn Sie etwas eingeben? (Placeholder-Texte, die bei Eingabe verschwinden, sind keine ausreichende Beschriftung!)
Erkennbare Eingabefelder:
- Heben sich die Formularfelder deutlich vom Hintergrund ab?
- Ist das durch ausreichend Kontrast gewährleistet – sei es durch Hintergrundfarbe, einen sichtbaren Rahmen (Border) oder beides?
Fehlermeldungen:
- Werden Fehler klar kommuniziert?
- Ist erkennbar, welches Feld betroffen ist?
- Werden nicht nur Farben (rot = Fehler) zur Kennzeichnung genutzt?
In Joomla prüfen: Die Barrierefreiheit von Formularen hängt stark von der verwendeten Erweiterung ab. Prüfen Sie bei Formulare-Komponenten wie RSForm oder den nativen Joomla-Kontaktformularen die entsprechenden Einstellungen für Labels und Fehlermeldungen.
Sind Skiplinks vorhanden?
Warum ist das wichtig?
Stellen Sie sich vor, Sie müssten bei jedem Seitenaufruf erst durch 15 Navigationslinks tabben, bevor Sie zum eigentlichen Inhalt gelangen. Für Tastatur- und Screenreader-Nutzer ist genau das Alltag – es sei denn, Ihre Website bietet Skiplinks an.
Skiplinks sind versteckte Links, die beim ersten Drücken der Tab-Taste erscheinen und direkte Sprungmarken zu wichtigen Seitenbereichen bieten – typischerweise zum Hauptinhalt, zur Navigation oder zum Footer.
Wie können Sie testen?
Der Test ist denkbar einfach:
- Rufen Sie Ihre Website auf.
- Drücken Sie einmal die Tab-Taste.
- Erscheint ein Link wie „Zum Inhalt springen" oder „Skip to main content"?
Falls kein Skiplink erscheint: Die meisten modernen Joomla-Templates (inkl. Cassiopeia) bringen Skiplinks bereits mit. Falls Ihr Template diese Funktion nicht hat, kann sie relativ einfach ergänzt werden – sprechen Sie Ihren Entwickler darauf an.
Fazit: Der erste Schritt ist getan
Mit diesen sechs Schnelltests haben Sie einen soliden ersten Eindruck vom Barrierefreiheitszustand Ihrer Joomla-Website gewonnen. Sie haben die „Low-Hanging-Fruits" identifiziert – Probleme, die sich oft mit überschaubarem Aufwand beheben lassen.
Wichtig ist: Diese Tests ersetzen kein vollständiges Accessibility-Audit. Sie sind ein Startpunkt, kein Endpunkt. Aber sie helfen Ihnen, die größten Barrieren zu erkennen und erste Verbesserungen anzustoßen – und damit die Nutzererfahrung für alle Besucher Ihrer Website zu verbessern.
Und, sind wir mal ganz ehrlich: Wenn Sie diese 6 Punkte gut erledigen, dann ist Ihre Website vermutlich bereits barrierefreier als circa 95% aller anderen Webangebote.
Joomla-Extensions für Barrierefreie Websites und warum Barrierefreiheits-Overlays keine Lösung sind
Spoiler vorweg: Ein Plugin, das Ihre Joomla-Website per Knopfdruck barrierefrei macht, existiert nicht. Sofern Extensions genau diese Lösung anpreisen, sollten Sie vorsichtig sein. Wir wissen, dass diese Nachricht für viele enttäuschend klingt – schließlich versprechen zahlreiche Anbieter von sogenannten "Accessibility Overlays" genau das. Doch als langjährige Joomla-Experten müssen wir hier aber Klartext reden.
Das Problem mit Overlay-Lösungen
Accessibility Overlays sind JavaScript-Tools, die sich wie eine Schicht über Ihre bestehende Website legen. Sie bieten meist Funktionen wie Schriftgrößen-Anpassung, Kontrast-Schalter oder Vorlese-Buttons. Klingt praktisch – ist es aber nicht.
Diese Tools beheben keine echten Barrieren, sie kaschieren sie bestenfalls. Stellen Sie sich vor, Sie überstreichen Schimmel an der Wand mit frischer Farbe: Optisch sieht es besser aus, doch das eigentliche Problem wächst im Verborgenen weiter.
Warum “Barrierefreiheits-Overlays” Probleme oft verschlimmern
- Konflikte mit Screenreadern: Menschen, die auf Hilfstechnologien angewiesen sind, nutzen bereits eigene, optimal konfigurierte Tools. Overlays funken oft dazwischen und stören die Navigation.
- Falsche Sicherheit: Website-Betreiber glauben, sie hätten das Thema Barrierefreiheit "erledigt" – während echte Hürden bestehen bleiben.
- Rechtliche Risiken: Gerichte und Prüfstellen erkennen Overlay-Lösungen nicht als ausreichende Maßnahme an. Das Barrierefreiheitsstärkungsgesetz (BFSG) verlangt nachweisbare technische Konformität.
- Performance-Einbußen: Zusätzliche Scripts verlangsamen Ihre Website – schlecht für Nutzer und Suchmaschinenranking.
Aus diesen und aus anderen Gründen rät die Überwachungsstelle des Bundes für Barrierefreiheit von Informationstechnik in ihrer Einschätzung zu Overlay Tools auch vom Gebrauch dieser Overlays ab.
Barrierefreiheit entsteht im Fundament
Echte digitale Barrierefreiheit ist kein Anstrich, sondern Architektur. Sie muss von Anfang an mitgedacht werden – im Code, im Design und bei jeder Content-Erstellung.
Das bedeutet konkret:
- Semantisch korrektes HTML in Ihrem Joomla-Template
- Aussagekräftige Alternativtexte für jedes Bild
- Logische Überschriften-Hierarchie in Ihren Beiträgen
- Ausreichende Farbkontraste im Design
- Tastatur-Navigation, die durchgängig funktioniert
Joomla bringt als CMS bereits eine solide Grundlage mit – doch die konsequente Umsetzung liegt bei Ihnen und Ihrem Entwicklerteam.
Unser Fazit
Misstrauen Sie Versprechen, die zu schön klingen. Barrierefreiheit ist ein Prozess, kein Produkt. Investieren Sie Ihr Budget lieber in nachhaltige Maßnahmen: eine professionelle Accessibility-Prüfung, ein barrierefreies Template und Schulungen für Ihr Content-Team.
Ihre Nutzerinnen und Nutzer – und auch Google – werden es Ihnen danken.
Schritt-für-Schritt: Joomla-Website BITV-konform machen
Ein ehrlicher Disclaimer vorab
Wir würden Ihnen gerne eine einfache Checkliste an die Hand geben, die Sie Punkt für Punkt abhaken können – und am Ende ist Ihre Website barrierefrei. Leider funktioniert es so nicht.
Barrierefreiheit ist komplex. Die WCAG umfasst dutzende Erfolgskriterien, die je nach Website-Typ unterschiedlich relevant sind. Automatisierte Tests können nur etwa 30 Prozent der möglichen Barrieren aufdecken. Der Rest erfordert manuelle Prüfung durch geschulte Expert:innen, die verstehen, wie Menschen mit unterschiedlichen Einschränkungen tatsächlich mit Websites interagieren.
Wenn Sie Sicherheit wollen – sei es aus rechtlichen Gründen oder weil Ihnen echte Zugänglichkeit wichtig ist – führt kein Weg an einem professionellen manuellen Audit vorbei. Die folgenden Schritte zeigen Ihnen den typischen Weg dorthin.
Schritt 1: Ist-Analyse durch einen professionellen Dienstleister
Der erste Schritt ist eine fundierte Bestandsaufnahme. Ein erfahrener Accessibility-Dienstleister prüft Ihre Website systematisch gegen die WCAG-Kriterien und dokumentiert alle gefundenen Barrieren in einem strukturierten Bericht.
Dieser Audit-Bericht ist Ihre Arbeitsgrundlage. Er listet nicht nur die Probleme auf, sondern ordnet sie nach Schweregrad, betroffenen Nutzergruppen und idealerweise auch nach Aufwand für die Behebung. So können Sie priorisieren und wissen genau, wo Sie stehen.
Schritt 2: Findings der Analyse systematisch abarbeiten
Mit dem Audit-Bericht in der Hand beginnt die eigentliche Arbeit. Die gefundenen Probleme lassen sich typischerweise in zwei Kategorien einteilen:
Technische Probleme betreffen Template, Code und Konfiguration. Fehlende ARIA-Labels, mangelnde Tastaturnavigation, unzureichende Kontraste im Design – diese Punkte muss Ihre Agentur oder Ihr Entwicklungsteam beheben. Hier sind Änderungen am Template, an Erweiterungen oder am CSS erforderlich.
Redaktionelle Findings betreffen die eingepflegten Inhalte: fehlende Alt-Texte, falsche Überschriften-Hierarchien, nichtssagende Linktexte. Für diese Kategorie empfehlen wir einen anderen Ansatz: Übernehmen Sie die Behebung selbst – idealerweise begleitet durch eine Schulung und mit Unterstützung Ihrer Agentur.
Warum? Weil Sie dabei am echten Material lernen. Sie sehen Ihre eigenen Fehler, verstehen die Zusammenhänge und können das Gelernte sofort anwenden. Das ist nachhaltiger als jede theoretische Schulung.
Unsere dringende Empfehlung: Versuchen Sie, aus der Rolle des „blinden Beifahrers" auszusteigen. Lesen Sie den Audit-Bericht selbst. Versuchen Sie, die Probleme und möglichen Lösungswege zu verstehen – auch wenn nicht alles sofort klar ist.
So entwickeln Sie ein Gespür dafür, wie barrierefreie Inhalte aussehen müssen. Sie erkennen Muster und können künftig Barrieren vermeiden, bevor sie entstehen. Das spart langfristig Kosten für nachträgliche Korrekturen und baut wertvolles internes Know-how auf. Ihre Agentur wird nicht für immer jeden Alt-Text prüfen können – aber Sie können lernen, es selbst richtig zu machen.
Schritt 3: PDF-Dokumente barrierefrei machen
Ein oft unterschätzter Bereich: Wenn Sie PDF-Dokumente zum Download anbieten – Broschüren, Formulare, Preislisten, Anleitungen – müssen auch diese barrierefrei sein. Ein eingescanntes Dokument oder ein aus Word exportiertes PDF ohne Strukturinformationen ist für Screenreader-Nutzer praktisch unbrauchbar.
Barrierefreie PDFs erfordern eine korrekte Tag-Struktur, Lesereihenfolge, Alt-Texte für Grafiken und weitere technische Voraussetzungen. Je nach Umfang Ihres Dokument-Bestands kann das ein erheblicher Aufwand sein. Priorisieren Sie nach Relevanz und Nutzungshäufigkeit.
Schritt 4: Videos mit Untertiteln versehen
Für gehörlose und schwerhörige Menschen sind Untertitel essentiell. Aber auch in lauten Umgebungen oder bei stummgeschalteten Autoplay-Videos profitieren alle Nutzer:innen davon.
Wichtig: Untertitel gehören nicht fest ins Video „eingebrannt". Stattdessen sollten sie als separate Untertitel-Datei (WebVTT oder SRT-Format) bereitgestellt und auf Code-Ebene eingebunden werden. Das ermöglicht:
- Ein- und Ausschalten nach Bedarf
- Anpassung von Schriftgröße und Darstellung
- Mehrsprachige Untertitel für dasselbe Video
- Bessere Durchsuchbarkeit der Inhalte
Die meisten Video-Player und Hosting-Plattformen unterstützen diese Einbindung. Bei YouTube und Vimeo können Sie Untertitel-Dateien direkt hochladen.
Schritt 5: Barrierefreiheitserklärung erstellen
Die Barrierefreiheitserklärung ist für viele Websites gesetzlich vorgeschrieben – und auch darüber hinaus ein Zeichen von Transparenz. Sie informiert Nutzer:innen über den Stand der Barrierefreiheit, bekannte Einschränkungen und Kontaktmöglichkeiten für Feedback.
Die Erklärung sollte enthalten:
- Angaben zum Konformitätsstand (vollständig, teilweise oder nicht konform)
- Auflistung nicht barrierefreier Inhalte mit Begründung
- Einen Feedback-Mechanismus für Nutzer:innen
- Kontaktdaten für Anfragen zur Barrierefreiheit
- Hinweis auf das Durchsetzungsverfahren
Es gibt Generatoren und Vorlagen, die Ihnen bei der Erstellung helfen. Achten Sie aber darauf, dass die Erklärung ehrlich den tatsächlichen Stand Ihrer Website widerspiegelt.
Schritt 6: Regelmäßige Audits einplanen
Barrierefreiheit ist kein Projekt mit Abschlussdatum – sie ist ein fortlaufender Prozess. Besonders wenn Ihre Website nicht statisch ist, sondern kontinuierlich weiterentwickelt wird:
- Neue Inhalte werden eingepflegt
- Funktionen werden ergänzt oder verändert
- Templates und Erweiterungen erhalten Updates
- Externe Einbindungen ändern sich
Jede dieser Änderungen kann neue Barrieren einführen. Planen Sie daher regelmäßige Überprüfungen ein – sei es durch interne Qualitätssicherung, automatisierte Monitoring-Tools oder wiederkehrende externe Audits. Die Frequenz hängt davon ab, wie dynamisch Ihre Website ist.
Barrierefreie Websites mit YOOtheme Pro Page Builder
YOOtheme Pro ist einer der populärsten Page Builder im Joomla-Ökosystem – und erfreulicherweise eine sehr solide Basis für barrierefreie Webangebote. Das Framework liefert sauberes, semantisches HTML und bietet die nötigen Einstellungsmöglichkeiten für Accessibility-relevante Attribute.
Die technische Basis stimmt
YOOtheme Pro generiert strukturierten Code, unterstützt ARIA-Attribute wo nötig und ermöglicht die Pflege von Alt-Texten, Überschriften-Ebenen und anderen accessibility-relevanten Einstellungen direkt im Builder. Damit haben Sie als Website-Betreiber die Werkzeuge in der Hand, um barrierefreie Inhalte zu erstellen.
Aber: Disziplin bei der Content-Pflege ist entscheidend
Die Werkzeuge sind da – nutzen müssen Sie sie selbst. Und genau hier lauern Fallstricke, besonders bei den Überschriften-Hierarchien.
Das Problem: Viele YOOtheme Pro-Elemente bringen Default-Einstellungen mit, die nicht automatisch zu Ihrer Seitenstruktur passen. Das Panel-Element beispielsweise setzt Titel standardmäßig als H3. Das Grid-Element, die Slideshow, der Accordion – alle haben ihre voreingestellten Überschriften-Ebenen.
Diese Defaults sind nicht „falsch" – sie können nur im Kontext Ihrer spezifischen Seite falsch sein. Wenn Sie ein Panel mit H3-Überschriften direkt nach einer H1 platzieren, fehlt die H2-Ebene. Wenn Sie mehrere Elemente mit jeweils eigenen H3-Defaults kombinieren, entstehen schnell chaotische Strukturen.
Die Lösung: Prüfen Sie bei jedem Element bewusst die Überschriften-Einstellung und passen Sie sie an den Kontext an. Fragen Sie sich: Welche Überschrift kam zuletzt? Welche Ebene ist logisch die nächste?
Dem Hersteller ist hier kein Vorwurf zu machen. Der „richtige" HTML-Tag für ein Element ist immer kontextabhängig – abhängig davon, wo auf der Seite es steht und welche anderen Elemente es umgeben. Ein Page Builder kann das nicht wissen. Er kann nur sinnvolle Defaults liefern und Ihnen die Möglichkeit geben, sie anzupassen. Den Rest müssen Sie tun.
FAQ: Barrierefreie Joomla-Website
Ist Joomla von Haus aus barrierefrei?
Teilweise. Das Joomla-Backend wird aktiv nach WCAG-Standards entwickelt und ist für Redakteur:innen mit Einschränkungen gut nutzbar. Das Frontend – also Ihre öffentliche Website – hängt jedoch vom verwendeten Template und der Qualität der Inhaltspflege ab. Joomla liefert die Werkzeuge, aber die Umsetzung liegt bei Ihnen und Ihrem Dienstleister.
Welche Joomla-Templates sind BITV-konform?
Kein Template ist „out of the box" BITV-konform, da Konformität immer die Summe aus Technik, Design und Inhalten ist. Das mitgelieferte Cassiopeia-Template bietet eine solide, semantisch saubere Basis. YOOtheme Pro ermöglicht bei korrekter Nutzung ebenfalls barrierefreie Websites. Entscheidend ist weniger das Template selbst als vielmehr dessen korrekte Konfiguration und die sorgfältige Inhaltspflege.
Wie teste ich meine Joomla-Website auf Barrierefreiheit?
Kombinieren Sie mehrere Ansätze: Automatisierte Tools wie WAVE, axe DevTools oder Lighthouse decken technische Probleme auf. Manuelle Tests mit Tastatur und Screenreader prüfen die praktische Nutzbarkeit. Für eine rechtssichere Bewertung ist ein professioneller manueller Audit durch geschulte Prüfer:innen unerlässlich. Automatisierte Tests allein erfassen nur etwa 30 Prozent möglicher Barrieren.
Was kostet die Umsetzung von BITV 2.0?
Das lässt sich pauschal nicht beantworten. Die Kosten hängen von Faktoren ab wie: Umfang und Komplexität Ihrer Website, aktuellem Zustand der Barrierefreiheit, Menge der Inhalte (besonders PDFs und Videos), ob technische Grundlagen angepasst werden müssen. Ein initialer Audit bewegt sich typischerweise im mittleren bis höheren vierstelligen Bereich. Die Umsetzung der Findings kann je nach Ausgangslage von überschaubaren Anpassungen bis zu grundlegenden Überarbeitungen reichen.
Gilt BITV 2.0 auch für kleine Unternehmen?
Die BITV 2.0 selbst gilt für öffentliche Stellen des Bundes. Das Barrierefreiheitsstärkungsgesetz (BFSG), das seit Juni 2025 greift, betrifft jedoch auch private Unternehmen – mit Ausnahmen für Kleinstunternehmen (weniger als 10 Beschäftigte und maximal 2 Millionen Euro Jahresumsatz). Die Ausnahme gilt zudem nur für bestimmte Dienstleistungen. Prüfen Sie im Einzelfall, ob Ihr Angebot unter die Regelungen fällt.
Wie erstelle ich eine Barrierefreiheitserklärung?
Die Erklärung muss den tatsächlichen Stand Ihrer Website dokumentieren, bekannte Barrieren benennen und einen Feedback-Mechanismus bieten. Der Bund stellt einen Generator für öffentliche Stellen bereit. Für privatwirtschaftliche Websites gibt es verschiedene Vorlagen und Tools. Wichtig: Die Erklärung sollte auf einem echten Audit basieren, nicht auf Vermutungen – und sie muss aktuell gehalten werden.
Case Study: Wie wir den Geschäftskundenbereich von GLS BITV-konform gemacht haben
Ausgangssituation
Der Paketdienstleister GLS betreibt unter gls-pakete.de ein umfangreiches Webportal für Privat- und Geschäftskunden. Im Rahmen der BITV-Anforderungen sollte der Geschäftskundenbereich barrierefrei gestaltet werden – dieser Bereich liegt in unserem Zuständigkeitsbereich, während der Privatkundenbereich separat betreut wird.
Für den Accessibility-Audit arbeiteten wir mit eye-able zusammen, einem spezialisierten Dienstleister für digitale Barrierefreiheit. Wichtig zu erwähnen: Es wurde bewusst kein Overlay-Tool eingesetzt. Stattdessen setzten wir auf echte, nachhaltige Barrierefreiheit durch Anpassungen an Code und Inhalten.
Identifizierte Barrieren
Der initiale Audit deckte ein breites Spektrum an Barrieren auf. Besonders zwei Bereiche erforderten intensive Arbeit:
- Formulare stellten sich als kritischer Bereich heraus. Der Geschäftskundenbereich enthält zahlreiche komplexe Formulare – von der Sendungsverfolgung über Versandtools bis hin zu Registrierungs- und Kontaktformularen. Label waren gemäß Styleguide nicht permanent sichtbar, Fehlermeldungen waren nicht ausreichend kommuniziert, und die Fokus-Führung entsprach nicht den Anforderungen.
- Tastaturbedienbarkeit war der zweite Schwerpunkt. Interaktive Elemente, Dropdown-Menüs und modale Dialoge funktionierten nicht durchgängig ohne Maus. Fokus-Zustände waren teilweise nicht sichtbar oder sprangen unlogisch über die Seite.
Daneben fanden sich die üblichen Findings: Kontrast-Probleme an einzelnen Stellen, fehlende oder unzureichende Alt-Texte, Überschriften-Strukturen, die nicht der logischen Hierarchie folgten.
Umgesetzte Maßnahmen
Die Behebung erfolgte systematisch entlang des Audit-Protokolls:
- Vollständige Überarbeitung der Formular-Komponenten mit Floating Labels, verständlichen Fehlermeldungen und logischer Fokus-Führung
- Implementierung durchgängiger Tastaturnavigation für alle interaktiven Elemente
- Anpassung von Farbkontrasten im Template
- Ergänzung und Überarbeitung von Alt-Texten und Überschriften-Strukturen
- Einrichtung eines fortlaufenden Monitorings, um neue Barrieren bei Content-Änderungen frühzeitig zu erkennen
Ergebnisse
Pünktlich zum Inkrafttreten der gesetzlichen Anforderungen konnte GLS seinen Geschäftskunden ein barrierefreies Webangebot präsentieren. Der Bereich erfüllt die BITV-Anforderungen und wird durch kontinuierliches Monitoring auf diesem Stand gehalten.
Das Projekt zeigt exemplarisch, wie der Weg zur barrierefreien Website aussieht: fundierter Audit, systematische Abarbeitung, nachhaltige Prozesse für die Zukunft. Keine Abkürzungen, keine Overlay-Lösungen – sondern echte Barrierefreiheit.
Tools & Ressourcen
Für Ihre Arbeit an der Barrierefreiheit Ihrer Joomla-Website stehen Ihnen zahlreiche hilfreiche Werkzeuge zur Verfügung:
Prüf- und Test-Tools
- BITV-Test – Das umfassende deutsche Testverfahren auf Basis der WCAG, mit detaillierten Prüfschritten und Bewertungsschema. Die Selbstbewertung ist kostenlos nutzbar.
bitvtest.de - WAVE Accessibility Tool – Browser-Erweiterung und Online-Tool, das Accessibility-Probleme direkt auf der Seite visualisiert. Besonders nützlich für schnelle Überprüfungen.
wave.webaim.org - axe DevTools – Mächtige Browser-Erweiterung für tiefgehende Accessibility-Analysen, integriert sich in die Entwicklertools. Auch als Grundlage vieler anderer Tools genutzt.
deque.com/axe/devtools - Lighthouse Accessibility Audit – Bereits in Chrome integriertes Audit-Tool (DevTools → Lighthouse), prüft neben Performance auch Accessibility und liefert konkrete Verbesserungsvorschläge.
- Colour Contrast Analyser (CCA) – Standalone-Tool zur präzisen Prüfung von Farbkontrasten, auch für Elemente, die Browser-Tools nicht erfassen können.
tpgi.com/color-contrast-checker
Joomla-spezifische Ressourcen
Joomla Accessibility Working Group – Die offizielle Arbeitsgruppe innerhalb des Joomla-Projekts, die sich um Accessibility im Core kümmert. Hier finden Sie Dokumentation, können Probleme melden und sich einbringen.
volunteers.joomla.org/teams/accessibility-team
