Web accessibility is a key to success for any brand. Here are some do’s and don’ts for animated, scrolling, flashing, or otherwise moving content.
3%. That’s about how much of the internet is accessible for people with disabilities (PWD) as of 2022.
We can and must do better — because it’s the right thing to do. And it’s not only the right thing to do, it’s also the profitable thing to do, especially knowing that the global disability market controls over $13 trillion in disposal income, and PWD control $1.28 trillion in disposable income in the US alone!
Overlooking or under-considering accessibility standards in online development, design, and social media content creation leaves people with disabilities excluded and vulnerable in an increasingly
digital world. There are also additional reasons for brands to take accessibility seriously: It’s bad for business. Think of it this way: Why would create preventable barriers that could keep up to 16% of the world’s population (some 1.3 billion people, or 1 in 6 people worldwide) from accessing your brand’s communities and products?
At Sociality Squared (S2), we are committed to continually improving our understanding and application of accessibility best practices as a core value and fundamental tenet of our approach.
That’s why we were proud to recently offer our team a social media and multimedia accessibility training session from TPGi, an accessibility solutions provider that supports all phases of accessibility through best-in-class management software and professional services.
The training session provided an expansive overview of multiple facets of accessibility. We’re excited to share some of what we learned with you over the course of several posts on this blog.
This post is the second in the series — the first entry discussed audio accessibility. This time, we’ll dive into some accessibility do’s and don’ts related to moving content.
Web Accessibility for Brands: Moving Content
What Is Moving Content?
Content that conveys a sense of motion can be used to give an otherwise static website or social media feed a more lively feel. This could take the form of sliders or carousels, embedded videos, animated GIFs, loading animations, calls to action, auto-updated content, and more — any or all of which could have unintended and unfavorable repercussions for people with disabilities.
For example, moving content may contain meaningful information that people with disabilities are unable to perceive. Additionally, the movement may be so distracting as to make the webpage unusable for people with some types of disabilities. Similarly, content that constantly changes may make it impossible for people with some types of disabilities to concentrate on anything else on the page.
Of course, the internet is full of moving content — and that’s okay! This is not to say that you cannot ever use it for your brand. However, it is important to remember to consider the impact it may have on some users and take steps to ensure that your moving content is effective, safe, and accessible.
Here are some tips to get you started. Many of these apply to websites, but it’s important not to rely solely on social media platforms for all accessibility best practices.
Do: Limit the Amount of Time Content Is Moving Unmanaged, and Provide the User with Controls to Manage the Content
The Web Content Accessibility Guidelines (WCAG), part of a series of guidelines published by the Web Accessibility Initiative of the World Wide Web Consortium, provides some success criteria for moving, blinking, scrolling, or auto-updating information.
According to WCAG, any such content that starts automatically, lasts more than five seconds, and is presented in parallel with other content must include a mechanism for the user to pause, stop, or hide it unless the movement, blinking, or scrolling is part of an activity where it is essential.
Don’t: Let Content Move for More Than Five Seconds Without Providing a Mechanism for User Control
Moving content can be a severe distraction for some people, and five seconds was chosen by WCAG as being long enough to get a user’s attention but not so long that a user cannot wait out the distraction if necessary to use the page.
Auto-updating content is exempted from this rule. However, any auto-updating content that starts automatically and is presented in parallel with other content must also include a mechanism for the user to manage the content unless the auto-updating is part of an activity where it is essential.
Do: Provide a Version of Content That Doesn’t Use Animated Effects
To prevent some users from suffering ill effects from user interaction-driven animated content, provide a control that allows the user to activate the content in a non-animated format as well as text instructions so that users are aware of the control and what it does.
Additionally, you can ensure that your webpage respects user settings for reduced motion preferences at the system level. Most modern browsers allow for this, meaning your website will adhere to the user’s settings for turning off animations or reducing their motion.
Don’t: Use Moving Content Unless Necessary
Website owners should be judicious about their use of moving content as a general practice; however, it’s also worth noting that, in some cases, the consequences can be serious. Blinking or flashing content can even trigger seizures in people with photosensitive conditions.
Examples of this type of content can include:
- Music videos of nightclub strobe lighting
- Cartoons with exaggerated physical actions
- Calls-to-action that change color and size rapidly to attract attention
- Animations or video footage of lightning strikes or flickering light
- Flash animation of a light switch rave
Not every instance of this type of content will necessarily trigger seizures in some users; thresholds of acceptability are determined by the speed and suddenness of the changes, the extent of the variations in contrast and brightness, and how long the flashing is maintained.
For blinking and flashing content, WCAG success criteria outline that web pages should not contain anything that flashes more than three times in any one-second period or uses flashing that is below the general flash and red flash thresholds. (A general flash is defined as a pair of opposing changes in relative luminance of 10% or more of the maximum relative luminance where the relative luminance of the darker image is below 0.80; and where “a pair of opposing changes” is an increase followed by a decrease or a decrease followed by an increase. Meanwhile, a red flash is defined as any pair of opposing transitions involving a saturated red.).
Generally speaking, blinking and flashing content can be made safe by the following three methods:
- Restricting the flashing rate to a maximum of three flashes per second
- Keeping the flashes below the threshold for general and red flash
- Restricting the flashing area to 25% of 10 degrees of the visual field
For content on social media that has flashing, it is also a best practice to have a trigger warning on the content.
Do: Consider Whether the Moving Content Is Necessary
As a general rule of thumb, website owners should ask themselves whether a given piece of moving content needs to be included at all. If the moving content does not add clarity or help the user understand the website content, is not necessary to the experience of the website, or does not add any meaningful value, consider removing that piece of moving content.
As a final note: remember that content and trigger warnings are your friends! If your website or social media content includes a button to play a video with strobing lights, add a warning that the video includes strobing lights and provide the ability for the user to control the video.
S2’s Commitment to Web Accessibility
Nobody is perfect, and there is always room to improve inclusivity and accessibility in our businesses and personal lives. At S2, we believe the most important step is the first one — just getting started. Making forward progress toward equity is more important than getting it perfectly right on the first try.
We work to build diversity and accessibility into the fabric of S2, but we also acknowledge the gaps in our understanding and the fact that we will sometimes make mistakes.
Nonetheless, Sociality Squared is committed to continuously getting outside perspectives and expertise, auditing our own work, fostering diversity within our team, and constantly working to improve ourselves and our society.
Additionally, we recommend following these advocates for just some of the many perspectives from the disability community:
- Andrew Pulrang
- Haben Girma
- ChanceyFleet
- Mark Greenfield
- Alice Wong
- Kendall Ciesemier
- Carly Findlay
- Imani Barbarin
- And many more — there are plenty of further advocates with valuable insight and perspectives, so we suggest spending some time Googling or looking on social media to learn more about this topic.
For a comprehensive social media and content marketing audit that includes web accessibility, reach out today.
Subscribe to our monthly S2xAccess newsletter:
