2.4.7 Fokus Sichtbar

Wenn der Tastaturfokus nicht oder nur unzureichend sichtbar ist, erschwert dies die Navigation mit der Tastatur erheblich.

Ein gut sichtbarer Rahmen kennzeichnet fokussierte:

  • Links
  • Schaltflächen, Button
  • Formularfelder/Steuerelemente (Textfelder, Auswahlfelder, Optionsfelder usw.)
  • Verknüpfte grafische Elemente usw.

Unter dem Thema 2.2.1 Bedienung über Tastatur kannst du nachlesen wie du durch deine Website navigierst.

CSS-Attribut

Besonders geeignet ist das CSS-Attribut outline, z. B. outline: 2px dotted black.

Fokus-Status bei Buttons

Drei Beispiele von Buttons, einmal ohne Interaktion, einmal mit interaktion wo sich aber nichts geändert hat und einmal mit gestrichelter Linie um den Button

Link-Markierungsmöglichkeiten

Drei Beispiel von Links, einmal ein schlechter, einmal mit Farbe unterschieden zum Text und einmal einen Link mit Farbunterschied und unterstrichen
Vorheriges Thema
Zurück zur Lektion
Nächste Lektion