"Enter": Navigation überspringen
  • Tab oder Shift + Tab - zum nächsten oder voherigen interaktiven Element springen
  • - innerhalb eines Elements navigieren
  • w a s d - innerhalb eines Elements navigieren
  • Enter - Element aktivieren
  • i - Tastaturbefehle anzeigen
  • CTRL / CMD + + oder - - Ansicht vergrößern oder verkleinern
  • Escape - Popup schließen
  • t - Tooltip anzeigen
  • m - zum Menü

Barrierefreies Internet

prefers-reduced-motion

Prefers-reduced-motion ist eine technische Abfrage im Front­end, mit der Web­sites erkennen, ob Besucher in ihren System­einstel­lungen schnelle Bewe­gungen oder Anima­tionen reduziert haben möchten, sodass die Web­site ihre Anima­tionen entsprechend anpassen kann.

Warum wird prefers-reduced-motion genutzt?

Viele Menschen reagieren empfindlich auf schnelle Effekte wie Licht­reflexe oder Bewegung im Bild­schirm, etwa bei Migräne oder vesti­bulären Stö­rungen. Mit prefers-reduced-motion können Websites Slide­shows, animierte Banner, Parallax-Effekte oder andere bewegte Inhalte auto­matisch reduzieren, ohne dass Inhalte oder Funk­tionen verloren gehen. Auch Karus­sells, Hover-Effekte oder animierte Icons lassen sich damit schonend darstellen. Für alle Nutzer, die diese „reduzierte Bewegung“ nicht akti­viert haben, bleibt alles beim Alten.

Nutzen für Barrierefreiheit und Unternehmen

Die prefers-reduced-motion-Abfrage erhöht die Barriere­freiheit von Web­sites, indem sie den Zugang für Menschen mit gesund­heit­lichen Ein­schrän­kungen erleichtert. Gleich­zeitig wird die Website dadurch noch benutzer­freund­licher, auch für diejenigen, die schnelle Anima­tionen störend finden. Die Umsetzung erfolgt über einfache CSS-Abfragen, ohne dass das Web­design verändert werden muss. Sie entspricht vielmehr den Empfeh­lungen der WCAG für barriere­freie Inhalte. Besucher fühlen sich wohler, bleiben länger auf der Seite und inter­agieren eher mit den Inhalten, wodurch Absprung­raten sinken und das Engagement steigt.

Begierde Wissen