Artikel barrierefrei schreiben im Code – Wozu em und
Die Verwendung von em
und strong
in HTML hat tatsächlich mit Barrierefreiheit zu tun, insbesondere für Nutzer von Screenreadern. Diese Tags helfen dabei, den Inhalt semantisch korrekt zu strukturieren und wichtige oder hervorgehobene Informationen klar zu kennzeichnen. Hier ist eine Erklärung und ein Beispiel, wie und warum man diese Tags verwendet:
Bedeutung von em
und strong
<em>
(emphasis): Dieser Tag wird verwendet, um Text hervorzuheben oder zu betonen. Ein Screenreader wird diesen Text in der Regel mit einer besonderen Betonung vorlesen, was dem Benutzer hilft zu verstehen, dass dieser Text wichtig ist.<strong>
(strong emphasis): Dieser Tag wird verwendet, um Text besonders stark zu betonen. Ein Screenreader wird diesen Text noch stärker hervorheben, oft als besonders wichtig oder kritisch, was den Benutzer darauf hinweist, dass dieser Text eine größere Bedeutung hat.
Beispiel
Angenommen, wir haben einen Text, der wichtige Informationen über eine Veranstaltung enthält:
Erklärung des Beispiels
<strong>
: Der Tag wird verwendet, um das Datum der Veranstaltung und die Anforderung, das Ticket mitzubringen, hervorzuheben. Dies zeigt dem Benutzer, dass diese Informationen von großer Bedeutung sind.<em>
: Der Tag wird verwendet, um die Wichtigkeit der Pünktlichkeit und das Mitbringen eines gültigen Ausweises zu betonen. Dies macht deutlich, dass diese Aspekte ebenfalls beachtet werden müssen, aber möglicherweise etwas weniger kritisch als die stark hervorgehobenen Informationen.
Auswirkungen auf die Barrierefreiheit
- Screenreader: Diese werden die betonten Wörter und Sätze mit unterschiedlicher Intensität vorlesen, was blinden oder sehbehinderten Benutzern hilft, die Wichtigkeit der Informationen besser zu verstehen.
- Lesbarkeit und Verständnis: Die visuelle Hervorhebung durch
em
undstrong
hilft auch sehenden Nutzern, wichtige Informationen schneller zu erkennen und zu verstehen.
Durch den Einsatz von em
und strong
wird der Inhalt sowohl für Screenreader-Nutzer als auch für sehende Benutzer besser zugänglich und verständlich gemacht.