9 Best Practices für Barrierefreiheit im Web, die Sie leicht anwenden können

In den letzten Jahren haben Zugänglichkeitsstandards in der Welt der Softwareentwicklung eine immer wichtigere Rolle gespielt.

So hat das Vereinigte Königreich 2019 neue Vorschriften zur Barrierefreiheit eingeführt, die öffentliche Einrichtungen gesetzlich verpflichten, ihre Websites bis zum^23. September 2020 barrierefrei zu gestalten. In den USA sind die Zahl und die Kosten der Klagen gegen die Barrierefreiheit in den letzten zehn Jahren erheblich gestiegen. Und, was vielleicht am wichtigsten ist, die EU hat 2019 den Europäischen Rechtsakt zur Barrierefreiheit eingeführt, der jetzt als einer der führenden Rechtsakte für digitale Barrierefreiheit gilt.

Doch wie wir bereits in einem früheren Artikel zu diesem Thema erwähnt haben, ist die Barrierefreiheit noch lange nicht ausgereizt. Leider sind 98% der Websites immer noch nicht zugänglich.

Aber Sie müssen nicht zu diesen 98% gehören!

Wenn Sie noch nicht in die Barrierefreiheit Ihrer Lösungen investiert haben, habe ich eine gute Nachricht. Auch wenn Sie kein Experte für Barrierefreiheit sind, können Sie Ihre Website unter dem Gesichtspunkt der Barrierefreiheit beurteilen und ohne großen Aufwand grundlegende Best Practices für die Barrierefreiheit hinzufügen. In diesem Artikel zeige ich Ihnen, wie Sie das tun können.

Was ist Barrierefreiheit - und warum ist sie wichtig?

Wenn Sie nicht genau wissen, was Barrierefreiheit ist, oder wenn Sie sich nicht sicher sind, ob Sie überhaupt in Barrierefreiheit investieren sollten, lesen Sie unseren vorherigen Artikel in dieser Serie. Er wird Ihnen nicht nur helfen, die Besonderheiten der besten Praktiken für Barrierefreiheit zu verstehen, sondern Sie auch davon überzeugen, dass Barrierefreiheit für Ihr Unternehmen von Vorteil ist.

Ganz zu schweigen davon, dass es ein Menschenrecht ist.

9 Best Practices für Barrierefreiheit, die jeder anwenden kann - schnell und einfach

Wie wir bereits in unserem ersten Kommentar zur Barrierefreiheit erwähnt haben, ist der Bedarf an barrierefreien Lösungen breiter gefächert, als man intuitiv denken mag. Lassen Sie mich das folgende Beispiel anführen.

Sehschwächen werden zu einem wachsenden globalen Problem. Im Jahr 2020 werden allein in den USA etwa 12 Millionen Menschen im Alter von 40 Jahren und älter eine Sehschwäche haben. Darüber hinaus besteht für 93 Millionen Erwachsene ein hohes Risiko für einen schweren Sehverlust.

Diese Statistik veranschaulicht perfekt, dass Barrierefreiheit nicht nur darauf abzielt, Menschen mit Behinderungen in einem sehr umgangssprachlichen Verständnis dieses Begriffs zu helfen. Bei der Barrierefreiheit geht es darum, allen Menschen zu helfen, die aus den unterschiedlichsten Gründen nicht mit bestimmten digitalen Lösungen interagieren können.

Schauen wir uns nun die Einzelheiten an.

Zoomen von Text bis zu 200%

Es gibt eine Reihe von Anpassungen, die Sie vornehmen können, um Menschen mit Sehschwäche zu helfen. Erstens können Sie dafür sorgen, dass der Text auf Ihrer Website auch in der vergrößerten Ansicht gut lesbar ist.

Jeder gängige Browser bietet die Möglichkeit, eine Website zu vergrößern. Wenn jemand eine Sehschwäche hat, erleichtert die Vergrößerung des Textes das Lesen. Es liegt an Ihnen, dafür zu sorgen, dass der Text auch dann noch lesbar ist, wenn er doppelt so groß ist; vor allem müssen Sie darauf achten, dass sich keine Elemente überschneiden.

Textausrichtung und Kontrast

Obwohl die Textausrichtung in der Welt des Drucks eine gängige Praxis ist, sollte sie auf einer barrierefreien Website nichts zu suchen haben. Um Ihren Text besser lesen zu können, sollten Sie ihn links ausrichten. Idealerweise sollte der Text auch in schmalen Spalten dargestellt werden.

Das Standardisierungskomitee des Worlds Wide Web Consortium (W3C) erläutert diese Frage näher:

Viele Menschen mit kognitiven Behinderungen haben große Probleme mit Textblöcken, die im Blocksatz (am linken und rechten Rand ausgerichtet) geschrieben sind. Durch die Abstände zwischen den Wörtern entstehen "weiße Flüsse", die die Seite hinunterlaufen, wodurch der Text für manche Menschen schwer zu lesen ist. Dieser Fehler beschreibt Situationen, in denen dieses verwirrende Textlayout auftritt. Am besten vermeiden Sie dieses Problem, indem Sie kein Textlayout erstellen, das vollständig im Blocksatz (sowohl am linken als auch am rechten Rand ausgerichtet) ist.

Überprüfen Sie außerdem, ob Ihr Text gut zu erkennen ist. Es gibt nichts Schlimmeres als graue Buchstaben auf weißem Hintergrund.

Das bedeutet, dass jede Zeile (außer der letzten) auf Ihrer Webseite die gleiche Länge hat.

Ok, es gibt sie - weiße Buchstaben auf weißem Hintergrund. Aber Sie wissen, was ich meine (hoffentlich!).

Linkhöhe und Schriftgröße

In Hollywood lesen die Drehbuchlektoren großer Produktionsfirmen jeden Tag ein paar Drehbücher durch. Schon vor langer Zeit, lange vor der digitalen Revolution, wussten erfahrene Drehbuchautoren, dass es gut ist, einen festen Abstand zwischen den Textzeilen zu lassen. Auf diese Weise war (und ist) der Text leichter zu lesen. Auf diese Weise konnten die Drehbuchautoren schon früh einige Bonuspunkte sammeln.

Diese Regel hat sich bis heute nicht geändert. Achten Sie darauf, dass zwischen den Textzeilen ein sichtbarer Abstand bleibt.

Um Ihre Website noch zugänglicher zu machen, sollten Sie außerdem die Formatgröße auf mindestens 16px ändern. Wenn es größer ist, ist es natürlich leichter zu lesen.

Tastatur-Navigation

Dieser nächste Punkt ist nicht nur eine gute Praxis für die Zugänglichkeit, sondern auch eine Frage der Bequemlichkeit für jeden Internetnutzer.

Das Aktivieren der Tastaturnavigation ist ein Muss. Die Pfeile sollten das Navigieren in die vorgegebenen Richtungen oder zwischen ausgewählten Bereichen der Benutzeroberfläche ermöglichen, während die Tabulatortaste den Zugriff auf Formulareingaben und Links ermöglichen sollte. Auf diese Weise ist die Nutzung einer Website nicht nur bequemer, sondern auch für Menschen mit Mobilitätseinschränkungen möglich.

Sichtbarer Fokus

Der sichtbare Fokus ist eng mit der Tastaturnavigation verknüpft und ermöglicht es dem Benutzer, zu erkennen, wo er sich auf der Seite befindet, wenn er eine Tastatur verwendet, um zwischen den Abschnitten der Benutzeroberfläche zu wechseln. Denn selbst wenn die Tabulatortaste es ermöglichen würde, zwischen Seitenelementen zu navigieren, aber in keiner Weise hervorheben würde, was gerade passiert, wäre die Option nutzlos. Der sichtbare Fokus sollte um Links und Formularfelder herum in Form von leicht erkennbaren Umrandungen sowie sichtbaren Eingabeaufforderungen auf Textfeldern erscheinen.

Fehlermeldungen löschen und verkürzen

Diese Kategorie ist ziemlich selbsterklärend und ermöglicht es den Benutzern, leicht zu verstehen, was auf der Webseite passiert, wenn ein Fehler auftritt. Sie sollten prägnant und klar sein und einfache Anweisungen zur Lösung des Problems enthalten. Je nach Größe Ihrer Website ist diese Best Practice für Barrierefreiheit vielleicht die am schwierigsten zu implementierende aus unserer Liste - aber sie sollte trotzdem nicht besonders zeitaufwändig sein. Und wenn Sie kein Meister im Schreiben kurzer und klarer Meldungen sind, machen Sie sich keine Sorgen - besuchen Sie einfach dieses W3C-Tutorial für barrierefreie Benutzerbenachrichtigungen, um alles zu lernen, was Sie wissen müssen.

Keine Platzhalter

Platzhalter sollten niemals als Alternative zu Beschriftungen verwendet werden. Ein Platzhalter ist ein kurzer Hinweis, der dem Benutzer bei der Dateneingabe helfen soll. Sie sollten sich jedoch nie darauf verlassen, dass sie Informationen vermitteln. Der Grund dafür ist, dass wertvolle Informationen, die in Platzhaltern untergebracht sind, nicht immer zugänglich sind. Am wichtigsten ist, dass der Kontrast von Platzhaltern oft anders ist als der des restlichen Textes auf Ihrer Website. Er kann zum Beispiel dunkelgrau auf hellgrau sein. Und wie wir bereits festgestellt haben, ist dies keineswegs einfach zu lesen.

Links sind unterstrichen und deutlich

Es ist eine gute SEO-Praxis, Hyperlinks zu erstellen, die selbsterklärend sind. Der Inhalt des Hyperlinks sollte den Leser darüber informieren, wohin er ihn führt. Und Google liebt das und fördert diese Art von Links. Die Best Practices für Barrierefreiheit haben eine ähnliche Präferenz. Aber, was vielleicht noch wichtiger ist, sie empfehlen auch, dass ein Link leicht als solcher zu erkennen sein sollte. Dank einer Unterstreichung kann ein Benutzer sofort erkennen, dass es sich bei einem bestimmten Text tatsächlich um einen Hyperlink handelt.

Nichts geschieht automatisch (oder kann gestoppt werden)

Schließlich sollte Ihre Website keine automatische Wiedergabe, kein automatisches Scrollen des Inhalts, keine automatische Änderung des Inhalts und kein automatisches Absenden von Formularen haben. Das ist nicht nur ärgerlich für uns alle, sondern auch sehr hinderlich für alle Arten von Nutzern mit Beeinträchtigungen. Wenn einige Dinge automatisch ablaufen (müssen), sollten Sie sicherstellen, dass sie jederzeit gestoppt werden können.

Zusammenfassung

Das Bewusstsein für Barrierefreiheit wächst. Gleichzeitig werden auch die gesetzlichen Bestimmungen zur Barrierefreiheit immer zahlreicher und ausgefeilter.   Deshalb sollten Sie nicht darauf verzichten, Ihre Weblösungen barrierefrei zu gestalten. Und mit den oben beschriebenen 9 Best Practices sollten die ersten Schritte zur Barrierefreiheit nicht allzu schwierig sein - Sie brauchen nur jemanden, der Ihre Website bei Bedarf programmiertechnisch optimiert, und jemanden, der Ihre Fehlermeldungen umschreibt. Alle diese Schritte sollten schnell und schmerzlos zu bewerkstelligen sein.   Und wenn Sie diesen Artikel überflogen haben und zu dem Schluss gekommen sind: "Hey, aber meine Website hat all diese Funktionen bereits!", dann...   Herzlichen Glückwunsch! Ich wünschte, jeder könnte das sagen!   Vielen Dank für Ihre Lektüre und viel Erfolg bei Ihren Bemühungen um Barrierefreiheit!