Kompliziert?<\/p>\n\n\n\n
Ja.<\/p>\n\n\n\n
Machen wir es einfacher:<\/p>\n\n\n\n
Disclaimer:<\/strong> Da das ziemlich verwirrend beschrieben ist, versuchen wir es hier doch mal m\u00f6glichst einfach zu formulieren:<\/p>\n\n\n\n Du bist nicht betroffen, wenn:<\/strong><\/p>\n\n\n\n oder<\/p>\n\n\n\n In diesen F\u00e4llen bist du nicht verpflichtet, deine Website nach den Vorgaben des BFSG anzupassen. Nat\u00fcrlich kannst du dich aber auch in diesem Fall um die vorgegebenen Ma\u00dfnahmen zur Barrierefreiheit k\u00fcmmern.<\/p>\n\n\n\n Es gibt aber auch Ausnahmen, beispielsweise f\u00fcr Beh\u00f6rden und weitere, die trotz dieser Einschr\u00e4nkungen betroffen sind.<\/p>\n\n\n\n Du bist betroffen, wenn:<\/strong><\/p>\n\n\n\n und<\/p>\n\n\n\n Das sollte also Websites mit Online-(Termin)Buchungs- oder Kaufm\u00f6glichkeiten einbeziehen.<\/p>\n\n\n\n Auf gut Deutsch:<\/p>\n\n\n\n Jede Website mit Formularen, Buchungs-Tools, Terminbuchungstools, Online-Shops.<\/p>\n\n\n\n Einen Check, ob du betroffen bist und eine \u00fcbersichtliche Aufbereitung des gesamten Gesetzes findest du bei bfsg-gesetz.de<\/a>.<\/p>\n\n\n\n WordPress hat von Haus aus einen Fokus auf Barrierefreiheit<\/a> gelegt, auch wenn hier nicht alle Bereich perfekt umgesetzt sind. Zudem fokussieren sich auch gute Plugins und Themes darauf, m\u00f6glichst viele Ma\u00dfnahmen umzusetzen.<\/p>\n\n\n\n Grunds\u00e4tzlich solltest du also vor allem ein Theme und Plugins w\u00e4hlen, die ebenfalls Barrierefreiheit zum Ziel haben.<\/p>\n\n\n\n Einzelne Ma\u00dfnahmen kannst du sicherlich selber umsetzen, wenn du aber zur Umsetzung des BFSG verpflichtet bist, wirst du vermutlich schnell mit den verschiedenen Anforderungen \u00fcberfordert sein.<\/p>\n\n\n\n Ich kann nur empfehlen, dass du dich hierf\u00fcr an einen Profi wendest.<\/p>\n\n\n\n Die Pr\u00fcfung der einzelnen Punkte und die Umsetzung der Pflichtma\u00dfnahmen ist rein technisch sehr anspruchsvoll und zudem super zeitintensiv.<\/p>\n\n\n\n W\u00e4hrend einzelne Ma\u00dfnahmen, wie beispielsweise das Hinterlegen von Alt-Texten f\u00fcr Bilder ohne gr\u00f6\u00dfere technische F\u00e4higkeiten (oder per KI sogar ohne gr\u00f6\u00dferen Zeitaufwand) m\u00f6glich sind, wird es insbesondere bei Anpassungen auf Code-Ebene, wie du zur sauberen Navigation per Tastatur oder der programmatisch korrekten Benennung interaktiver Elemente sehr schnell sehr \u00fcberfordernd.<\/p>\n\n\n\n Und nein, ich will dich hier nicht \u00fcberzeugen, mich damit zu beauftragen.<\/p>\n\n\n\n Ich biete das nicht an.<\/p>\n\n\n\n Sobald ich Anbieter finde, die ich empfehlen kann, werde ich sie hier auflisten.<\/p>\n\n\n\n Das BFSG selber hat gar keine Ma\u00dfnahmen formuliert, die konkreten Anforderungen orientieren sich an der Europ\u00e4ische Norm (EN) 301 549<\/a> zur digitalen Barrierefreiheit, worin wiederum auf die Web Content Accessibility Guidelines (WCAG)<\/a> der Level A und AA verwiesen wird.<\/p>\n\n\n\n Die konkreten Ma\u00dfnahmen sind auf der Website der Web Content Acceessibility Guidelines (ACAG) 2.2 beschrieben<\/a>.<\/p>\n\n\n\n Das ist eine unglaublich lange Liste mit super vielen Punkten.<\/p>\n\n\n\n Eine Menge dieser Anforderungen sind bei WordPress Websites, Plugins und Themes automatisch umgesetzt, andere m\u00fcssen nachtr\u00e4glich gepr\u00fcft und umgesetzt werden.<\/p>\n\n\n\n Ich fasse dir die wichtigen Ma\u00dfnahmen hier mal so kurz und erkl\u00e4rend wie m\u00f6glich zusammen, die Liste ist aber nicht vollst\u00e4ndig mit den (gef\u00fchlt) hunderten Ma\u00dfnahmen.<\/p>\n\n\n\n Meiner pers\u00f6nlichen Meinung bist du aber mit der Erf\u00fcllung der folgenden Anforderungen sehr gut unterwegs und sorgst f\u00fcr wichtige Ma\u00dfnahmen zur Barrierefreiheit.<\/p>\n\n\n\n Ich teile die Anforderungen in vier Kategorien ein:<\/p>\n\n\n\n Diese Ma\u00dfnahmen & Anforderungen betreffen die visuelle Darstellung der Website.<\/p>\n\n\n\n Alle bedeutungstragenden Bilder m\u00fcssen mit einem Alt-Text<\/em> versehen sein (WCAG 1.1.1<\/a>). <\/p>\n\n\n\n „Bedeutungstragend“ ist nicht weiter definiert. Ich w\u00fcrde sagen, das k\u00f6nnte alle Bilder au\u00dfer denen betreffen, die nicht f\u00fcr das Verst\u00e4ndnis des Inhalts notwendig sind.<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Der Kontrast muss mindestens 4,5:1<\/strong> f\u00fcr normalen Text, 3:1<\/strong> f\u00fcr gro\u00dfe Schrift und Bedienelemente betragen (WCAG 1.4.3<\/a>, 1.4.11)<\/a>.<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Inhalte m\u00fcssen bei 200 % Vergr\u00f6\u00dferung<\/strong> nutzbar bleiben, ohne dass Funktionen verloren gehen (WCAG 1.4.4<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Information darf nicht ausschlie\u00dflich \u00fcber Farbe vermittelt werden (z. B. rote Fehlermeldungen ohne zus\u00e4tzlichen Text) (WCAG 1.4.1<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Videos ben\u00f6tigen Untertitel<\/strong> f\u00fcr geh\u00f6rlose Nutzer (WCAG 1.2.2<\/a>). Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Diese Ma\u00dfnahmen & Anforderungen beziehen sich darauf, dass deine Website einfach bedienbar ist.<\/p>\n\n\n\n Alle interaktiven Elemente (Links, Buttons, Formulare) m\u00fcssen per Tastatur erreichbar und bedienbar sein (WCAG 2.1.1<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Aktuell fokussierte Elemente (z. B. Links oder Formulare) m\u00fcssen visuell hervorgehoben werden (WCAG 2.4.7<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Autoplay von Videos\/Audio ist verboten, es muss eine M\u00f6glichkeit geben, es zu pausieren oder zu stoppen (WCAG 1.4.2<\/a>, 2.2.2<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Jedes Eingabefeld ben\u00f6tigt eine eindeutige Beschriftung ( Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Nutzer m\u00fcssen informiert werden, was falsch ist und wie es korrigiert werden kann (WCAG 3.3.1<\/a>, 3.3.3<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Diese Ma\u00dfnahmen & Anforderungen sorgen daf\u00fcr, dass deine Website-Inhalte verst\u00e4ndlich und klar sind.<\/p>\n\n\n\n Links wie \u201eHier klicken\u201c sind unzul\u00e4ssig. Der Linktext muss aussagekr\u00e4ftig sein (WCAG 2.4.4<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Bedienelemente mit gleicher Funktion m\u00fcssen gleich bezeichnet und gestaltet sein (WCAG 3.2.3<\/a>, 3.2.4<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Wiederkehrende Navigations-Elemente m\u00fcssen auf allen Seiten in der gleichen Reihenfolge und mit den gleichen Namen erscheinen. (WCAG 3.2.3<\/a>)<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Die Hauptsprache der Webseite muss im HTML-Code definiert sein (lang=“de“ f\u00fcr Deutsch), zudem m\u00fcssen W\u00f6rter oder Phrasen in anderen Sprachen im Code definiert sein. (WCAG 3.1.1<\/a>, 3.1.2<\/a>)<\/p>\n\n\n\n Beispiel:<\/strong> Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Diese Ma\u00dfnahmen & Anforderungen helfen technischen Hilfsger\u00e4ten und Technologien, die Website zu verstehen.<\/p>\n\n\n\n Der HTML-Code muss valide sein und ARIA-Attribute m\u00fcssen korrekt eingesetzt werden (WCAG 4.1.2<\/a>).<\/p>\n\n\n\n Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Buttons, Formulare und interaktive Elemente m\u00fcssen f\u00fcr Screenreader erkennbar sein (z. B. Pr\u00fcfung:<\/strong> Umsetzung:<\/strong> Formulare m\u00fcssen Screenreadern mitteilen, wenn eine Eingabe fehlerhaft ist (WCAG 4.1.3)<\/a>.<\/p>\n\n\n\n Hier sind optionale weitere Ma\u00dfnahmen, die zur Barrierefreiheit einer Website beitragen, aber durch das BFSG nicht verpflichtend sind.<\/p>\n\n\n\n F\u00fcr Unternehmen nicht gesetzlich vorgeschrieben (nur f\u00fcr Beh\u00f6rden), aber hilfreich f\u00fcr Transparenz.<\/p>\n\n\n\n BFSG verlangt keine Inhalte in Leichter Sprache, aber es erleichtert die Nutzung f\u00fcr Menschen mit kognitiven Einschr\u00e4nkungen.<\/p>\n\n\n\n \u00d6ffentliche Stellen m\u00fcssen sie anbieten, Unternehmen nicht \u2013 aber sie verbessern die Zug\u00e4nglichkeit f\u00fcr geh\u00f6rlose Nutzer.<\/p>\n\n\n\n Das Barrierefreiheitsst\u00e4rkungsgesetz fordert \u201eZoom bis 200 %\u201c, aber individuelle Anpassungsm\u00f6glichkeiten sind hilfreich f\u00fcr Sehbehinderte.<\/p>\n\n\n\n W\u00e4hrend klare Fehlermeldungen Pflicht sind, sind z.\u202fB. Live-Validierungen oder Tooltip-Hilfen optional, aber sinnvoll.<\/p>\n\n\n\n Wird vom WCAG nicht explizit gefordert, erleichtert aber die Navigation f\u00fcr Screenreader-Nutzer.<\/p>\n\n\n\n Z.\u202fB. gr\u00f6\u00dfere Schaltfl\u00e4chen, alternative Bedienkonzepte (nicht Pflicht, aber verbessert Nutzbarkeit).<\/p>\n\n\n\n Nat\u00fcrlich gibt es einige Plugins, Tools und Anbieter, die dich bei der Umsetzung gewisser Ma\u00dfnahmen unterst\u00fctzen.<\/p>\n\n\n\n Sie helfen in der Regel bei der Umsetzung einiger Vorgaben des Barrierefreiheitsst\u00e4rkungsgesetzes und sorgen zudem f\u00fcr eine verbesserte Barrierefreiheit, allerdings kenne ich kein Tool, dass dir wirklich einfach alles abnimmt.<\/p>\n\n\n\n Tobi, Nina und das weitere Team helfen dir mit ihren Kursen entweder dabei, selber Barrierefreiheit mit WordPress zu lernen und umzusetzen, oder nehmen dir mit Angeboten wie einem Quick-Check auch einen Teil der Arbeit ab.<\/p>\n\n\n\n Wenn du das m\u00f6chtest, bilden sie dich in drei Monaten sogar zum Barrierefreiheits-Experten<\/a> aus:<\/p>\n\n\n\n Die Google PageSpeed Insights haben einen Bericht f\u00fcr Barrierefreiheit mit im Tool integriert:<\/p>\n\n\n\n Du kannst hier sehen, welche Anforderungen deine Website schon erf\u00fcllt und welche nicht. Allerdings werden hier nicht alle Anforderungen getestet.<\/p>\n\n\n\n Alternativ kannst du das Ganze auch \u00fcber die Entwickler-Konsole in Google Chrome mit Lighthouse machen:<\/p>\n\n\n\n Das kostenlose Plugin stellt dir ein paar n\u00fctzliche Funktionen zur Verf\u00fcgung, um einige Vorgaben des BFSG zu erf\u00fcllen.<\/p>\n\n\n\n Es behebt einige Probleme, die in Themes in Bezug auf die Barrierefreiheit h\u00e4ufig gemacht werden.<\/p>\n\n\n\n Zudem kannst du mit dem Plugin eine Sidebar aktivieren, mit der deine Seitenbesucher unter anderem die Schriftgr\u00f6\u00dfe anpassen oder den Kontrast erh\u00f6hen k\u00f6nnen.<\/p>\n\n\n\n DigiAccess<\/a> bietet neben verschiedenen Leistungen zur Barrierefreiheit eine Assistenzsoftware, die deiner Website eine Menge Einstellungen f\u00fcr die barrierefreie Bedienung hinzuf\u00fcgt. <\/p>\n\n\n\n Beispielsweise gibt es Optionen, Animationen zu deaktivieren, einen Schwarz-Wei\u00df-Modus zu aktivieren, die Tastatursteuerung zu aktivieren, die Website f\u00fcr Screenreader zu optimieren und mehr:<\/p>\n\n\n\n
Ich bin weder ein Rechtsexperte noch darf ich rechtliche Empfehlungen oder Beratung geben. Ich stelle mich auch in keiner Weise als ein solcher dar. Alle Informationen basieren auf meiner ausf\u00fchrlichen Recherche zum BFSG, der Norm 301 549 und den WCAG in den Stufen A und AA. Pr\u00fcfe selber, ob du betroffen bist und welche Ma\u00dfnahmen gelten.<\/p>\n\n\n\nWelche Websites betrifft das BFSG – muss ich handeln?<\/h2>\n\n\n\n
\n
\n
\n
\n
Wie setzt man diese ganzen Ma\u00dfnahmen um?<\/h2>\n\n\n\n
Pflicht: das muss f\u00fcr das BFSG umgesetzt werden<\/h2>\n\n\n\n
\n
Ma\u00dfnahmen zur Wahrnehmbarkeit<\/h3>\n\n\n\n
Alternativtexte f\u00fcr Bilder<\/h4>\n\n\n\n
Am besten mit einem ordentlichen SEO-Tool wie ahrefs, SEMrush, Sistrix etc., das die gesamte Website pr\u00fcft. Alternativ kannst du dir das kostenlose „Image Alt Text<\/a>“ Plugin anschauen.<\/p>\n\n\n\n
In WordPress gibt es f\u00fcr jedes Medium das Feld „Alternativtext“, das du m\u00f6glichst beschreibend ausf\u00fcllen solltest. Stelle dir vor, du erkl\u00e4rst jemandem das Bild, ohne dass die Person es sieht.<\/p>\n\n\n\nAusreichender Farbkontrast<\/h4>\n\n\n\n
Hast du einen Text in Verdacht, kannst du in Google Chrome per Rechtsklick \u2192 „Untersuchen“ anklicken, dann das ganz linke Icon mit dem Pfeil und der gestrichelten Umrandung anklicken und anschlie\u00dfend mit dem Cursor \u00fcber den Text fahren. Du siehst in dem Tooltip anschlie\u00dfend die Kontrast-Bewertung.
Alternativ kannst du eine ganze URL mit PageSpeed Insights<\/a> pr\u00fcfen.<\/p>\n\n\n\n
Bearbeite deine Textfarben und Hintergr\u00fcnde, um einen guten Kontrast zu erreichen.<\/p>\n\n\n\nText-Zoom und Anpassung<\/h4>\n\n\n\n
Nutze deinen Browser-Zoom (CMD + „+“), um deine Website auf 200 % zu vergr\u00f6\u00dfern und teste alle Funktionen.<\/p>\n\n\n\n
Sollte bei der Pr\u00fcfung eine Funktion nicht mehr gehen, suche die Ursache des Fehlers. <\/p>\n\n\n\nVermeidung von reinen Farbkennzeichnungen<\/strong><\/h4>\n\n\n\n
Gehe deine Seiten und Formulare durch. Pr\u00fcfe, ob irgendwo ausschlie\u00dflich durch Farbe eine Information vermittelt wird. Beispielsweise eine gr\u00fcne Erfolgsmeldung ohne klaren Text.<\/p>\n\n\n\n
Erweitere das Element um Text, der den Erfolg oder Fehler wiedergibt.<\/p>\n\n\n\nMultimedia barrierefrei bereitstellen<\/h4>\n\n\n\n
Audio-Inhalte brauchen eine Textalternative<\/strong> (Transkript) (WCAG 1.2.1<\/a>).
Falls Audiodeskription f\u00fcr Videos ben\u00f6tigt wird, ist diese Pflicht (WCAG 1.2.5<\/a>).<\/p>\n\n\n\n
Checke deine Videos & Audio-Inhalte (Podcast), ob es Untertitel und Transkripte gibt.<\/p>\n\n\n\n
Erstelle Untertitel und Transkripte.<\/p>\n\n\n\nBedienbarkeit<\/h3>\n\n\n\n
Navigation per Tastatur muss m\u00f6glich sein<\/h4>\n\n\n\n
Navigiere durch deine eigene Website, ohne die Maus zur Hilfe zu nehmen.<\/p>\n\n\n\n
Das kommt individuell auf die Website, genutzte Plugins und das Problem an. Leider kann ich dir pauschal keine Ma\u00dfnahme zur Umsetzung nennen.<\/p>\n\n\n\nFokus-Indikatoren f\u00fcr Tastaturnavigation<\/h4>\n\n\n\n
Navigiere per Tastatur durch deine Website. Dabei m\u00fcssen die gerade gew\u00e4hlten Elemente hervorgehoben werden, beispielsweise durch eine Umrandung.<\/p>\n\n\n\n
Beispielsweise per CSS:<\/p>\n\n\n\n*:focus-visible {\n outline: 2px dashed currentColor;\n outline-offset: 2px;\n}<\/code><\/pre>\n\n\n\nKein automatisches Starten von Medien ohne Nutzerkontrolle<\/h4>\n\n\n\n
\u00dcberpr\u00fcfe deine Videos und Audios, ob sie von allein starten und ob es Bedienelemente zum pausieren oder stoppen gibt.<\/p>\n\n\n\n
F\u00fcge Bedienelemente ein und stoppe Autoplay. Ob das auch f\u00fcr Hintergrundvideos (beispielsweise im Header) gilt, kann man wohl nur raten.<\/p>\n\n\n\nFormularbeschriftungen und korrekte Zuordnung<\/h4>\n\n\n\n
<label><\/code>), die Screenreader korrekt zuordnen k\u00f6nnen (WCAG 3.3.2<\/a>).<\/p>\n\n\n\n
Checke den Quellcode bei deinen Formularen und anderen Eingabefeldern, ob das <label> ausgef\u00fcllt ist.<\/p>\n\n\n\n
Bearbeite deine Formulare im Formular-Plugin deiner Wahl und sorge daf\u00fcr, dass die <label> Tags gesetzt und ausgef\u00fcllt sind. In der Regel gibt es hierf\u00fcr ein Eingabefeld in den Formular-Plugins<\/a>.<\/p>\n\n\n\nFehlermeldungen m\u00fcssen verst\u00e4ndlich und konkret sein<\/h4>\n\n\n\n
Checke deine Fehlermeldungen, ob sie konkret genug sind. Eine „das Formular enth\u00e4lt Fehler“-Meldung ohne Anzeige des fehlerhaften Feldes und was daran falsch ist, reicht nicht.<\/p>\n\n\n\n
Formuliere Fehlermeldungen klar und verst\u00e4ndlich. Biete Anweisungen zur L\u00f6sung des Fehlers und nenne oder zeige den genauen Fehler.<\/p>\n\n\n\n\u00dcberschriften und Strukturen m\u00fcssen korrekt sein<\/h4>\n\n\n\n
<h1><\/code> bis <h6><\/code> m\u00fcssen sinnvoll angeordnet sein, keine leeren \u00dcberschriften oder falsche Hierarchie (WCAG 1.3.1<\/a>).<\/p>\n\n\n\n
Jedes ordentliche SEO-Tool zeigt dir, ob du falsche \u00dcberschriften-Hierarchien oder leere \u00dcberschriften-Tags hast. Alternativ gibt es Browser-Add-Ons wie die ahrefs SEO-Toolbar, welche dir ebenfalls die \u00dcberschriften-Struktur anzeigen.<\/p>\n\n\n\n
Achte auf eine korrekte Hierarchie, nur einmalige Nutzung der H1 im Inhalt und darauf, keine leeren \u00dcberschriften zu haben.<\/p>\n\n\n\nVerst\u00e4ndlichkeit<\/h3>\n\n\n\n
Eindeutige Linktexte<\/h4>\n\n\n\n
SEO-Tools erleichtern hier mal wieder die Arbeit, filtere deine internen Links und gehe sie nach den klassischen und unklaren Benennungen durch. Alternativ kannst du Plugins wie den Broken Link Checker<\/a> nutzen.<\/p>\n\n\n\n
Vergib klare Linktexte. Der Nutzer muss durch den Text wissen, wohin der Link f\u00fchrt oder welche Aktion er ausl\u00f6st. Beispielsweise „Anfrage absenden“ oder „erfahre mehr \u00fcber XY“.<\/p>\n\n\n\nEinheitliche Benutzerf\u00fchrung<\/h4>\n\n\n\n
Gehe sicher, dass Elemente mit dem gleichen Zweck auch eine gleiche Benennung und Gestaltung vorweisen. Beispielsweise sollte ein Button, der eine Suche ausl\u00f6st, nicht einmal mit „Suchen“ und einmal mit „Finden“ benannt sein, sondern einheitlich.<\/p>\n\n\n\n
Sorge f\u00fcr Einheitlichkeit bei Elementen, welche die gleiche Funktion haben. Gestalte sie gleich, benenne sie gleich.<\/p>\n\n\n\nEinheitliche Navigation auf der gesamten Website<\/h4>\n\n\n\n
\u00dcberpr\u00fcfe deine Men\u00fcs, ob sie auf allen Seiten gleich angeordnet sind und die Men\u00fcpunkte die gleichen Namen haben.<\/p>\n\n\n\n
Vereinheitliche deine Men\u00fcs, sodass die Reihenfolge und Benennung der Men\u00fcpunkte \u00fcberall gleich ist.<\/p>\n\n\n\nSprache der Seite & Teilen der Seite korrekt angeben<\/h4>\n\n\n\n
Falls Inhalte in einer anderen Sprache vorkommen (z. B. englische Zitate), muss dies mit gekennzeichnet sein.<\/p>\n\n\n\n
Schaue im Quellcode nach, ob der korrekte href-lang-Tag hinterlegt ist und ob W\u00f6rter anderer Sprachen entsprechend ausgezeichnet sind.<\/p>\n\n\n\n
Language Tags legt in erster Linie WordPress basierend auf deiner Einstellung in WordPress selber an. Bei Multilingualit\u00e4t auf der Website, nutze das daf\u00fcr eingesetzte Plugin zur korrekten Auszeichnung der Sprachen.<\/p>\n\n\n\nRobustheit<\/h3>\n\n\n\n
Kompatibilit\u00e4t mit Screenreadern und assistiven Technologien<\/h4>\n\n\n\n
PageSpeed Insights<\/a> zeigt dir, falls Probleme mit den ARIA-Attributen vorliegen, das ist wohl der einfachste Weg.<\/p>\n\n\n\n
Stelle sicher, dass s\u00e4mtliche Komponenten deiner Website korrekte Bezeichnungen, Rollen und Werte im Code zugewiesen haben. Die Umsetzung passiert in erster Linie durch WordPress, Plugins und Themes, selber hast du darauf kaum einen Einfluss, au\u00dfer du kannst die entsprechenden Plugins und Themes umprogrammieren.<\/p>\n\n\n\nInteraktive Elemente m\u00fcssen programmatisch erkennbar sein<\/h4>\n\n\n\n
<button><\/code> statt <div><\/code> als Button verwenden) (WCAG 4.1.2<\/a>).<\/p>\n\n\n\n
PageSpeed Insights<\/a> zeigt dir teilweise, wenn hier Probleme vorliegen, das ist wohl der einfachste Weg. Alternativ kannst du nat\u00fcrlich jederzeit in den Quellcode schauen und dort pr\u00fcfen.<\/p>\n\n\n\n
Nutze die korrekten Auszeichnungen, beispielsweise <button> statt einem <div> f\u00fcr Buttons, f\u00fcr die verscheidenen Elemente der Website. Ein Gro\u00dfteil dessen passiert durch die Programmierung der genutzten Plugins und Themes, worauf du anschlie\u00dfend wenig Einfluss hast.<\/p>\n\n\n\nFehlermeldungen m\u00fcssen assistive Technologien unterst\u00fctzen<\/h4>\n\n\n\n
Optional: weitere empfohlene Ma\u00dfnahmen<\/h2>\n\n\n\n
Barrierefreiheitserkl\u00e4rung bereitstellen<\/h3>\n\n\n\n
Leichte Sprache als zus\u00e4tzliche Version anbieten<\/h3>\n\n\n\n
Geb\u00e4rdensprach-Videos f\u00fcr Erkl\u00e4rtexte<\/h3>\n\n\n\n
Zus\u00e4tzliche Schriftgr\u00f6\u00dfen- und Kontrasteinstellungen anbieten<\/h3>\n\n\n\n
Hilfe bei Formulareingaben bereitstellen<\/h3>\n\n\n\n
Breadcrumb-Navigation f\u00fcr bessere Orientierung<\/h3>\n\n\n\n
Zus\u00e4tzliche Anpassung f\u00fcr motorisch eingeschr\u00e4nkte Nutzer<\/h3>\n\n\n\n
Tools und Ressourcen zur Unterst\u00fctzung bei der Pr\u00fcfung & Umsetzung des BFSG<\/h2>\n\n\n\n
Gehirngerecht.digital<\/a> – lerne Barrierefreiheit oder lass dir helfen<\/h3>\n\n\n\n
![\"Screenshot](\"https:\/\/wp-ninjas.de\/wp-content\/uploads\/2025\/02\/gehirngerecht-digital-experte.jpg\")
<\/a><\/figure>\n\n\n\nGoogle PageSpeed Insights <\/a>\/ <\/a>Lighthouse – kostenlose Barrierefreiheits-Checks<\/h3>\n\n\n\n
![\"Screenshot](\"https:\/\/wp-ninjas.de\/wp-content\/uploads\/2025\/02\/pagespeed-insights-barrierefreiheit-bericht.jpg\")
<\/a><\/figure>\n\n\n\n![\"Screenshot](\"https:\/\/wp-ninjas.de\/wp-content\/uploads\/2025\/02\/lighthouse-bedienungshilfen.jpg\")
<\/a><\/figure>\n\n\n\nWP Accessibility<\/a> – ein kostenloses Plugin f\u00fcr Barrierefreiheitsfunktionen<\/h3>\n\n\n\n
![\"Screenshot](\"https:\/\/wp-ninjas.de\/wp-content\/uploads\/2025\/02\/wp-accessibility-screenshot.jpg\")
<\/a><\/figure>\n\n\n\nDigiAccess<\/a> – n\u00fctzliches Barrierefreiheit-Toolkit <\/h3>\n\n\n\n
![\"Screenshot](\"https:\/\/wp-ninjas.de\/wp-content\/uploads\/2025\/02\/digiaccess-funktionen.jpg\")
<\/a><\/figure>\n\n\n\n
![\"Screenshot](\"https:\/\/wp-ninjas.de\/wp-content\/uploads\/2025\/02\/digiaccess-erweiterte-funktionen.jpg\")
<\/a><\/figure>\n\n\n\n