WordPress Barrierefreiheit Audit mit Avada Theme

Case Study · Digitale Barrierefreiheit

WordPress Barrierefreiheit Audit mit Avada Theme

Branche: Fertigung / Handwerk
Technologie: WordPress, Avada Theme, Fusion Builder
Umfang: 18 Seiten, 11 Kundenstimmen-Seiten, 2 Beiträge
Prüfschwerpunkte: Tastaturbedienung, Fokusführung, Screenreader-Kompatibilität, Formulare, Semantik
Kontext

Das WordPress Barrierefreiheit Audit auf einen Blick

  • Mehrere kritische Barrieren in der Tastaturbedienung, darunter Fokusfallen in Karussells und fehlerhafte Skip-Link-Ziele
  • Inhalte teilweise für Screenreader nicht oder nur unvollständig zugänglich, insbesondere in Formularen und interaktiven Bereichen
  • Semantische Struktur unvollständig, wodurch zentrale Navigations- und Landmark-Funktionen fehlen
  • Wiederkehrende Probleme durch den eingesetzten Builder, nicht durch einzelne Einzelfehler
  • Maßnahmen sind gezielt umsetzbar, ohne kompletten Relaunch der Website
Kontext

Kurze Einordnung des Barrierefreiheit Audits

Diese Fallstudie zeigt die Ergebnisse einen WordPress Barrierefreiheit Audit im Fertigungsumfeld. Die Website wurde mit dem Avada Theme und dem Fusion Builder umgesetzt und war visuell modern aufgebaut, wies jedoch mehrere strukturelle und semantische Barrieren auf.

Im Fokus der Prüfung standen Tastaturbedienbarkeit, Fokusführung, Screenreader-Kompatibilität, Formularverhalten sowie die semantische Auszeichnung zentraler Seitenbereiche. Die Analyse basiert auf den Anforderungen der WCAG 2.2 (Level A und AA) und berücksichtigt typische Problemfelder, die bei visuell stark builder-basierten WordPress-Setups auftreten.

Ziel der Untersuchung war es, konkrete Barrieren nachvollziehbar zu identifizieren, ihre Auswirkungen auf reale Nutzungssituationen einzuordnen und priorisierte technische Maßnahmen abzuleiten.
Analyse

Erkannte Probleme im WordPress Barrierefreiheit Audit

Fokusführung und Tastaturnavigation

Skip-Link mit falschem Fokusziel: Der Skip-Link „Zum Hauptinhalt springen" war vorhanden – ein guter Ansatz. Das Fokusziel war jedoch nicht korrekt angelegt. Nach Aktivierung sprang der Fokus auf den Slider statt auf den eigentlichen Seiteninhalt. Nutzende, die ausschließlich per Tastatur navigieren, mussten sich trotzdem durch alle Slider-Elemente durcharbeiten.
Slider und Carousels nicht per Tastatur bedienbar: Auf sieben von achtzehn Seiten war ein Bild-Slider vorhanden. Die einzelnen Slides waren per Tastatur nicht erreichbar, die Inhalte damit für Tastaturnutzende nicht zugänglich. Auf den Kundenstimmen-Seiten kam ein weiteres Problem hinzu: Das Karussell war eine Tastaturfalle. Wer hineintabte, kam nicht mehr heraus, der Fokus blieb gefangen.
WordPress Barrierefreiheit Audit: Screenshot einer Website zeigt unvollständige Link-Kennzeichnung
Fehlerhafte Fokusreihenfolge bei den Prozessschritten: Ein Abschnitt mit Prozessschritten zeigte eine Fokusreihenfolge, die nicht dem visuellen Layout entsprach. Der Fokus sprang zwischen linker und rechter Spalte hin und her, anstatt linear von oben nach unten zu verlaufen.
Auswirkungen für Nutzende: Wer die Website ohne Maus bedient, kann zentrale Inhalte nicht oder nur eingeschränkt erreichen. Wer in das Karussell navigiert, kommt ohne Maus nicht mehr weiter. Die fehlerhafte Fokusreihenfolge führt zu Orientierungsverlust und macht das Verständnis von Prozessabläufen schwerer.

Links und Linkauszeichnung

Links nicht ausreichend unterscheidbar Mehrere Links waren ausschließlich durch Farbe von normalem Fließtext unterschieden. Eine zusätzliche Unterstreichung fehlte. Für Menschen mit eingeschränkter Farbwahrnehmung waren diese Links nicht als solche erkennbar.
WordPress Barrierefreiheit Audit: Screenshot einer Website zeigt unvollständige Link-Kennzeichnung
Textstellen ohne semantische Linkauszeichnung Vier Elemente mit dem Begriff „Fertigung" wiesen Linkverhalten auf, waren technisch aber nicht als Links ausgezeichnet. Screenreader lasen diese Stellen als normalen Text vor, die Interaktionsmöglichkeit war nicht erkennbar.
Auswirkungen für Nutzende: Menschen mit Farbfehlsichtigkeit übersehen möglicherweise Navigationsmöglichkeiten. Screenreader-Nutzende erhalten an diesen Stellen keinen Hinweis darauf, dass eine Interaktion möglich ist.

Formulare

Pflichtfeldkennzeichnung irreführend: Das Kontaktformular kennzeichnete das Telefon-Feld als Pflichtfeld. Das Formular ließ sich jedoch auch ohne Telefonnummer absenden. Diese Inkonsistenz verunsichert Nutzende und kann dazu führen, dass Kontaktaufnahmen abgebrochen werden.
Fehler- und Hinweiskommunikation unvollständig: Hinweise, Fehlermeldungen und die Gesamtstruktur des Formulars wurden nicht vollständig an Hilfstechnologien übermittelt. Nutzende mit Screenreader erhielten unvollständige oder keine Rückmeldung bei Eingabefehlern.
Auswirkungen für Nutzende: Wer auf einen Screenreader angewiesen ist, bekommt beim Ausfüllen des Formulars keine zuverlässige Rückmeldung. Fehlermeldungen werden nicht oder nur teilweise vorgelesen. Das führt dazu, dass Nutzende nicht wissen, was sie korrigieren sollen, und das Formular unter Umständen gar nicht abschicken können.

Visuelles Verhalten

Layout-Shift durch Hover-Effekt: Im Bereich „Über uns" veränderte ein Hover-Effekt die Schriftstärke des Textes. Da die fettere Schrift mehr Platz benötigt, verschob sich das umliegende Layout beim Darüberfahren.
Auswirkungen für Nutzende: Für Menschen mit motorischen Einschränkungen oder kognitiven Beeinträchtigungen sind unerwartete Layout-Verschiebungen störend und können die Orientierung auf der Seite erschweren.

Alternativtexte

Eine Stichprobe der Alternativtexte zeigte ein uneinheitliches Bild. Manche Texte beschrieben den Inhalt nicht korrekt, andere waren ungewöhnlich lang. Eine vollständige Prüfung und individuelle Überarbeitung aller Bilder wurde empfohlen.
Auswirkungen für Nutzende: Screenreader-Nutzende erhalten an diesen Stellen keine hilfreiche Bildbeschreibung oder werden durch zu lange, unstrukturierte Texte unnötig belastet.

Seitenstruktur und Semantik

Fehlende Footer-Auszeichnung: Die Fußzeile der Website war nicht als semantisches Footer-Element ausgezeichnet. Screenreader nutzen solche Landmark-Elemente zur schnellen Orientierung auf einer Seite. Ohne diese Auszeichnung müssen Nutzende den gesamten Seiteninhalt linear durchlaufen, um zur Fußzeile zu gelangen.
Auswirkungen für Nutzende: Die Orientierung per Screenreader wird deutlich erschwert. Bereiche wie Kontakt, Impressum oder Navigation in der Fußzeile sind ohne zusätzlichen Aufwand nicht direkt erreichbar.
Auswirkungen

Wer konkret davon betroffen ist

Mangelnde Barrierefreiheit auf Pflege-Websites haben reale Konsequenzen. Sie schließen echte Menschen von wichtigen Informationen und Kontaktmöglichkeiten aus:

Sehbehinderung

Screenreader-Programme können Formulare und Bilder nicht interpretieren. Die Suche nach einer Pflegeeinrichtung schlägt fehl – bevor sie begonnen hat.


Ältere Nutzer

Zu schwacher Kontrast macht Texte und Buttons unlesbar. Wer ohnehin mit nachlassender Sehkraft kämpft, gibt auf.

Motorische Einschränkung

Ohne funktionierende Tastaturnavigation ist die Website für Menschen, die keine Maus benutzen können, schlicht gesperrt.

Pflegende Angehörige

In einer der emotional belastendsten Lebenssituationen suchen sie unter Druck nach einer Einrichtung – oft mobil, oft abends, keine Zeit für unübersichtliche Websites.

Verbesserungsansätze

Empfohlene Maßnahmen

Tastaturfalle im Karussell beheben

Kontaktformular überarbeiten: Pflichtfeld-Logik, Fehlerausgabe, Struktur

Nicht ausgezeichnete Links semantisch korrigieren

Linkunterstreichungen ergänzen

Skip-Link-Ziel korrekt setzen

Footer semantisch korrekt auszeichnen und Struktur bereinigen

Fokusreihenfolge bei Prozessschritten anpassen

Alternativtexte individuell prüfen und überarbeiten

Hover-Effekt anpassen oder entfernen

Fazit

Die Website zeigte ein typisches Muster bei mit Avada erstellten Seiten. Der Fusion Builder ermöglicht visuell flexible Layouts, übernimmt aber keine Verantwortung für semantische Korrektheit oder Tastaturzugänglichkeit. Viele der gefundenen Probleme waren keine Einzelfehler, sondern traten in ähnlicher Form auf mehreren Unterseiten gleichzeitig auf. Eine gezielte Überarbeitung ist in diesem Fall realistisch umsetzbar, ohne die Website grundlegend neu aufzubauen.
Diese Fallstudie basiert auf einer anonymisierten Barrierefreiheits-Analyse. Geprüft wurden Tastaturbedienung, Screenreader-Verhalten (VoiceOver Utilities), Kontrastverhalten und semantische Struktur.

Grundlage: WCAG 2.2, Erfolgskriterien Level A und AA.
LeistungsübersichtBeratungsgespräch vereinbaren