Informationen
Symbol Barrierefreiheit

Willkommen auf Zweiter Blick!

Auf meiner Startseite finden Sie Hinweise zu aktuellen Beiträgen und News aus der Szene.

Symbolgrafik: Textzug Strong mit Beginnn von Lorem ipsum in einem unregelmäßigen Viereck

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.

Schematische Darstellung: Person mit weißem Stock gelangt über ein Boddenleitsystem zu einem Aufmerksamkeitsfeld

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.

Symbolgrafik für Überschrift: Schriftzug H1 über Balken, die einen Absatz symbolisieren.

Überschriften werden vielfach mit Zusatzinformation, etwa einer inhaltsvollen Aussage zu einem Teaser versehen. Während die visuelle Darstellung im Browser weithin intuitiv ist, herrscht bei der semantischen Darstellung ein Wildwuchs.

Dabei steht für die Kombination einer Überschrift mit einer Zusatzinformation in einem Absatz ein HTML-Element zur Verfügung. Es wird kaum verwendet und scheint kaum bekannt: Das hgroup-Element. Unbekannt und vergessen oder zu vergessen?

Symbolgrafik: WCAG Erfolgskriterium unter der Lupe

Für die Bedienung allein mit der Tastatur ist für Sehende zentral, den Fokus, also den Punkt für Tastatureingaben zu erkennen. In den WCAG 2.2 wurde dafür ein Erfolgskriterium ergänzt, allerdings nur in der Konformitätsstufe AAA.

Die Anforderungen klingen kompliziert, es gibt jedoch einen einfachen Weg zur Umsetzung. Es bedarf lediglich zentraler Anweisungen im CSS-Code.

WCAG 2.2

Die Web Content Accessibility Guidelines wurden am 5. Oktober 2023 als neuer Standard für barrierefreie Webinhalte veröffentlicht. Im Wesentlichen wurden neun Erfolgskriterien ergänzt, aber erstmals auch ein Kriterium als überholt eingestuft und dessen Anforderungen entfernt.

Ich habe für mich strukturierende Übersetzungen zu den neuen Kriterien erstellt und Informationen zum Kontext und zum Verständnis angelegt.

Symbolgrafik Barrierefreiheits-Person stützt sich auf AT. Das T dient als Tisch.

Wer mit einem Screen Reader arbeitet, muss eine Menge textueller Informationen zur Semantik verarbeiten, die bei der visuellen Wahrnehmung spontan erkannt werden. Zusätzliche technische oder redaktionelle Maßnahmen sind meist gut gemeint, führen aber zu unnötigem Wortreichtum.

Wann sind gezielte Vorkehrungen ein Störfaktor und wann sind sie hilfreich? Und was tun, wenn diese Frage nicht eindeutig entschieden werden kann?

Baustellenschild

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.