BEISPIEL-BERICHT – so sieht dein persönlicher Barrierefreiheits-Check aus. Hier mit einer fiktiven Firma (Stadtbäckerei Sonnenmehl) zur Veranschaulichung – dein echter Bericht zeigt deine Seite mit echten Screenshots.
Barrierefreiheits-Check
Dein Ergebnis im Klartext
Geprüft: stadtbaeckerei-sonnenmehl.deSystem: WordPressDatum: 27. Juni 2026
Deine Seite macht einen einladenden Eindruck und lädt zum Stöbern ein. Bei der Barrierefreiheit gibt es aber einige wichtige Baustellen, die Menschen mit Hilfsprogrammen aktuell aussperren – allen voran fehlende Bildbeschreibungen, ein Bedien-Knopf ohne Beschriftung und ein Kontaktfeld ohne Label. Das meiste davon ist mit überschaubarem Aufwand zu beheben.
Mehrere wichtige, aber gut behebbare Baustellen im maschinell prüfbaren Teil.
3
Kritisch
3
Ernst
0
Moderat
0
Gering
1
Hinweise
Diese Seiten wurden geprüft 4
Die Prüfung lief über alle folgenden Seiten — die Bilder oben zeigen stellvertretend die Startseite.
So sehen Besucher deine Seite zuerst — mit Bannern & Pop-upsDer eigentliche Inhalt — nach dem Schließen
Die wichtigsten Punkte 6 Punkte
Nach Dringlichkeit sortiert — fang oben an.
1Bilder ohne Beschreibung (Alt-Text)4 Bilder auf der Startseite
2Bedien-Knopf ohne Beschriftung1 Knopf im Seitenkopf
3Kontaktfeld ohne Beschriftung1 Feld im Kontaktformular
4Zu schwacher Farbkontrast7 Textstellen auf der Startseite
5Links ohne erkennbaren Text2 Links im Fußbereich
6Liste technisch nicht sauber aufgebaut1 Liste im Fußbereich
Kritisch3
1
Bilder ohne Beschreibung (Alt-Text)
Betrifft: 4 Bilder auf der Startseite
4 Bilder – darunter dein großes Titelbild und die Fotos der Backstube – haben keinen hinterlegten Alternativtext.
Gefundene Stelle auf deiner Seite
Blinde und stark sehbehinderte Menschen nutzen Vorleseprogramme. Ohne Beschreibung sagt das Programm nur „Bild“ oder liest den Dateinamen vor – deine appetitlichen Fotos kommen so gar nicht an.
So behebst du es
Hinterlege zu jedem Bild eine kurze, treffende Beschreibung (z. B. „Frisch gebackenes Roggenbrot auf Holzbrett“). In WordPress geht das in der Mediathek im Feld „Alternativtext“ oder direkt im Block-Editor, wenn du ein Bild anklickst. Rein dekorative Bilder bekommen einen leeren Alternativtext.
2
Bedien-Knopf ohne Beschriftung
Betrifft: 1 Knopf im Seitenkopf
Der Menü-Knopf oben rechts (das Symbol mit den drei Strichen) hat keinen für Hilfsprogramme lesbaren Text.
Gefundene Stelle auf deiner Seite
Wer die Seite per Tastatur oder Vorleseprogramm bedient, hört nur „Schaltfläche“ und weiß nicht, dass sich dahinter das Menü öffnet.
So behebst du es
Gib dem Knopf eine unsichtbare, aber vorlesbare Beschriftung über ein aria-label="Menü öffnen". In WordPress steckt dieser Knopf meist im Theme (Header-Bereich) oder lässt sich über die Theme-Einstellungen anpassen; viele Themes bieten dafür bereits ein Feld.
3
Kontaktfeld ohne Beschriftung
Betrifft: 1 Feld im Kontaktformular
Das Nachrichten-Feld in deinem Kontaktformular hat keine fest zugeordnete Beschriftung.
Gefundene Stelle auf deiner Seite
Vorleseprogramme können dann nicht ansagen, was in das Feld gehört. Menschen, die das Formular nicht sehen, wissen nicht, dass hier ihre Nachricht hineingehört.
So behebst du es
Ordne dem Feld eine sichtbare Beschriftung zu (z. B. „Deine Nachricht“). Nutzt du ein Formular-Plugin wie Contact Form 7 oder WPForms, trägst du die Beschriftung einfach im Label-Feld des Bausteins ein – das verbindet Label und Eingabefeld automatisch.
Ernst3
4
Zu schwacher Farbkontrast
Betrifft: 7 Textstellen auf der Startseite
An 7 Stellen ist der Kontrast zwischen Text und Hintergrund zu gering – etwa die hellgrauen Beschreibungstexte auf dem hellen Hintergrund.
Gefundene Stelle auf deiner Seite
Menschen mit eingeschränktem Sehvermögen – und alle bei Sonnenlicht am Handy – können solchen Text kaum lesen.
So behebst du es
Dunkle die betroffenen Textfarben ab, bis der Kontrast mindestens 4,5:1 erreicht (für normalen Text). In WordPress passt du das im Customizer unter „Farben“ oder im Theme an. Ein kostenloser Kontrast-Prüfer im Netz zeigt dir schnell, ob es reicht.
5
Links ohne erkennbaren Text
Betrifft: 2 Links im Fußbereich
2 Links – deine Social-Media-Symbole im Fußbereich – haben keinen lesbaren Linktext, nur ein Symbol.
Gefundene Stelle auf deiner Seite
Im Vorleseprogramm erscheinen sie als „Link“ ohne Ziel. Nutzer wissen nicht, wohin der Link führt (Facebook? Instagram?).
So behebst du es
Gib jedem Symbol-Link eine vorlesbare Beschriftung über ein aria-label (z. B. „Sonnenmehl auf Instagram“). In WordPress meist im Footer-Bereich des Themes oder im Social-Icons-Block einstellbar.
6
Liste technisch nicht sauber aufgebaut
Betrifft: 1 Liste im Fußbereich
Die Liste deiner Social-Media-Symbole enthält Elemente, die laut Technik nicht direkt in eine Liste gehören.
Gefundene Stelle auf deiner Seite
Vorleseprogramme kündigen Listen an („Liste mit 2 Einträgen“) und helfen bei der Orientierung. Ist der Aufbau fehlerhaft, geht diese Hilfe verloren.
So behebst du es
Sorge dafür, dass in der Liste direkt nur Listenpunkte (<li>) liegen und die Links darin verschachtelt sind. Bei einem Standard-Theme genügt meist der vorgesehene Social-Icons-Block; bei einer eigenen Anpassung korrigierst du das im Footer-Template.
Weitere Hinweise
Das Zoomen am Smartphone ist unterbunden (user-scalable=no im Viewport-Tag). Menschen, die Inhalte vergrößern müssen, werden so ausgebremst – entferne maximum-scale und user-scalable aus dem Viewport-Tag im Theme-Kopfbereich.
Ein ehrlicher Hinweis
Lass dich nicht von „Ein-Klick“-Widgets oder Overlays einfangen (z. B. accessiBe und ähnliche Anbieter): sie blenden zwar ein Symbol ein, beheben die eigentlichen Probleme im Quelltext aber nicht – teils verschlechtern sie die Bedienung für Menschen mit Hilfsprogrammen sogar. Echte Verbesserungen entstehen durch Korrekturen an der Seite selbst, wie oben beschrieben.
Was dieser Check leistet — und was nicht
Dieser Check prüft automatisch den maschinell testbaren Teil der anerkannten Kriterien (WCAG) – je nach Seite etwa 30 bis 50 Prozent. Punkte wie verständliche Sprache, sinnvolle Reihenfolge bei der Tastatur-Bedienung oder Untertitel lassen sich nur von Hand beurteilen. Dieser Bericht ist eine technische Auswertung und ersetzt keine rechtliche Prüfung oder Zertifizierung.
Wenn du möchtest, übernehme ich die Umsetzung der genannten Punkte für dich oder gehe sie gemeinsam mit dir durch – melde dich einfach.
Diesen Bericht für deine eigene Seite?
Ich prüfe deine Website, markiere die Stellen im Screenshot und erkläre verständlich, was zu tun ist – als Online-Bericht und PDF.
