Add prefers-reduced-motion to accessibility docs (#12038)

CHANGELOG.txt

@@ -32,6 +32,7 @@ Changelog
  * Maintenance: Split `contrib.frontend_cache.backends` into dedicated sub-modules (Andy Babic)
  * Maintenance: Remove unused `docs/autobuild.sh` script (Sævar Öfjörð Magnússon)
  * Fix: Handle choice groups as dictionaries in active filters (Sébastien Corbin)
+ * Docs: Add note about `prefers-reduced-motion` to the accessibility documentation (Roel Koper)
 
 
 6.1.2 (30.05.2024)

CONTRIBUTORS.md

@@ -821,6 +821,7 @@
 * Julie Rymer
 * Byron Peebles
 * Arnar Tumi Þorsteinsson
+* Roel Koper
 
 ## Translators
 

docs/advanced_topics/accessibility_considerations.md

@@ -224,6 +224,24 @@ Readability is fundamental to accessibility. One of the ways to improve text con
 
 (accessibility_resources)=
 
+### prefers-reduced-motion
+
+Some users, such as those with vestibular disorders, may prefer a more static version of your site. You can respect this preference by using the `prefers-reduced-motion` media query in your CSS.
+
+```css
+@media (prefers-reduced-motion) {
+  /* styles to apply if a user's device settings are set to reduced motion */
+    /* for example, disable animations */
+    * {
+        animation: none !important;
+        transition: none !important;
+    }
+}
+```
+
+Note that `prefers-reduced-motion` is only applied for users who enabled this setting in their operating system or browser. This feature is supported by Chrome, Safari and Firefox. For more information on reduced motion, see the [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion).
+
+
 ## Accessibility resources
 
 We focus on considerations specific to Wagtail websites, but there is much more to accessibility. Here are valuable resources to learn more, for developers but also designers and authors:

docs/releases/6.2.md

@@ -45,6 +45,7 @@ depth: 1
  * Document Wagtail's bug bounty policy (Jake Howard)
  * Fix incorrect Sphinx-style code references to use MyST style (Byron Peebles)
  * Document the fact that `Orderable` is not required for inline panels (Bojan Mihelac)
+ * Add note about `prefers-reduced-motion` to the accessibility documentation (Roel Koper)
 
 
 ### Maintenance