problematische Seite

@@marctrix

<nav> <h2 class="visually-hidden">Hauptnavigation</h2> <ul></ul> </nav>

Genau das! Und nicht (wie Bootstrap das macht) mit einer Klasse sr-only - diese Hinweise sind nämlich sehr oft hilfreich bei abgeschaltetem CSS - nicht nur für Screenreader-Nutzer, sondern auch für Nutzer der Braille-Zeile, für Nutzer ohne Maus (visually Hidden aber Focus able) uswusf - Am Namen sr-only erkennt der Fachmann schon, dass BF hier nicht zu Ende gedacht wurde, weil (nochmal): Accessibility ist nicht Design für Blinde…

??

Was genau hast du gegen sr-only – außer der Benennung?

Ein kurzer Blick ins bootstrap.css offenbart, dass

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; }

dasselbe tut wie das, was beim A11Y Project visually-hidden heißt:

.visually-hidden { /* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility */ position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); } .visually-hidden a:focus, .visually-hidden input:focus, .visually-hidden button:focus { position:static; width:auto; height:auto; }

LLAP 🖖

-- „Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“ —Kurt Weidemann
freiwillige Angabe, für jeden sichtbar
freiwillige Angabe, für jeden sichtbar
freiwillige Angabe, für jeden sichtbar

Vorschau (Nachricht wird im Forum „SELF-Forum“ erscheinen)

  • Keine Tag-Vorschläge verfügbar
  • keine Tags vergeben

abbrechen