Reducing Motion to Improve Accessibility

Content Warning: This blog post contains gifs. Hey friends! In this post, I am going to walk you through a newer media query (to me): prefers-reduced-motion . Quick confession: I know CSS fundamentals, but I am pretty behind on all the new stuff that …


This content originally appeared on a11y with Lindsey and was authored by a11y with Lindsey

Content Warning: This blog post contains gifs. Hey friends! In this post, I am going to walk you through a newer media query (to me): prefers-reduced-motion . Quick confession: I know CSS fundamentals, but I am pretty behind on all the new stuff that has been coming out. Because my focus is usually on accessibility, I am focusing far more on HTML and JavaScript. When I focus on CSS, it's ensuring proper color contrast or custom focus states. Sometimes I use CSS to make checkboxes keyboard accessible . I always associated media queries with responsive design. I never thought of media queries as an accessibility enhancement. In this post, we are updating my blog by: Adding the prefers-reduced-motion query Adding a user-controlled setting for reducing motion. Understanding prefers…


This content originally appeared on a11y with Lindsey and was authored by a11y with Lindsey


Print Share Comment Cite Upload Translate
APA
a11y with Lindsey | Sciencx (2023-01-29T03:49:21+00:00) » Reducing Motion to Improve Accessibility. Retrieved from https://www.scien.cx/2019/08/13/reducing-motion-to-improve-accessibility/.
MLA
" » Reducing Motion to Improve Accessibility." a11y with Lindsey | Sciencx - Tuesday August 13, 2019, https://www.scien.cx/2019/08/13/reducing-motion-to-improve-accessibility/
HARVARD
a11y with Lindsey | Sciencx Tuesday August 13, 2019 » Reducing Motion to Improve Accessibility., viewed 2023-01-29T03:49:21+00:00,<https://www.scien.cx/2019/08/13/reducing-motion-to-improve-accessibility/>
VANCOUVER
a11y with Lindsey | Sciencx - » Reducing Motion to Improve Accessibility. [Internet]. [Accessed 2023-01-29T03:49:21+00:00]. Available from: https://www.scien.cx/2019/08/13/reducing-motion-to-improve-accessibility/
CHICAGO
" » Reducing Motion to Improve Accessibility." a11y with Lindsey | Sciencx - Accessed 2023-01-29T03:49:21+00:00. https://www.scien.cx/2019/08/13/reducing-motion-to-improve-accessibility/
IEEE
" » Reducing Motion to Improve Accessibility." a11y with Lindsey | Sciencx [Online]. Available: https://www.scien.cx/2019/08/13/reducing-motion-to-improve-accessibility/. [Accessed: 2023-01-29T03:49:21+00:00]
rf:citation
» Reducing Motion to Improve Accessibility | a11y with Lindsey | Sciencx | https://www.scien.cx/2019/08/13/reducing-motion-to-improve-accessibility/ | 2023-01-29T03:49:21+00:00
https://github.com/addpipe/simple-recorderjs-demo



Related Posts