Willkommen auf Zweiter Blick!
Zweiter Blick betrachtet das Internet im Hinblick auf digitale Barrierefreiheit. Hier werden Informationen gesammelt, reflektiert und möglichst verständlich für Interessierte und Betroffene aufgearbeitet. Themen, die ich zuletzt aufgearbeitet habe, findest du auf dieser Startseite.
HTML-Akkordeon
Eine Gruppe von verknüpften Komponenten zum Aus- und Einklappen wird als Akkordeon bezeichnet. Die Darstellung und die erforderlichen Mechanismen können barrierefrei in HTML ohne Scripts realisiert werden.
Welche Maßnahmen dafür in HTML vorzunehmen sind und wie die Darstellung visuell und für Screen Reader optimiert werden kann, wird in diesem Beitrag aufgearbeitet.
HTML <output>-Element
Mit dem output-Element wird ein Container für die Darstellung des Ergebnisses einer Berechnung oder Eingabe durch Nutzer*innen gekennzeichnet.
Assistierende Technologien erkennen den Inhalt als Live-Region,
der vorgelesen wird, ohne dass der Fokus verschoben wird.
Ich habe mit dem Element in einer Testdatei experimentiert und Beobachtungen zu allgemeinen Hinweisen hinzugefügt. Es wird selten verwendet, obwohl es etwa die Barrierefreiheit von Chats auf einfache Weise verbessern kann.
HTML <strong>-Element
Mit dem HTML-Element strong kann ein im Kontext eines Satzes vorrangiger Text hervorgehoben werden.
Auf diese Weise wird ein zentraler Inhalt von Detailinformationen, beiläufigem Formulierungen oder allgemeinem Standardtext abgehoben.
Leider wird das Element vielfach eingesetzt, um visuell eine Überschrift darzustellen. In diesem Artikel sammle ich Beispiele für eine zulässige und problematische Verwendung des Elements.
aria-selected Attribut
Eine erfolgte Auswahl wird bei entsprechendem Einsatz von HTML Elementen visuell durch ein angekreuztes Kästchen oder einen Punkt in einem Kreis angezeigt. Screen Reader verlauten bei korrektem HTML-Einsatz automatisch den jeweiligen Aktivierungszustand.
Gelegentlich werden zur Auswahl jedoch nicht HTML-Standardkomponenten verwendet.
Als visueller Indikator dient dann vielfach eine Änderung von Schriftfarbe, Hintergrund oder eine fette Schrift.
In diesen Fällen wird der Aktivierungszustand technisch mit dem Attribut aria-selected für Screen Reader verdeutlicht.
Ich habe Informationen zur Anwendung und Vergleiche zu weiteren Möglichkeiten der technischen Darstellung des Aktivierungszustands zusammengefasst.
HTML header Element
Der obere Bereich einer Webseite verfügt gewöhnlich über Inhalte und Mechanismen, die für den gesamten Webauftritt von Relevanz sind.
Zur Kennzeichnung dieses Bereiches steht seit HTML5 das header-Element zur Verfügung.
Zur Strukturierung der Hauptregionen und des Codes sollte es verwendet werden. Im Hautinhalt sollte das Element jedoch nur mit Vorsicht eingesetzt werden, insbesondere, weil Screen Reader in unterschiedlichen Browsern ein unterschiedliches Verhalten aufweisen.
Seite in Aufbau
Wenn immer Sie das Baustellen-Symbol oder den Hinweis [Materialsammlung] sehen, werden sie auf merklich unfertige Webseiten stoßen.
Dieser Webauftritt ist in permanenter Entwicklung. Sie können aber schon durch unser Dorf spazieren, in dem noch nicht alles zugepflastert ist.