Eliminate Use of <blink>
Element for Accessibility
Rule ID: blink
Ruleset: axe-core 4.10
User Impact: Serious
Guidelines: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), Section 508, Trusted Tester, EN 301 549
How to Fix the Problem
Remove all instances of the <blink>
HTML element and the text-decoration: blink;
CSS property from your code.
Example to Remove (HTML):
Example to Remove (CSS):
Why:
-
Many modern browsers no longer support the
<blink>
tag or thetext-decoration: blink
style. -
You cannot depend on how the content visually renders in a browser. The code may still exist and trigger violations even if the visual effect is not rendered.
What to do instead:
-
Use accessible techniques to draw attention to content, such as bold text, background colors with sufficient contrast, or ARIA live regions for dynamic updates.
-
If you want to highlight a message, use a visually prominent style (e.g., bold font, colored box) that does not rely on motion.
Why it Matters
Blinking or flashing content can:
-
Be distracting or unreadable, especially for users with cognitive or visual impairments.
-
Impair usability for users with motor challenges due to the difficulty of clicking on moving content.
-
Potentially trigger seizures in sensitive individuals if the blinking is rapid and intense (though
<blink>
typically doesn’t flash at seizure-inducing rates, it’s still discouraged).
Accessibility is about ensuring content is perceivable, operable, and understandable for everyone. Blinking text undermines all three principles.
Rule Description
This rule checks for the presence of any <blink>
elements or CSS rules that apply text-decoration: blink
. These techniques are deprecated and non-compliant with modern accessibility guidelines.
The Algorithm (in simple terms)
-
Search the HTML for any
<blink>
tags. -
Search CSS for the
text-decoration: blink
property. -
Flag the occurrence of either.