Die Barrierefreiheit von WordPress zu verstehen und richtig zu nutzen, ist entscheidend für die Benutzerfreundlichkeit deiner Webseite. Wenn du dich mit diesem Thema nicht auskennst, ist Barrierefreiheit genau das, wonach es klingt: der Grad, in dem jeder auf etwas zugreifen und es vollständig nutzen kann.
„Barrierefreiheit bedeutet, deine Webseiten für so viele Menschen wie möglich nutzbar zu machen. Traditionell denken wir dabei an Menschen mit Behinderungen, aber die Praxis, deine Webseiten zugänglich zu machen, kommt auch anderen Gruppen zugute, z. B. denen, die mobile Geräte benutzen, oder denen mit langsamen Netzwerkverbindungen.“ (Quelle)
Je zugänglicher deine Webseite ist, desto mehr Menschen können sie nutzen. Wenn eine Webseite weniger zugänglich ist oder die Barrierefreiheit keine Priorität hat, wird ein Teil deines Publikums abgeschreckt oder ganz davon abgehalten, alle Informationen zu erhalten, die deine Webseite zu bieten hat.
In diesem Beitrag erklären wir, warum Barrierefreiheit wichtig ist, was sie bedeutet, inwieweit WordPress bereits barrierefrei ist, wie Webseiten-Ersteller/innen ihre Webseiten barrierefrei gestalten können und wie man die Barrierefreiheit einer Webseite testet.
Los geht’s!
Schau dir unseren Video-Leitfaden zur Barrierefreiheit von Webseiten an
Was Barrierefreiheit im Internet bedeutet
Barrierefreiheit im Internet bedeutet, dass eine Webseite so gestaltet und entwickelt wird, dass alle Menschen sie nutzen können. Dazu gehört auch, wie sie die Webseite verstehen, navigieren, mit ihr interagieren und zu ihr beitragen können.
Ein guter Weg, um Barrierefreiheit zu definieren und zu verstehen, ist es, mit einigen Mythen aufzuräumen.
Mythos eins: Es ist nur für Blinde
Eine barrierefreie Webseite sollte auch von Menschen mit auditiven, kognitiven, neurologischen, körperlichen, sprachlichen und visuellen Behinderungen genutzt werden können. Menschen mit Behinderungen stehen bei den Bemühungen um Barrierefreiheit im Mittelpunkt. Sie sind jedoch nicht die einzigen, die von einer barrierefreien Webseite profitieren.
Barrierefreiheit im Internet verbessert das Nutzererlebnis für alle folgenden Personen und Situationen:
- Personen, die mobile Geräte mit kleineren Bildschirmen und unterschiedlichen Eingabemodi verwenden.
- Menschen mit eingeschränkten Fähigkeiten, Sehkraft oder Mobilität aufgrund des Alterns.
- Personen mit vorübergehenden Schwierigkeiten wie einer verletzten Hand.
- Personen, die deine Webseite in einer Umgebung nutzen, in der die Beleuchtung den Kontrast auf dem Bildschirm verändern kann.
- Personen, die die Webseite mit einer begrenzten Internetverbindung oder Bandbreite.
Mythos zwei: Es ist eine Modeerscheinung oder ein Trend
Wahrscheinlich hast du in den letzten Jahren mehr und mehr über Barrierefreiheit im Internet gehört. Da das Internet wächst und sich immer mehr Menschen darauf verlassen, wird Barrierefreiheit zu einem immer wichtigeren Thema. Aber es ist nicht nur eine Modeerscheinung.
„Digitale Barrierefreiheit ist ein Bürgerrecht und ein Menschenrecht von Menschen mit Behinderung auf der ganzen Welt.“
Lainey Feingold, Anwältin für Behindertenrechte und Autorin
Im Laufe der Zeit und mit der zunehmenden Verbreitung des Internets steigt auch der Bedarf an Barrierefreiheit im Internet. Wenn eine Webseite nicht vollständig gemäß den WCAG-Richtlinien zugänglich ist, können Einzelpersonen rechtliche Schritte gegen den Entwickler oder Betreiber der Webseite einleiten.
Ein Blick auf die Zahl der Klagen zum Thema Barrierefreiheit im Internet zeigt, wie ernst die Menschen dieses Thema nehmen. Die Zahl der Klagen hat sich von 2017 bis 2018 fast verdreifacht. Seitdem liegt die Zahl bei durchschnittlich 2.345 Klagen pro Jahr. Sogar während der COVID-19-Pandemie im Jahr 2020 stieg die Zahl der ADA Title III Webseiten-Zugänglichkeitsklagen vor Bundesgerichten auf 12% im Vergleich zum Vorjahr.
Barrierefreiheit im Internet ist ein Dauerbrenner. Bei der Entwicklung von Software und Webseiten müssen wir die Barrierefreiheit in unsere Prozesse einbeziehen. Das ist nicht nur notwendig, weil niemand gerne verklagt wird, sondern auch, weil das Internet die Bedürfnisse aller Menschen erfüllen muss, ganz gleich, welche Bedürfnisse sie haben.
Mythos 3: Du kannst Barrierefreiheit vollständig automatisieren
Wenn du erst einmal verstanden hast, warum Barrierefreiheit wichtig ist – und dass es Konsequenzen haben kann, wenn du ihr keine Priorität einräumst -, hast du es vielleicht eilig, sicherzustellen, dass deine Webseite WCAG-konform ist.
Einer der beliebtesten Mythen über Barrierefreiheit im Internet ist, dass du ein einfaches Plugin herunterladen oder eine Software installieren kannst, die deine Webseite mit einem Fingerschnippen vollständig barrierefrei macht. Das ist schlichtweg unmöglich.
Laut a11yproject.com sind Barrierefreiheitsprobleme entweder objektiv oder subjektiv. Objektive Probleme können durch Code erkannt werden, während subjektive Probleme ein menschliches Urteil erfordern. Code kann Probleme, die in die letztgenannte Kategorie fallen, nie genau lösen, und Versuche, dies zu tun, schaden oft mehr als sie nützen.
„Overlay“-Lösungen sind automatisierte Softwarelösungen, die, wie wir wissen, nur ~30% der WCAG-Probleme von vornherein erkennen können. Das liegt daran, dass die WCAG nuanciert und interpretierbar sind. Maschinen sind darin nicht gut.“ (Quelle)
Denke daran, dass es bei der Barrierefreiheit nicht um Risikovermeidung geht, sondern darum, allen Nutzern ein optimales Erlebnis zu bieten.
Richtlinien für die Zugänglichkeit von Webinhalten
Die Web Accessibility Initiative hat eine Reihe von Zugänglichkeitsrichtlinien für Webinhalte (Web Content Accessibility Guidelines – WCAG) entwickelt, die dir dabei helfen können, sicherzustellen, dass deine Webseite den Richtlinien entspricht und vollständig zugänglich ist. Wenn du eine Webseite gestaltest, entwickelst oder supportest, solltest du mit diesen Richtlinien bestens vertraut sein.
Barrierefreiheit ist nicht nur ein Thema für Entwickler/innen, sondern auch für Designer/innen, Vermarkter/innen, Inhaltsautor/innen, Projektmanager/innen und viele mehr. Barrierefreiheit sollte während des gesamten Prozesses der Erstellung deiner Webseite, von der Planung bis zum Start, eine Priorität sein. Du solltest die Barrierefreiheit einer Webseite auch nach dem Start kontinuierlich verbessern.
Wie barrierefrei ist WordPress von Haus aus?
Dies ist eine der wichtigsten Fragen, die sich viele Menschen stellen, wenn sie WordPress als Option für die Erstellung einer Webseite in Betracht ziehen: Wie zugänglich ist es bereits, und wie viel Arbeit muss man leisten, um WordPress zugänglich zu machen? Da es darauf keine pauschale Antwort gibt, wollen wir uns ansehen, inwieweit WordPress bereits barrierefrei ist.
Wo WordPress Barrierefreiheit gut macht
Die gute Nachricht ist, dass WordPress im Laufe der Zeit immer zugänglicher geworden ist. Mit jeder neuen Version werden kleine Schritte und Fortschritte im Hinblick auf Barrierefreiheit gemacht. Je mehr Menschen sich mit dem Thema Barrierefreiheit auseinandersetzen, desto mehr Menschen können ihm Priorität einräumen.
Außerdem setzen sich viele Menschen in der WordPress-Community leidenschaftlich und lautstark für diese Themen ein. Jedes neue Standard-WordPress-Theme unternimmt zusätzliche Schritte, um barrierefrei zu werden. Entwicklerinnen und Entwickler entwickeln neue Tools und schreiben ständig Anleitungen und Artikel über Barrierefreiheit in WordPress. So bist du auf deinem Weg zur Barrierefreiheit von WordPress nie allein.
Wenn du mehr über WordPress und Barrierefreiheit erfahren möchtest, besuche WordPress.tv und schau dir diese Vorträge über Barrierefreiheit an.
Wo WordPress das Ziel verfehlt
Trotz der jüngsten Fortschritte ist WordPress nicht immer zu 100% barrierefrei. Jede WordPress-Version steht in der Kritik, wenn sie nicht barrierefrei ist. Anfang 2019 führte WPCampus eine umfassende Prüfung der damals neuesten Gutenberg-Version durch. Arbeiten wie diese sind unglaublich wichtig; seit diesem Audit wurden 116 Probleme im Zusammenhang mit der Barrierefreiheit behoben.
Für behinderte Inhaltsersteller/innen kann es schwierig sein, mit WordPress zu veröffentlichen. Da es unmöglich ist, alle Aspekte der barrierefreien Gestaltung und Entwicklung zu automatisieren, kann jeder mit WordPress unzugängliche Webseiten erstellen.
„Das Frontend von WordPress ist so ziemlich das, was es schon seit Jahren ist: Es ist durchaus in der Lage, barrierefrei zu sein, aber es hängt ganz vom Entwickler ab, der deine Webseite erstellt. Ein schlechtes Theme oder unzugängliche Plug-ins machen den Unterschied aus. Der Admin hat sich weiter verbessert – es war ein harter Weg, den Gutenberg-Editor in Richtung Barrierefreiheit zu entwickeln, aber es gibt Fortschritte zu verzeichnen. Dennoch ist es ein ständiger Kampf, Rückschritte bei der Barrierefreiheit mit jeder neuen Interface-Komponente zu vermeiden.“ (Quelle)
Was bedeutet das für dich als WordPress-Entwickler oder Designer? Dein Weg zu einer vollständig barrierefreien Webseite ist etwas kürzer, wenn du mit WordPress beginnst. Trotzdem ist es noch ein weiter Weg, bis du die Ziellinie erreichst.
Wie du eine barrierefreie WordPress Webseite erstellst
Kommen wir nun zu den Schritten, die du unternehmen kannst, um sicherzustellen, dass eine WordPress Webseite für alle Nutzer/innen zugänglich ist.
Egal, was du tust, lass die Barrierefreiheit nie als eine Aufgabe am Ende des Projekts stehen. Es sollte eine Priorität sein, die von Anfang an in deinen Prozess integriert wird. Und es sollte ein kontinuierliches Ziel sein, sobald deine Webseite online ist.
Es gibt keine Checkliste, die man befolgen oder automatisieren kann, um 100%ige Barrierefreiheit zu gewährleisten. Ein Großteil der Arbeit hängt von deinen Plugins, deinem Theme und deinem Inhalt ab.
Die Erstellung einer barrierefreien Webseite ist wie der Bau eines sicheren Gebäudes – es gibt zwar Richtlinien, aber individuelle Aufmerksamkeit, Instandhaltung und durchdachte Renovierungen sind unerlässlich, um das Ziel zu erreichen.
Best Practices für barrierefreies Design
Beginnen wir mit einigen Best Practices für die barrierefreie Gestaltung von WordPress Webseiten, aufgeschlüsselt nach Arten. Diese Informationen sollen dir als solide Grundlage für deine Ausbildung in Sachen Barrierefreiheit dienen.
Bilder
Alle Bilder auf deiner Webseite müssen für alle Nutzer/innen zugänglich sein. Da nicht alle Nutzerinnen und Nutzer Bilder sehen können, verwenden manche vielleicht Hilfsmittel, um visuelle Elemente zu verstehen, und deine Webseite sollte daher bereit sein, mit dieser Technologie zu arbeiten.
Der Alternativtext (oder „alt“) ist eine schriftliche Beschreibung, die du an ein Bild anhängst. Bildschirmlesegeräte lesen diese Beschreibung laut vor, wenn ein Gast das Bild nicht sehen kann. Alt-Text sollte für alle Bilder verwendet werden, die hilfreiche Informationen auf der Seite liefern. Das gilt für alle Bilder, von Fotos über Symbole bis hin zu Infografiken.
Die einzige Ausnahme ist, wenn ein Bild als rein „dekorativ“ angesehen wird. Hintergrundbilder, Trennlinien oder Bilder, die Text auf der Seite selbst zeigen, brauchen nicht unbedingt einen Alt-Text.
Wenn du einen Alt-Text schreibst, solltest du das Bild nicht so beschreiben, wie es ist. Gib stattdessen an, was das Bild im Kontext der Seite bedeutet. Hier sind einige gute Richtlinien, die dir helfen, einen guten Alternativtext zu schreiben:
- Kurz und einfach ist am besten.
- Screenreader erkennen, dass es sich um ein Bild handelt, also vermeide es, in deinem Alt-Text zu sagen: „Dies ist ein Bild von…“.
- Handelt es sich bei dem Bild um einen Link, sollte der Alt-Text erklären, was passiert, wenn der Nutzer das Bild anklickt.
- Der Alt-Text sollte jeden Text enthalten, der auf dem Bild erscheint. Eine Ausnahme ist, wenn derselbe Text auch in der Nähe des Bildes erscheint, z. B. in einer Bildunterschrift.
Das Hinzufügen von Alt-Text zu den Bildern auf deiner Webseite ist einfacher, als du vielleicht denkst. Du kannst diesen Text an der gleichen Stelle hinzufügen, an der du auch die Bildunterschrift einfügst.
Öffne deine Mediathek und wähle das Bild aus, das du bearbeiten möchtest. Daraufhin öffnet sich der Einstellungsbildschirm für dieses Bild. Füge im Feld Alternativer Text deinen Alt-Text ein und klicke dann auf Speichern:
Farben
Bei der Gestaltung einer barrierefreien Webseite ist ein angemessener Farbkontrast wichtig. Ein schlechter Farbkontrast kann die Lesbarkeit deiner Webseiten in vielen Fällen beeinträchtigen, z. B. für Menschen mit Sehschwäche, Farbenblinde oder Menschen, die bestimmte Geräte benutzen. Bilder, Texte und Elemente wie Schaltflächen brauchen alle einen angemessenen Farbkontrast.
Der Farbkontrast gibt an, wie hell oder dunkel Farben erscheinen, wenn sie gegeneinander oder sehr nahe beieinander stehen. Zum Beispiel hat schwarzer Text auf weißem Hintergrund einen viel höheren Farbkontrast (21:1) als gelber Text auf weißem Hintergrund (1,08:1). WCAG 2.0 AA verlangt ein Mindestverhältnis von 4,5:1 für normalen Text und 3:1 für größeren Text (fett 18px oder Standard 24px und größer).
Was bedeutet das genau? Die einfachste Methode, um herauszufinden, ob deine Farben gut zusammenpassen, ist, sie in ein Tool zum Testen des Kontrasts einzugeben, z. B. den WebAIM Contrast Checker. Es gibt viele kostenlose Tools im Internet.
Mehr über das Testen von Farben erfährst du in unserem Testbereich.
Wenn du mehr und mehr Farbkombinationen ausprobierst, wirst du immer besser in der Lage sein, allein vom Sehen her zu bestimmen, welche Farbkombinationen funktionieren und welche nicht.
Du musst auch darauf achten, dass du die Farbe nicht als Hauptunterscheidungsmerkmal einsetzt. Viele Webseiten haben zum Beispiel Links, die eine andere Farbe haben als der umgebende Text. Wenn die Farbe jedoch aus irgendeinem Grund schwer zu erkennen ist, könnte es für den Nutzer unmöglich sein, zwischen einem verlinkten und einem nicht verlinkten Wort zu unterscheiden. Verwende Farbe, um einen Link zu verschönern, aber füge eine Unterstreichung unter den Text, um den Link zugänglich zu machen.
Text
Ein Großteil dessen, was wir im Internet erleben, ist Text. Wir nutzen Webseiten, um Artikel, Rezepte, Geschichten und vieles mehr zu lesen. Du liest jetzt gerade diesen Beitrag! Deshalb muss der Text für alle Leserinnen und Leser optimiert werden – egal, ob sie mit den Augen oder den Ohren lesen.
Wenn es um Barrierefreiheit geht, gibt es vor allem zwei Möglichkeiten, über Text zu sprechen: Schriftarten und -größen.
Eine barrierefreie Schrift ist sowohl in kleinen als auch in großen Größen gut lesbar. Schriftarten wie Tahoma, Calibri, Helvetica, Arial, Verdana, Times New Roman, Arvo, Museo Slab und Rockwell sind alle barrierefrei. Lesern mit Legasthenie kann es schwerfallen, bestimmte Schriften zu lesen, darunter viele Serifenschriften. Serifenlose Schriftarten für Fließtext sind in der Regel die sicherere Wahl. Am besten vermeidest du Display-Schriften wie Handschrift oder Kursivschrift, es sei denn, der Text ist groß, spärlich und hauptsächlich dekorativ.
Die Größe der Schrift ist für die Barrierefreiheit unglaublich wichtig. Im Folgenden werden einige Faustregeln für barrierefreie Schriftgrößen vorgestellt.
Standardschriftarten sollten mindestens 9pt oder 12px groß sein. 12 pt oder 16 px werden empfohlen. Nach den WCAG-Richtlinien sollte der Text bei einer Vergrößerung von 200% lesbar sein. Es wird empfohlen, die Schriftgröße in Prozent oder em anstelle von Pixeln oder Punkten festzulegen. Unterschiedliche Schriftgrößen zu verwenden, ist in Ordnung, aber achte darauf, dass dein Text groß genug ist, um ihn lesen zu können, wenn du eine leichte Schrift verwendest.
Dies ist nicht das A und O für eine barrierefreie Gestaltung. Aber es ist wichtig, dass du weißt, wo du anfangen kannst. Wenn du dich eingehender mit dem Thema Barrierefreiheit beschäftigen willst, solltest du dir diese Ressourcen ansehen:
- W3C Web Design und Anwendungen
- Eine Fibel zur Barrierefreiheit für Designer
- Barrierefreies Design ist gar nicht so schwer
- 10 Beispiele für ADA-konformes barrierefreies Webdesign
- Barrierefreiheit im Design
Best Practices der barrierefreien Entwicklung
Bei der Entwicklung einer Webseite oder der dazugehörigen Software (wie Themes und Plugins) gibt es wichtige Dinge, die du im Hinblick auf Barrierefreiheit beachten musst. Einiges davon überschneidet sich mit dem Design, aber im nächsten Abschnitt geht es vor allem darum, wie deine Webseite funktioniert und wie deine Nutzer/innen mit ihr interagieren.
Interaktive Elemente
Die Nutzer/innen sollten in der Lage sein, mit deiner Webseite zu interagieren und sie relativ einfach zu nutzen. Dazu gehört nicht nur das Betrachten von Bildern und das Lesen von Texten, sondern auch die Interaktion mit Menüs, Formularen, Schaltflächen und Videos.
Achte beim Aufbau deiner Webseite darauf, dass alle interaktiven Elemente leicht zu erkennen sind. Alle Navigationsmenüs – von der Kopf- bis zur Fußzeile – sollten mit der Tastatur bedienbar sein. Das Aussehen von Links und Schaltflächen sollte sich ändern, wenn sie mit dem Mauszeiger hover, focus oder click werden.
Die Navigation auf deiner Webseite sollte einheitlich und klar sein. Wie du die Navigationslinks benennst, gestaltest und positionierst, ist unglaublich wichtig. Durchdachte Breadcrumbs und klare Überschriften ermöglichen es den Nutzern, sicher mit deinen Inhalten zu interagieren.
Wahrscheinlich hast du ein oder zwei Formulare auf deiner Webseite. Du wirst überrascht sein, wie viele Formulare unzugänglich sind. Deine Formularelemente müssen entweder auf der linken Seite oder oberhalb des Feldes beschriftet sein. (Kontrollkästchen und Optionsfelder können auf der rechten Seite platziert werden.) Es sollte für die Nutzer/innen klar ersichtlich sein, wofür jedes Formularfeld gedacht ist.
Wenn du Inhalte auf deiner Webseite hast, die automatisch abgespielt werden, wie z. B. GIFs, Slider, Karussells, Videos oder Musik, sollte es sichtbare Steuerelemente geben, mit denen der Nutzer die Animation oder den Ton anhalten kann. Am besten ist es, wenn du die Möglichkeit hast, das Element anzuhalten, zu pausieren oder ganz auszublenden.
Wenn du als Entwicklerin oder Entwickler tief in die Entwicklung von barrierefreien Websites eintauchen willst, schau dir diese Tipps direkt vom W3C an.
WordPress-Themes
Wenn du deine Webseite selbst erstellst, kannst du vieles von dem, was in diesem Beitrag beschrieben wird, durch die Wahl eines barrierefreien Themes erreichen. Für Entwickler/innen ist es wichtig zu verstehen, was ein Theme barrierefrei macht, damit sie es bei ihren Projekten vorrangig einsetzen können.
WordPress Themes bestimmen, wie deine Webseite aussieht. Viele Themes werden bereits mit Farbschemata und Schriftfamilien ausgeliefert. Du musst unbedingt sicherstellen, dass diese Farben und Schriftarten den oben genannten Anforderungen entsprechen. Viele Themes preisen sich selbst als „barrierefrei“ an, aber das stimmt nicht immer. Teste selbst, ob ein Theme barrierefrei ist oder nicht.
Das Accessibility-Team von WordPress.com hat eine Liste mit 92 kostenlosen Themes im WordPress-Repository zusammengestellt, die du sofort nutzen kannst.
Wenn du ein barrierefreies Theme erstellst, solltest du von Anfang an mit den WCAG-Anforderungen vertraut sein. Zu den Bereichen, die bei der Entwicklung berücksichtigt werden müssen, gehören:
- Angemessener Farbkontrast innerhalb der voreingestellten Farbpaletten
- Die Möglichkeit, auf der Webseite einfach mit der Tastatur zu navigieren
- Verwendung der richtigen ARIA-Rollen und/oder HTML5-Landmarks, um ein bildschirmlesefähiges Erlebnis zu gewährleisten
- Korrektes semantisches HTML-Markup
- Vermeidung von sich wiederholenden IDs auf einer Seite
- Benutzer können automatische Bewegungen stoppen oder kontrollieren
Setze ein Lesezeichen für die WordPress-Richtlinien zur Barrierefreiheit, damit du sie bei der Erstellung deines Themes schnell zur Hand hast.
WordPress Plugins
Mit WordPress Plugins kannst du deiner Webseite Plug-and-Play-Funktionen hinzufügen. Es gibt zwei Arten von WordPress-Plugins für Barrierefreiheit: solche, die dir helfen, eine barrierefreie Webseite zu erstellen, und solche, die eine bestehende Webseite für Nutzer/innen zugänglich machen.
Hüte dich vor WordPress Plugins, die dir Garantien wie „Barrierefreiheit mit einem Klick“ oder „automatisch barrierefrei“ geben. Diese Dinge sind unmöglich. Plugins sind Tools, die dir helfen können, deine Ziele in Sachen Barrierefreiheit zu erreichen, und keine Zauberstäbe, die dir die ganze Arbeit abnehmen. Manchmal können Plugins deine Bemühungen um Barrierefreiheit sogar behindern – sei also vorsichtig!
Es gibt unzählige Plugins, die versprechen, die Barrierefreiheit zu verbessern, zu überwachen oder zu beheben. Sie können deine Webseite überprüfen und dir sagen, wo du Verbesserungen vornehmen musst. Oder sie stellen Frontend-Tools zur Verfügung, mit denen du deine Webseite leichter barrierefrei gestalten kannst.
Einige davon sind sehr hilfreich. Andere hingegen machen falsche Versprechungen. Überprüfe ein solches Plugin immer gründlich, bevor du es einsetzt.
Einige Plugins erstellen interaktive Inhalte, wie Quizze und Slider. Wie bereits erwähnt, müssen diese Elemente besonders beachtet und getestet werden, um sicherzustellen, dass sie vollständig zugänglich sind. Teste ein interaktives Plugin immer gründlich auf einer Staging- oder Entwicklungsseite, bevor du es live schaltest.
Das Gleiche gilt für Formular Plugins. Leider haben viele von ihnen Probleme mit der Zugänglichkeit. Wenn du das feststellst, sind individuell programmierte Formulare eine gute Alternative.
Eine beliebte Kategorie von Plugins sind Page Builder Plugins. Mit ihnen kannst du schnell robuste und anspruchsvolle Drag-and-Drop-Designs erstellen. Allerdings bringen sie oft mehr Probleme mit der Barrierefreiheit mit sich, als sie lösen. Es gibt keine Patentlösung für dieses Problem, also halte dein Design einfach und stelle sicher, dass du alle Elemente auf ihre Zugänglichkeit hin testest.
Zugänglichkeitserklärungen
Eine Zugänglichkeitserklärung ist eine Seite auf deiner Webseite, auf der du deine internen Richtlinien, deine Ziele in Bezug auf die Zugänglichkeit und deine bisherigen Erfolge bei der Zusammenarbeit mit Menschen mit Behinderungen darlegst.
Du solltest aus den folgenden Gründen eine Erklärung zur Barrierefreiheit auf deiner Webseite erstellen und veröffentlichen:
- Um deinen Nutzern zu zeigen, dass du dich um Barrierefreiheit und sie kümmerst
- Um Informationen über die Zugänglichkeit deiner Inhalte bereitzustellen
- Um dein Engagement für Barrierefreiheit und soziale Verantwortung zu zeigen
Du kannst deine eigene Zugänglichkeitserklärung nach diesen Richtlinien des W3C verfassen oder einen Generator für Zugänglichkeitserklärungen verwenden.
So testest du die Zugänglichkeit deiner WordPress Seite
Bei Barrierefreiheit geht es nicht darum, die richtigen Knöpfe zu drücken und dann wegzugehen. Um sicherzustellen, dass eine Webseite vollständig zugänglich ist, sind Tests unerlässlich. Sowohl automatisierte als auch manuelle Tests können sicherstellen, dass du alles im Griff hast.
Wie man automatisierte Tests durchführt
Automatisierte Tests sind hilfreich, um herauszufinden, wo du anfangen sollst. Wenn du dich zum ersten Mal mit Barrierefreiheit beschäftigst oder dir nicht sicher bist, wo du anfangen sollst, solltest du mit automatischen Tests und Auswertungen beginnen.
Die meisten automatischen Tests erkennen Dinge wie schlechte Farbkontraste, fehlende Alt-Texte, leere Links, Probleme mit Strukturelementen und so weiter. Anhand dieser Tests kannst du eine Liste mit Problemen erstellen, die du in Angriff nehmen musst. Solche Tests sind besonders hilfreich, wenn es darum geht, Fehler im Code zu finden, die mit bloßem Auge nicht so leicht zu erkennen sind, die aber für einige deiner Nutzer/innen von großer Bedeutung sind.
Ein Beispiel für einen kostenlosen Barrierefreiheitstest ist das WebAim Tool. Es prüft deine gesamte Webseite und erstellt eine Liste mit Fehlern. Es zeigt dir sogar genau an, wo auf der Seite diese Fehler auftreten.
Es gibt eine Menge individueller Tools, die dir bei bestimmten Problemen helfen. Verwende zum Beispiel einen Kontrast-Checker, bevor du mit der Gestaltung beginnst, um sicherzustellen, dass die Farben in deiner Palette gut zusammenpassen.
Denke immer daran, dass kein automatisierter Test perfekt und narrensicher ist und die manuelle Prüfung nicht ersetzen kann.
So führst du manuelle Tests durch
Da es bei der Barrierefreiheit von WordPress um echte menschliche Anwendungsfälle geht, müssen echte Menschen das letzte Wort darüber haben, ob eine Webseite barrierefrei ist oder nicht. Daher ist es unglaublich wichtig, Zeit und Ressourcen für manuelle Tests zu reservieren.
Wie kannst du also einen manuellen Test durchführen? Hier sind ein paar Dinge, mit denen du die Barrierefreiheit einer Webseite ohne ausgefallene oder teure Tools oder Programme testen kannst:
- Lass die Maus weg: Achte darauf, dass du alle Funktionen deiner Webseite vernünftig und einfach nur mit deiner Tastatur bedienen kannst. Dazu gehört, dass du dich zwischen den Abschnitten bewegen, auf Menüs zugreifen, von Seite zu Seite gehen, die Seite überspringen und mit Links und Formularen interagieren kannst.
- Verwende einen Screenreader: Versetze dich in die Lage einer Person, die schlecht oder gar nicht sehen kann. Nutze eine Screenreader-App oder eine Webseite und überprüfe die Inhalte auf deiner Webseite, um sicherzustellen, dass sie auch beim Vorlesen noch Sinn ergeben und flüssig klingen.
- Teste deine Webseite in verschiedenen Umgebungen: Gehe irgendwo hin, wo es ein öffentliches WLAN gibt, um sicherzustellen, dass deine Webseite auch ohne eine hochwertige Internetverbindung richtig geladen wird. Achte auf die Bereiche auf deiner Webseite, die bei einer schlechten Verbindung verzögert oder ganz verschwinden.
- Vergrößere die Ansicht: Öffne deine Webseite in einem Browser und benutze die Browsereinstellungen, um die Ansicht um 200% zu vergrößern. Kannst du deine Webseite mit dieser Einstellung noch nutzen, navigieren und mit ihr arbeiten? Gibt es Inhalte, die verschwinden oder abgeschnitten werden?
- Achte auf Interaktivität: Nimm dir viel Zeit, um interaktive Elemente wie Videos, Formulare und Schaltflächen zu testen. Links und Formularfelder sollten immer mit einem Umriss, einer Unterstreichung oder einem speziellen Cursor hervorgehoben werden.
- Überprüfe deine Alt-Tags doppelt: Wenn du dir nicht sicher bist, ob ein Bild mit einem alternativen Bild versehen ist, verwende das Tool Inspect Element, um dies zu überprüfen.
- Denke anders: Wenn alle Bilder auf deiner Webseite verschwinden würden, könnte jemand sie dann noch nutzen? Wie würde sich das auf die Benutzerfreundlichkeit auswirken, wenn alle Farben auf deiner Webseite plötzlich schwarz und weiß wären? Vergewissere dich, dass die wesentlichen Teile deiner Webseite auch dann noch funktionieren, wenn die dekorativen Elemente in irgendeiner Weise beeinträchtigt werden.
Im Zweifelsfall solltest du dich an ein Unternehmen wenden, das manuelle Zugänglichkeitstests durchführt. Experten für Barrierefreiheit und Web-Design und -Entwicklung können eine manuelle Prüfung schnell durchführen und dir genau sagen, welche Bereiche überarbeitet werden müssen.
Vergiss nicht, dass dein reales Publikum eine deiner besten Ressourcen ist. Richte auf deiner Webseite einen eindeutigen Bereich ein, in dem die Nutzer/innen Feedback zur Barrierefreiheit geben können. Wenn jemand Schwierigkeiten bei der Nutzung deiner Webseite hat, sollte es aus deinen Bemühungen, Feedback zu sammeln, klar hervorgehen, dass du offen bist für deine Erfahrungen und die Behebung des Problems.
Zusammenfassung
Das Internet ist zu einem der wichtigsten Tools in unserem täglichen Leben geworden. Jeder muss die Freiheit haben, darauf zuzugreifen, egal ob er zur Unterhaltung oder für wichtige Informationen surft. Deine Webseite muss die Standards erfüllen, die für die Gleichberechtigung im Internet festgelegt wurden.
Das Verständnis für die Notwendigkeit dieser Richtlinien ist der erste Schritt zu einer bedeutenden und dauerhaften Veränderung. Wenn du eine barrierefreie Webseite aufbaust, profitieren langfristig mehr Menschen von dem, was deine Webseite zu bieten hat.
Hast du noch Fragen zur Barrierefreiheit von WordPress? Lass es uns im Kommentarbereich wissen!
Allie Nimmons is a WordPress content writer and producer with 6 years of site building experience. She has published WordPress-focused educational content with Automattic, LinkedIn Learning, GiveWP, GoDaddy, WP Buffs, and iThemes.
Schreibe einen Kommentar