Fix "Link indistinguishable from nearby text" in HTML
Why it's a problem
A link marked by colour alone disappears for colour-blind users or under low contrast: nothing signals that it is a link. RGAA requires a distinction that does not rely on colour alone.
How to fix it — HTML
Underline the link, or give it another permanent visual cue (weight, border). If you insist on removing the underline, the contrast between link and text colour must reach 3:1, AND an extra distinction must appear on hover and focus.
<p>Consultez <a href="/tarifs" style="color:#2f6fd0;text-decoration:none">nos tarifs</a>.</p><p>Consultez <a href="/tarifs" class="lien">nos tarifs</a>.</p>
<style>
/* Le soulignement est le repère le plus sûr : il ne dépend d'aucune perception de couleur. */
.lien { text-decoration: underline; text-underline-offset: 2px; }
.lien:hover, .lien:focus-visible { text-decoration-thickness: 2px; }
</style>Check your site in 30 seconds
Conformly detects this kind of issue across all your pages, continuously, and alerts you on every regression.
Free scan