WordPress ist sicherlich das beliebteste Blogging-System überhaupt. Ganz nebenbei hat es sich auch für viele Website-Anbieter zum bevorzugten Redaktionssystem entwickelt. In diesem Artikel erkläre ich, wie man mit WordPress barrierefreier werden kann. Mein Kooperations-Partner Silta setzt keine WordPress-Websites barrierefrei um, bietet aber Beratung und Begleitung für barrierefreie Websites.
Vorneweg sei gesagt, dass die Barrierefreiheit einer Website und das eingesetzte Redaktionssystem nicht unbedingt in einem Zusammenhang stehen. Ein CMS kann die nötigen Werkzeuge und Erweiterungen bereitstellen, muss es aber nicht. Der große Vorteil von WordPress und vieler anderer Open–Source-Systeme wie Drupal, Contao oder Joomla ist 1. dass das Backend der Systeme relativ barrierefrei ist und 2. die große Menge an Erweiterungen und Designs. Die meisten kommerziellen Systeme sind nicht imAnsatz dazu geeignet, von behinderten Menschen bedienbar zu sein.
Für Blinde und andere behinderte Menschen sollte die Bedienung des WordPress-Backends generell möglich sein. Es ist neben Drupal eines der barrierefreiesten Backends, die ich bisher gesehen habe. Es ist also die ideale Grundlage für ein divers aufgestelltes Online-Redaktionsteam.
Die Wahl des Themes
WordPress lässt sich als Framework betrachten, das sich an unterschiedliche Ansprüche anpassen lässt. Das gilt insbesondere für das Layout. Die Wenigsten werden sich mit den Standard-Themes von WordPress begnügen. Sie sind allerdings relativ barrierefrei. Natürlich sollte das Theme mobile-freundlich sein. Das erleichtert die Vergrößerbarkeit für sehbehinderte Nutzer. Bei WordPress selbst kann nach barrierefreien Themes gefiltert werden. Unabhängig davon solltet ihr allerdings selbst prüfen, ob die Selbsteinstufung der Eintragenden stimmt.
Bei Themes von Dritt-Anbietern müsst ihr selbst prüfen, ob sie barrierefrei sind. Ist euch eine Website bekannt, die das Theme bereits einsetzt, könnt ihr diese automatisch mit einem Tool wie WAVE oder manuell mit einem Prüfverfahren wie dem BITV-Test prüfen. Fragt ruhig auch bei der Entwickler:In nach, ob das Theme barrierefrei ist. Vor allem, wenn das Theme kostenpflichtig ist, sollte der Entwickler:Innen solche Anforderungen berücksichtigen. Außerdem schafft ihr so ein Bewusstsein dafür, dass eine Nachfrage nach barrierefreien Themes besteht.
Entwickelt ihr selber ein Theme, bietet WordPress selbst Infos zur Barrierefreiheit. Den Link findet ihr am Ende des Artikels.
Texte
Der WordPress-Texteditor TinyMCE – heute Classic Editor – und der Gutenberg-Editor bringt leider nicht alle nötigen Funktionen zur barrierefreien Texterstellung mit. Es fehlen zum Beispiel Befehle für Zwischenüberschriften oder Abkürzungen. Die Auszeichnung von Zwischenüberschriften, Listen und weiteren Elementen erleichtert es Blinden zu erkennen, welche Aufgabe das Element hat. Ihr seht einen fett gedruckten und abgesetzten Text und wisst, dass das eine Zwischenüberschrift ist. Blinde nehmen das nicht wahr. Für ihre Hilfssoftware wird die Information, welche Aufgabe ein Stück Text hat, über HTML-Auszeichnungen vermittelt. Außer Zwischenüberschriften können auch Listen, Zitate sowie Abkürzungen ausgezeichnet werden.
Um diese Auszeichnungen mit einem grafischen Editor zu erstellen, benötigt ihr das Plugin TinyMCE Advanced.
Wenn ihr ein wenig HTML oder Markdown beherrscht, benötigt ihr keinen weiteren Editor. Schaltet den Texteditor auf HTML um und gebt die entsprechenden Auszeichnungen händisch ein. Die wenigen Auszeichnungsbefehle sind schnell erlernt.
Bilder
WordPress bietet gute Möglichkeiten, Bilder mit alternativen Beschreibungen zu versehen. Das ist wichtig für Blinde oder Sehbehinderte, die das Bild nicht sehen oder nicht erkennen können.
Die Optionen zur Bildbeschreibung werden in der Mediathek in der rechten Spalte angezeigt. Ist das Bild ausgewählt, könnt ihr Alternativtext oder Titel festlegen.
Der Alternativtext wird Blinden vorgelesen. Der Titel wird angezeigt, wenn ihr mit dem Mauscursor über das Bild fahrt. Er richtet sich also eher an Sehbehinderte. Alternativtext und Titel sollten nicht identisch sein, da die Hilfssoftware von Blinden beides vorliest. Allerdings schlagen Plugins wie Access Monitor an, wenn die beiden Texte gleich sind. Das Tool geht in solchen Fällen davon aus, dass die Felder automatisch befüllt wurden.
Als Faustregel gilt: Blinde können das Bild nicht sehen und benötigen grundlegende Infos: Was ist überhaupt auf dem Bild zu sehen. Zum Beispiel „Das Diagramm zeigt die Geschäftsentwicklung 2015“. Die Werte dazu sollten natürlich in einer Tabelle oder im Fließtext stehen. Sehbehinderte haben eventuell Probleme, den Bild-Inhalt zu erkennen, ihnen hilft daher eine allgemeinere Beschreibung des Bildaufbaus. Zum Beispiel: „Das Säulendiagramm zeigt die Geschäftsentwicklung des Jahres 2015, die einzelnen Säulen bilden die Monate ab“. .
Außerdem können Bildunterschriften hinzugefügt werden. Sie werden allen Nutzern angezeigt und können alternativ zum Titel verwendet werden, da sie für alle Nutzer sichtbar sind.
Page Builder
Leider muss ich einigen Leuten den Tag vermiesen: Page Builder wie Divi oder elementor können nicht automatisch barrierefreie Websites erzeugen, selbst wenn sie etwas Anderes behaupten. Übrigens kann das auch kein anderer Page Builder. Das Problem ist, dass diese Tools generischen Code, also div und span, erzeugen, weil die Bausteine an jeder Stelle verwendbar sein sollen. Der Builder müsste selbständig erkennen, dass Block X in der Seitenleiste verwendet wird und eine andere Semantik erfordert als wenn der gleiche Block im Footer verwendet wird.
Möglicherweise kann man hier mit eigenem HTML nachhelfen, aber wer das kann, wird vermutlich keinen Builder verwenden.
Hier gibt es einen Vergleich der Builder bezüglich Barrierefreiheit
Formulare
Gleiches gilt aus anderen Gründen für Formulare. Meine Recherche hat mich bisher zu keinem Formular-Plugin geführt, welches out of the box barrierefreie Formulare erzeugen kann. Technisch wäre es kein Problem, Labels maschinen-lesbar zu verwenden, das hätte kaum einen Einfluss auf das visuelle Layout. Warum die Tools das nicht machen, bleibt ihr Geheimnis.
Auch hier kann man natürlich manuell eingreifen, aber das übersteigt die Fähigkeiten der meisten Leute. Schaut euch an, ob es Dokus zur Barrierefrei-Machung zu eurem bevorzugtem Formular-Plugin gibt. Häufig empfohlen werden Gravity Forms und Contact Form 7.
Plugins
Zuletzt möchte ich noch auf ein paar Plugins hinweisen, die eventuell hilfreich sind. Wer diese Plugins installiert, ist sicher nicht barrierefrei, umgekehrt muss man diese Plugins nicht installieren, um barrierefrei zu werden. Ich zeige lediglich, welche Möglichkeiten es gibt. Von allen genannten Plugins gibt es kostenlose Varianten.
Hurraki ist ein Wörterbuch, das Alltagsbegriffe in einfacher Sprache erläutert. Das Plugin hurrakify ermöglicht es, sich zu einzelnen Begriffen aus einem Text Erläuterungen aus Hurraki anzeigen zu lassen. ,
Der Access Monitor prüft eure WordPress-Inhalte auf Barrierefreiheit. Wie alle automatischen Testtools benötigt man Erfahrung mit digitaler Barrierefreiheit oder viel Zeit, um die einzelnen Fehlermeldungen nachvollziehen zu können. Das Tool kann euch auch nicht sagen, ob Bilder einen sinnvollen Alternativtext haben, das müsst ihr selbst entscheiden. Hierbei handelt es sich um ein Freemium-Modell. Es gibt eine kostenlose sowie eine kostenpflichtige Variante.
WP Accessibility rüstet eine Textvergrößerungsfunktion sowie eine Kontrastansicht für WordPress nach. Solche Funktionen waren früher der letzte Schrei in Barrierefreiheits-Kreisen, gelten aber seit einigen Jahren als unerwünscht. Es wird argumentiert, dass die Betriebssysteme, die Browser und die Hilfstechnik diese Aufgaben besser lösen als die fehleranfälligen Webseiten-Funktionen. Das ist sicherlich korrekt, aber es gibt tatsächlich noch Menschen, die nicht wissen, wie sie Text vergrößern oder eine kontrastreiche Ansicht aktivieren und sie sind dankbar für diese kleinen Hilfen. Und die Anderen nehmen auch keinen Schaden, solange die Regeln der Barrierefreiheit bei der Theme-Gestaltung berücksichtigt wurden. Es gibt mittlerweile einige Plugins dieser Art, allerdings hat WP Accessibility die meisten Bewertungen.
Das Plugin Content Author Accessibility Preview zeigt Inhalte-Erstellern eventuelle Probleme mit der Barrierefreiheit, bevor der Beitrag veröffentlicht wird.
An dieser Stelle eine kleine Warnung vor dem Plugin von ReadSpeaker zum Vorlesen von Texten: Das Plugin erhöht die Ladezeit der Website signifikant, es dauert mehrere Sekunden länger, bevor die Seite tatsächlich angezeigt wird. Gerade auf mobilen Geräten dürften viele Nutzer abspringen, weil sie die Website für nicht erreichbar halten. Abgesehen davon sind Vorlesefunktionen gänzlich überflüssig, für so ein Plugin gibt es keine Empfehlung.
Ebenso solltet ihr Abstand halten von sogenannten Barrierefreiheits-Overlays. Sie heißen AudioEye, Accessibe oder EyeAble – diese Tools versprechen, die Website mit ein paar Zeilen Code barrierefrei zu machen. In Wahrheit fügen sie ein paar in der Regel unbrauchbare Funktionen hinzu, bringen aber keinen Nutzen für die Barrierefreiheit. Das ist rausgeworfenes Geld. Ich würde diese Tools nicht einmal dann einsetzen, wenn mich jemand dafür bezahlen würde.
[…] Die community-finanzierte Entwicklung von Hilfsmitteln wird die klassische Hilfsmittelversorgung ergänzen und nicht ersetzen. Vor allem durch die Alterung der Gesellschaft ist absehbar, dass ehr viel mehr Menschen günstige und einfach bedienbare Hilfsmittel benötigen werden. Durch Spenden und Crowdfunding kann jeder ein Stück dazu beitragen, das solche Hilfsmittel entwickelt werden. Barrierefrei mit WordPress […]