WCAG (Level AAA) SC 2.3.2 Three Flashes (w3.org)
Issue description
WCAG 2.3.2, “Three Flashes” builds on the previous WCAG (Level A) SC 2.3.1 Three Flashes or Below Threshold guideline to further safeguard users from content that could induce seizures due to flashing. This criterion is more specific, focusing on flashes that are bright and large enough to cover a significant portion of the screen.
While 2.3.1 allows for some flashing if it’s below certain thresholds of intensity and area, 2.3.2 sets a stricter limit. It states that web pages must not contain anything that flashes more than three times in any one-second period if those flashes are sufficiently large and bright. The reason being:
- Seizure risk: Flashes that are both bright and cover a substantial area of the screen are more likely to induce seizures in susceptible individuals.
- Increased protection: This guideline provides an extra layer of protection for users with photosensitive epilepsy, reducing the risk of seizures even further.
Essentially, this criterion focuses on the most potentially harmful types of flashing—those that are both bright and large. By eliminating these, the chances of someone having a seizure are significantly reduced.
It’s important to note that this guideline doesn’t apply to flashes that are:
- Dim: The flashes are not bright enough to trigger a seizure.
- Small: The flashes cover a small area of the screen.
However, even if flashes meet these exceptions, it’s still crucial to consider the overall user experience and avoid excessive flashing that could be distracting or disorienting.
Related requirements
The following WCAG source criteria are often related to this as well. They can provide additional insights into specific challenges you may be encountering.
- WCAG (Level A) SC 2.3.1 Three Flashes or Below Threshold
- WCAG (Level AAA) SC 2.3.3 Animation from Interactions
Who this issue impacts
Follow the links for additional information on user impairments:
Suggestions for remediation
Remediating WCAG 2.3.2, “Three Flashes” requires eliminating any content that flashes more than three times in any one-second period, especially if those flashes are large and bright. Here’s how:
Avoid rapid flashing
- Remove unnecessary flashing: If flashing content isn’t essential, remove it entirely.
- Reduce frequency: If flashing is necessary, reduce the frequency to three flashes or fewer per second.
- Static alternatives: Replace flashing elements with static alternatives, such as a static image instead of a blinking animation.
Reduce size and brightness
- Smaller areas: If flashing is essential, reduce the size of the flashing area to cover a smaller portion of the screen.
- Lower brightness: Reduce the brightness or intensity of the flashes.
Provide user controls
- Disable animations: Offer a control that allows users to disable animations or flashing content altogether.
- Alternative versions: Provide alternative versions of the content without flashing elements.
Testing
- Flashing test tools: Use tools like the Photosensitive Epilepsy Analysis Tool (PEAT) to analyze your web pages for potentially problematic flashing content. (Trace Rerc – Photosensitive Epilepsy Analysis Tool)
- Manual checks: Carefully review your content to identify any instances of rapid flashing that might exceed the three flashes per second threshold.
Examples
- Animated loading indicators: Replace a flashing loading indicator with a rotating animation or a progress bar.
- Flashing call-to-action buttons: Use a static button with a clear visual cue, such as a contrasting color or an arrow, instead of flashing.
- Blinking cursor: Reduce the blink rate of the cursor or provide an option to disable blinking.
By following these practices, you can create a safer and more inclusive online experience for everyone, including those with photosensitive epilepsy, by minimizing the risk of seizures triggered by flashing content.
