Offscreen content is hidden from assistive technology

Offscreen-Inhalte beziehen sich auf den Inhalt einer Webseite, der zwar vorhanden ist, für Benutzer jedoch nicht sichtbar ist, da er außerhalb des sichtbaren Bereichs des Bildschirms liegt. Dieser Inhalt wird oft verwendet, um die Benutzererfahrung zu verbessern, indem er zusätzlichen Kontext oder Informationen bereitstellt, kann aber auch für Benutzer mit Hilfstechnologien wie Bildschirmleseprogrammen eine Herausforderung darstellen.
Bildschirmleseprogramme sind Softwareprogramme, die den Inhalt einer Webseite für Benutzer, die blind oder sehbehindert sind, laut vorlesen. Sie basieren auf dem zugrunde liegenden Code einer Webseite, um die Struktur und Hierarchie des Inhalts zu verstehen und zu bestimmen, welche Elemente wichtig sind und laut vorgelesen werden sollten. Wenn Offscreen-Inhalte für Bildschirmleseprogramme verborgen sind, kann es für Benutzer mit Hilfstechnologien schwierig oder unmöglich sein, auf sie zuzugreifen und sie zu verstehen.
Es gibt mehrere Möglichkeiten, wie Offscreen-Inhalte vor Hilfstechnologien verborgen werden können, darunter das Verwenden von CSS, um den Inhalt außerhalb des Bildschirms zu positionieren, das Verwenden von display:none
oder visibility:hidden
Styles oder das Verwenden des aria-hidden
Attributs. Während diese Techniken nützlich sein können, um Inhalte zu verbergen, die für den Benutzer nicht relevant sind, sollten sie mit Vorsicht angewendet werden, wenn es um Offscreen-Inhalte geht, die für Benutzer mit Hilfstechnologien wichtig sind.
Eine Möglichkeit, sicherzustellen, dass Offscreen-Inhalte für Hilfstechnologien zugänglich sind, besteht darin, das aria-label
oder aria-labelledby
Attribut zu verwenden, um eine beschreibende Bezeichnung für den Inhalt bereitzustellen. Dies ermöglicht es Bildschirmleseprogrammen, die Anwesenheit des Inhalts anzukündigen und Benutzern die Möglichkeit zu geben, darauf zu navigieren.
Eine weitere Option ist die Verwendung des tabindex
Attributs, um den Offscreen-Inhalt fokussierbar zu machen, wodurch Benutzern ermöglicht wird, auf ihn zu wechseln und ihn mithilfe der Tastaturnavigation zu erreichen.
Insgesamt ist es wichtig, die Barrierefreiheit von Offscreen-Inhalten auf Webseiten zu berücksichtigen, da sie die Benutzererfahrung für diejenigen mit Hilfstechnologien erheblich beeinflussen kann. Indem sichergestellt wird, dass Offscreen-Inhalte ordnungsgemäß gekennzeichnet und fokussierbar sind, können Webentwickler eine inklusive und barrierefreie Erfahrung für alle Benutzer ermöglichen.
Ähnliche Artikel:
Überschriftenelemente werden in einer fortlaufenden absteigenden Reihenfolge angezeigt Offscreen content is hidden from assistive technology `<dl>`-Elemente enthalten ausschließlich Gruppen aus `<dt>`- und `<dd>`-Elementen sowie `<script>`-, `<template>`- oder `<div>`-Elemente, die richtig angeordnet sind. ARIA `tooltip`-Elemente haben zugängliche Namen Die Elemente mit einer ARIA-`[role]`, deren untergeordnete Elemente eine bestimmte `[role]` enthalten müssen, haben alle erforderlichen untergeordneten Elemente. Interactive elements indicate their purpose and state `button`-, `link`- und `menuitem`-Elemente haben zugängliche Namen `<video>`-Elemente enthalten ein `<track>`-Element mit `[kind="captions"]` `[aria-*]`-Attribute sind gültig und richtig geschrieben `[aria-hidden="true"]` ist in dem Dokument `<body>` nicht vorhanden