Leksykon IT › Web › prefers-reduced-motion

prefers-reduced-motion

Web Svenska → Zaktualizowano: 2026-10-07

Zapytanie medialne CSS wykrywające, czy użytkownik poprosił system o ograniczenie ruchu i animacji. Pozwala stronom uszanować to ustawienie — istotne dla osób, którym ruch na ekranie powoduje mdłości lub dyskomfort.

Tło: duże animacje, paralaksa, efekty zoomu i rozległe przejścia mogą wywoływać mdłości, zawroty głowy lub migreny u osób z zaburzeniami przedsionkowymi, a innych po prostu rozpraszają. Systemy operacyjne mają opcję „ogranicz ruch”, a @media (prefers-reduced-motion: reduce) pozwala CSS na nią zareagować. Wzorzec: animacje piszemy jak zwykle, a w bloku prefers-reduced-motion: reduce łagodzimy je lub usuwamy (np. zamieniamy duży ruch na zwykłe wygaszenie albo dajemy animation: none). Dobra praktyka: zawsze respektować to ustawienie przy animacjach nieistotnych i zostawiać tylko ruch niosący znaczenie. To wymóg dostępności WCAG — i dobry przykład szanowania wyrażonych preferencji użytkownika.

← Wróć do leksykonu