Technologische Neuigkeiten, Bewertungen und Tipps!

ADA-konforme Website-Checkliste für 2023

Hinweis: Der folgende Artikel hilft Ihnen weiter: ADA-konforme Website-Checkliste für 2023

Einführung

Es ist von größter Bedeutung, sich ständig an die vielen Compliance-Standards zu erinnern, insbesondere an diejenigen, die sich auf Menschen mit Behinderungen in den Vereinigten Staaten beziehen. Die Menschen sind sich allgemein darüber einig, dass Unternehmen gemäß dem Americans with Disabilities Act (ADA) physische Hilfsmittel für Behinderte installieren müssen, aber viele wissen nicht, dass dieses Gesetz auch für die Online-Welt gilt.

Da wir ein führender Anbieter professioneller Webdesign-Agenturen sind, hielten wir es für sinnvoll, die ADA-konforme Website-Checkliste zu teilen, die wir verwenden, um sicherzustellen, dass die von uns erstellten Websites für Menschen aller Fähigkeiten zugänglich sind.

Was ist ADA-Compliance?

Im Jahr 1990 wurde der Americans with Disabilities Act in Kraft gesetzt, um der Diskriminierung aufgrund der unterschiedlichen Fähigkeiten einer Person ein Ende zu setzen. Das Gesetz soll sicherstellen, dass Einzelpersonen Zugang zu den gleichen rechtlichen Schutzmaßnahmen und Möglichkeiten haben.

Diese relativ bahnbrechende Verbesserung ebnete den Weg für die Standardisierung von Rollstuhlrampen, angepassten Toiletten und anderen gleichberechtigten Einrichtungen, die heute in praktisch jedem Unternehmen in den Vereinigten Staaten vorhanden sind.

Warum ist es wichtig, dass Websites den ADA-Standards entsprechen?

Der Americans with Disabilities Act (ADA) ist ein Bürgerrechtsgesetz, das ein breites Themenspektrum abdeckt. Es wurde gesetzlich verankert, um Menschen mit Behinderungen davor zu schützen, aufgrund ihrer Behinderung unterschiedlich behandelt zu werden. Die Gesetzgebung deckt ein sehr breites Spektrum von Situationen ab, darunter die folgenden:

  • Regierung auf Landes- und Gemeindeebene
  • Transport
  • Anstellung
  • Sowohl öffentliche als auch private Bereiche
  • Bauvorschriften
  • Telekommunikation

Der Americans with Disabilities Act (ADA) hat entscheidend dazu beigetragen, sicherzustellen, dass Menschen mit Behinderungen in den Vereinigten Staaten grundlegende Barrierefreiheit haben. Das ADA ist der Grund, warum unsere Baunormen die Installation von Rollstuhlrampen und Behindertenparkplätzen regeln.

Dieser Artikel ist nicht als Rechtsberatung zur ADA-Konformität gedacht; Vielmehr geht es um die Zugänglichkeit von Websites für alle Benutzer. Die Zugänglichkeit für alle Benutzer ist eines der grundlegendsten Ziele von Effective ADA-konforme Websites. Dadurch wird sichergestellt, dass Besucher die gesuchten Informationen schnell und unkompliziert finden können.

Warum ist es so wichtig, dass Websites barrierefrei sind?

Im Folgenden sind die Hauptgründe für barrierefreies ADA-Compliance-Webdesign aufgeführt:

  • Barrierefreiheit, oft auch als Reaktionsfähigkeit bezeichnet, ist die Praxis, Benutzern den Zugriff auf Inhalte auf jede Art und Weise ihrer Wahl zu ermöglichen, anstatt den Zugriff nur auf die Art und Weise zu beschränken, wie Sie es möchten.
  • Ihre Website sollte den Kunden verschiedene Optionen bieten, anstatt sie zu einer vorgegebenen Interaktion zu zwingen.
  • Benutzer werden Ihrer Marke treuer sein, wenn Sie Ihre Website für alle zugänglich machen, da sie es zu schätzen wissen, dass Sie sich die Zeit und Mühe genommen haben, sie für alle zugänglich zu machen.
  • Eine öffentliche Gegenreaktion kann auftreten, wenn sich Ihr Unternehmen nicht auf eine Art und Weise verhält, die andere für ethisch und moralisch angemessen halten, beispielsweise indem es gleichberechtigten Zugang bietet. Dies kann sich negativ auf den Ruf Ihres Unternehmens auswirken.

Checkliste für die ADA-Compliance-Website

Wenn Sie sicherstellen möchten, dass Ihre Website den dargelegten Empfehlungen entspricht, kann eine ADA-Website-Compliance-Checkliste als nützlicher Referenzpunkt dienen.

Um Sie bei der ADA-Konformität Ihrer Website zu unterstützen, haben wir die aktuellste ADA-Compliance-Checkliste für Websites beigefügt, in der alle wichtigen Funktionen hervorgehoben werden.

1. Nutzen Sie Untertitel und Audiobeschreibungen

Barrierefreiheitsfunktionen wie Audiobeschreibungen von Bildern sollten in Videos integriert werden, um sie für alle Zuschauer nutzbar zu machen. Auch synchronisierte Textunterschriften mit Videobildern und Audiospuren sollten enthalten sein.

2. Formulare mit beschreibenden Tags

Webformularfelder sollten mit beschreibenden HTML-Elementen gekennzeichnet sein, um Benutzern mit Behinderungen zu helfen.

3. Fügen Sie jedem Bild den entsprechenden Text hinzu

Bildschirmlesegeräte und aktualisierbare Braillezeilen sind zwei Technologien, die blinden oder sehbehinderten Menschen den Zugriff auf Inhalte im Internet ermöglichen. Diese Leser können Bilder, Diagramme und andere visuelle Inhalte jedoch nicht verstehen. Die Antwort besteht darin, für jedes Bild ein einfaches HTML-Alt-Tag als Textalternative zu fordern. Je nachdem, was erforderlich ist, um das Bild in Worte zu fassen, kann dieser Text so einfach oder ausführlich sein, wie Sie möchten.

4. Erstellen Sie ein leicht navigierbares Repository für Dokumente

Obwohl PDFs zum De-facto-Standard für die gemeinsame Nutzung von Dokumenten geworden sind, funktionieren sie möglicherweise nicht immer gut mit unterstützenden Technologien wie Bildschirmleseprogrammen oder den Textvergrößerungstools von Benutzern mit eingeschränktem Sehvermögen. Zusätzlich zum PDF müssen Sie das Dokument auch in einem textbasierten Format wie HTML oder RTF bereitstellen.

5. Legen Sie keine unveränderlichen Farbschemata und Schriftgrößen fest

Webbrowser und Betriebssysteme ermöglichen es Benutzern, die Anzeigefarbe und Schriftgröße an Benutzer mit Sehbehinderungen anzupassen. Die Website sollte nicht so aufgebaut sein, dass Benutzer die Farben und Schriftarten des Themas nicht ändern können.

6. Erstellen Sie eine Schaltfläche zum Überspringen des Navigationslinks

Auf 86,4 % der Homepages ist Text mit geringem Kontrast zu finden. Das häufigste Problem mit der Barrierefreiheit ist, dass der Text ein niedriges Kontrastverhältnis aufweist und nicht den Anforderungen von WCAG 2 AA entspricht.

Webseiten können für Personen, die Bildschirmleseprogramme verwenden, leichter zugänglich gemacht werden, indem oben auf jeder Seite die Option „Navigation überspringen“ eingefügt wird.

7. Ablenkende Elemente sollten eine Pause-Taste haben

Wenn eine Funktion optisch störend ist, weil sie blinkt, blinkt oder etwas Ähnliches tut, sollte sie über eine Pause- oder Deaktivierungstaste verfügen.

8. Es ist wichtig, Transkripte und Benachrichtigungen bereitzustellen

Neben einer akustischen Warnung und Transkription empfiehlt sich für Websites auch ein automatisch abspielender Soundeffekt. Unsere Webdesign-Dienste helfen dabei, solche Vorteile und Funktionen für Ihre Website bereitzustellen.

9. Einbeziehung behinderter Benutzer in Site-Tests

Beziehen Sie Benutzer mit Behinderungen in jeder Phase des Designprozesses in die Tests ein, um sicherzustellen, dass die gesammelten Daten repräsentativ für das gesamte Publikum der Website sind.

10. Struktur

Verwenden Sie geeignete Überschriften, um sicherzustellen, dass Benutzer mit Bildschirmlesegeräten oder anderen Sehbehinderungen Ihre Informationen problemlos lesen können. Dies erfordert die Verwendung geeigneter Header-Tags. Dem Titel oder H1 sollte eine H2-Überschrift folgen und unter einer H2-Überschrift sollte eine H3-Überschrift verwendet werden. Dadurch wird die Bedeutung und Tragweite der inhaltlichen Struktur deutlich.

11. Lesbarkeit

Es ist von entscheidender Bedeutung, das Material für Leser mit kognitiven Behinderungen zugänglich zu machen, aber es kommt auch anderen Nutzern zugute, da es einfacher zu überfliegen und zu verstehen ist. Schreiben Sie kurze, auf den Punkt gebrachte Sätze.

Erleichtern Sie das Lesen mit Listen mit Aufzählungszeichen, Zusammenfassungen und hervorgehobenen Begriffen. Stellen Sie die wichtigsten Details zuerst dar und gehen Sie auf die weniger wichtigen Details ein. Verwenden Sie eine einfache Sprache und vermeiden Sie Fachjargon. Der gesamte Text, einschließlich Überschriften, sollte linksbündig ausgerichtet sein.

12. Linktext

Vermeiden Sie die Verwendung von „hier klicken“ als Linktext, wenn Sie auf externe Websites verweisen. Benutzer mit Screenreadern oder Sehbehinderungen werden dank der Verwendung einer beschreibenden Linksprache keine Probleme haben zu verstehen, welche Links wohin führen.

13. Videos

Es gibt hauptsächlich drei Ansätze zur Verbesserung der Videozugänglichkeit.

  • Alle Videos sollten Untertitel haben. Dies hilft nicht nur Menschen mit Hörproblemen, sondern ist auch praktisch für Menschen, die sich in lauten Umgebungen aufhalten oder einfach keine Kopfhörer tragen möchten, wenn sie sich in der Öffentlichkeit Videos ansehen.
  • Ein Texttranskript sollte das gesprochene Wort in einem Video begleiten. Der höchste Standard ist ein Transkript, das genau beschreibt, was im Video passiert.
  • Die Audiodeskription ist das gesprochene Äquivalent eines beschreibenden Transkripts und hilft Sehbehinderten, Medien zu verstehen und zu genießen.

14. Bilder

Allen Fotos sollte Alt-Text beiliegen, also eine kurze Beschreibung des Bildinhalts in neutralem Ton. Dies ist die Sprache, die von Screenreadern vorgelesen wird, wenn ein Bild angezeigt wird. Die Angabe von Dateinummern oder anderen irrelevanten Informationen kann die Zugänglichkeit einer Website für sehbehinderte Besucher erheblich beeinträchtigen.

15. Schriftarten

Da ihnen winzige Serifen fehlen, sind serifenlose Schriftarten am besten lesbar. Vermeiden Sie die Verwendung zu vieler verschiedener Schriftarten. Verwenden Sie mindestens eine Schriftart der Größe 12; Verwenden Sie Fett statt Kursivschrift, wenn Sie etwas hervorheben möchten. Es ist sehr wichtig, die Hilfe professioneller Website-Design-Dienste in Anspruch zu nehmen, wenn Sie neu in diesem Bereich sind.

16. Tastaturnavigation

Menschen mit Seh- und Bewegungsbehinderungen können stark davon profitieren, wenn sie lernen, mit einer Tastatur zu navigieren. Ihre Website sollte dennoch für blinde oder motorisch eingeschränkte Menschen nutzbar sein, indem alternative Navigationsmethoden wie Tastaturkürzel oder eine Text-zu-Sprache-Schnittstelle bereitgestellt werden. Stellen Sie sicher, dass die Tab-Navigation mit allen Menüs, Schaltflächen und anderen Formen der Site-Navigation funktioniert.

Ein Fokus oder ein Indikator sollte auf Elementen erscheinen, wenn Benutzer ihren Cursor darüber bewegen.

17. Etiketten für Formulare und Tabellen

Gemäß den Empfehlungen unserer Experten für Webdesign-Dienstleistungen, Wenn es um die Benutzerfreundlichkeit geht, sind Etiketten der wichtigste Teil jedes Formulars. Verwenden Sie das Label-Element im Code für jedes Formularfeld, um ihm einen aussagekräftigen Namen zu geben. Auf diese Weise sind die Feldnamen für Benutzer von Bildschirmleseprogrammen hörbar. Anstatt Platzhaltertext in einem Feld zu verwenden, um dem Benutzer Informationen zu übermitteln (z. B. die Mindestlänge eines Passworts), fügen Sie diese Informationen unter dem Feldtitel hinzu.

Stellen Sie sicher, dass die Formulare unkompliziert sind und einer sinnvollen Struktur folgen. Benutzer sollten in der Lage sein, mithilfe einer Tastatur durch Formularfelder zu navigieren. Formulare, die den Anweisungen oben nicht folgen, werden möglicherweise falsch ausgefüllt.

18. Call-to-Action-Buttons

Calls-to-Action (CTAs) spielen eine entscheidende Rolle für den Erfolg jeder Marketingkampagne. Stellen Sie daher sicher, dass Ihre Zielgruppe leicht darauf zugreifen kann. Es sollte immer ein zugänglicher Name verwendet werden, normalerweise der Text der Schaltfläche. Geben Sie Benutzern von Bildschirmleseprogrammen Informationen über die Schaltfläche, indem Sie eine Aria-Beschriftung einfügen. Um sicherzustellen, dass die Calls-to-Action (CTAs) Ihrer Website für jedermann zugänglich sind, kann es hilfreich sein, mit Ihrem Webentwicklungsteam einige Best Practices für die Barrierefreiheit von Schaltflächen durchzugehen.

19. Code sollte in der Lage sein, die Sprache einer Seite zu identifizieren

Stellen Sie sicher, dass die unterstützende Technologie den Text auf Ihrer Website ordnungsgemäß wiedergeben kann, indem Sie die Sprache jeder Seite im Code markieren.

20. Benutzer sollten benachrichtigt werden, wenn sie ein Formular mit ungültigen Informationen einreichen

Meldungen müssen präzise und leicht verständlich sein. Insbesondere sollten Fehlermeldungen klar sein und umsetzbare Schritte zur Behebung des Problems enthalten. Auch die Bestätigung des Arbeitsabschlusses durch Erfolgssignale ist von entscheidender Bedeutung.

21. Auf allen Formularen müssen korrekte Beschriftungen und Legenden enthalten sein

Es ist wichtig, Elemente wie Formulare zu kennzeichnen, um sicherzustellen, dass alle Inhalte für alle Benutzer zugänglich sind.

22. Es dürfen keine leeren Überschriften oder Ankertexte vorhanden sein

Wenn Sie Überschriften-Tags ohne Text verwenden, wird es Personen, die die Tastaturnavigation verwenden, schwerer fallen, auf Ihrer Website zu navigieren. Überprüfen Sie, ob jedes Überschriften-Tag in der Navigation der Website einen Zweck erfüllt.

23. Vermeiden Sie Abkürzungen

Verwenden Sie keinen Jargon oder Akronyme, die Screenreader verwirren könnten. Um etwas hervorzuheben, verwenden Sie das HTML-Element „strong“ oder „em“ anstelle des Tags „b“ oder „i“.

24. Zeitlimitfunktion

Menschen mit Beeinträchtigungen sind eher in der Lage, Aufgaben erfolgreich zu bewältigen, wenn sie nicht auf die Zeit achten. Wer mehr Zeit zum Erledigen von Aufgaben benötigt, profitiert von der Möglichkeit, Zeitbeschränkungen zu deaktivieren, die Länge von Zeitbeschränkungen zu ändern oder zusätzliche Zeit anzufordern, bevor ein Zeitlimit erreicht wird.

25. Plugins und Widgets

Mit Plugins und Widgets können Sie die Benutzerfreundlichkeit und Leistung Ihrer Website verbessern. Die meisten Barrierefreiheitsprobleme lassen sich mithilfe eines Plugins lösen. Diese Plugins stellen außerdem sicher, dass Ihre Website immer auf dem neuesten Stand ist. Viele Situationen erfordern zusätzliche manuelle Unterstützung. Sie können die Benutzerfreundlichkeit Ihrer Website verbessern, indem Sie Widgets darin integrieren.

Zusätzliche ADA-Website-Checkliste

Der Prozess der Herstellung beste ADA-konforme Websites ist kontinuierlich. Im Laufe der Jahre sind neue Checklisten entstanden, und es ist für Unternehmen immer wichtiger geworden, sie zu verwenden, um die Einhaltung gesetzlicher Vorschriften sicherzustellen. Auch wenn der Prozess, eine Website barrierefrei zu machen, schnell vonstatten gehen kann, können Ihnen die folgenden Checklisten dabei helfen, auf dem richtigen Weg zu bleiben. Checklisten sollten jedoch nicht als das letzte Wort zur ADA-Konformität angesehen werden. Es ist auch wichtig, ein Compliance-Audit Ihrer Website durchzuführen.

  • Untertitel müssen in allen Videos und Audiodateien enthalten sein.
  • Es ist wichtig, dass Websites ein ausreichend hohes Farbkontrastverhältnis haben, damit Menschen mit Sehbehinderungen sie nutzen können.
  • Jeder hervorgehobene Text sollte anklickbar sein.
  • Es ist wichtig, dass Leser die Schriftgröße jedes Formulars um 200 % erhöhen können, ohne das Layout zu ändern.
  • Bilder sollten nicht auf Websites verwendet werden, wenn der Text die gleiche Idee vermitteln kann.
  • Trotz Sprachverschiebungen sollte der Code immer noch in der Lage sein, jede Sprache eindeutig zu identifizieren.
  • Dem Benutzer muss eine Anleitung gegeben werden, wie er seine Eingabefehler beheben kann.
  • Es wird ein Kontrast von mindestens 4,5:1 zwischen Seitenhintergrund und Text empfohlen.
  • Leser sollten auf verschiedene Weise auf Seiten zugreifen können.
  • Jede interaktive Komponente muss eine klare Funktion haben.
  • Von oben nach unten und von links nach rechts ist die richtige Lesereihenfolge, ebenso wie die richtige Präsentationsreihenfolge.
  • Symbole dürfen keine Bedeutung vermitteln.
  • Farben sollten nicht dazu verwendet werden, Bedeutung zu vermitteln.
  • Bewegte Inhalte wie Karussells sollten die Möglichkeit haben, anzuhalten, anzuhalten und auszublenden.
  • Elemente wie Akkordeons, Schaltflächen und Kombinationsfelder sollten durch ihren erweiterten/reduzierten oder ausgewählten Status definiert werden.
  • Jeder Abschnitt der Bewerbung sollte einen beschreibenden und eindeutigen Seitentitel haben.
  • Die visuelle Bezeichnung des Elements entspricht seinem zugänglichen oder programmatischen Namen.
  • In der Anwendung sind keine automatischen Startfunktionen oder -fähigkeiten vorhanden.
  • Das Ändern der Einstellungen eines Benutzeroberflächenelements führt nicht zu einem globalen Zurücksetzen des Anwendungskontexts.
  • Symbole müssen einen Tooltip haben.
  • Alle interaktiven Elemente sollten über eine sichtbare Tab-Fokus-Anzeige verfügen.
  • Für den Bildschirmleser und den kognitiven Benutzer ist es einfacher, die Position verschiedener Webelemente vorherzusehen, wenn sie auf der Seite erscheinen, da sie auf allen Programmseiten in derselben Reihenfolge wiederholt werden.
  • Elemente mit identischer Funktionalität auf mehreren Bildschirmen in einer App haben dieselbe Bezeichnung oder denselben Namen.
  • Konsultieren Sie die relevanten rechtlichen Materialien.
  • Für alle Bilder und Karten ist der Tag „alt“ erforderlich.
  • HTML-Tags sollten zur Beschreibung von Feldern in allen Online-Formularen verwendet werden.
  • Ankertext ist der Text, der erscheint, wenn Sie auf einen Link klicken.
  • Sie haben auf jeder Seite Ihrer Website Schaltflächen zum Überspringen der Navigation eingefügt.
  • Verwenden Sie geeignete Überschriften-Tags, um alle Textinformationen zu organisieren.
  • Alle PDFs müssen sichtbar sein.
  • Jedes Video sollte Untertitel, Transkripte und Audiobeschreibungen enthalten.
  • Der Farbkontrast auf Ihren Websites sollte den WCAG-Standards entsprechen.
  • Sämtliche Schriftarten müssen zur Verfügung gestellt werden.
  • Spaltennamen, Zeilenbeschriftungen und Zelldaten sollten alle in allen HTML-Tabellen enthalten sein.
  • Alle auf Ihre Website hochgeladenen Audiodateien sollten von einer Textbeschreibung begleitet werden.
  • Die CTA-Schaltflächen Ihrer Website sollten alle mit einem verständlichen Namen und einer ARIA-Kennung gekennzeichnet sein.
  • Jeder Teil Ihrer Website muss über Tastaturkürzel vollständig zugänglich sein.
  • Erstellen Sie eine Seite mit Barrierefreiheitsrichtlinien für die Website.
  • Bieten Sie Besuchern eine klare Möglichkeit zur Kontaktaufnahme, wenn sie Hilfe bei der Beschaffung von Informationen zur Barrierefreiheit benötigen.
  • Überprüfen Sie die Benutzerfreundlichkeit Ihrer Website im Hinblick auf die Web Content Accessibility Standards.
  • Um größere Barrierefreiheitsprobleme nicht zu ignorieren, wird empfohlen, die Überprüfung der Barrierefreiheit Ihrer Website zu automatisieren.

Abschluss

Das Wesentliche ist, dass jeder Benutzer die gleichen Zugriffsrechte auf jede Website haben sollte. Da die Abweisung selbst eines kleinen Teils der Kunden eines Unternehmens zu einem Rückgang der Konversionsraten und des Umsatzes führen kann, ist dieses Konzept ethisch und moralisch sinnvoll und finanziell sinnvoll.

Unsere ADA-Compliance-Website-Design-Checkliste ist ein hilfreiches Tool, mit dem Sie sicherstellen können, dass Ihre Website den Anforderungen jedes einzelnen Kunden entspricht, was auf lange Sicht Ihrem Ruf und Ihrer Rentabilität zugute kommt.

Wenn Sie noch darüber nachdenken, wie es weitergehen soll, rufen Sie unsere Experten bei JanBask Digital Design an, um unsere Vorteile zu nutzen Website-Design-Dienstleistungen.