Make links distinguishable by using styles other than color

How to fix the problem?

To address the issue, ensure that links are easily distinguishable from surrounding text. You can achieve this by meeting one of the following requirements:

1. Use text underlining, font styling, borders or use a different background color for the link.
2. Maintain a color contrast of at least 3:1 between link text and paragraph text. Manually verify that links receive distinct styles on focus and hover.

BAD:

CORRECT:

A best practice is to underline links to make them distinguishable:

<p>
  Example
  <a href="https://example.com" style="text-decoration: underline"> website </a>
  link
</p>

Why is this important?

Individuals with low vision or color vision deficiencies may have difficulty distinguishing links from regular text when color is the only distinguishing factor.

Color vision deficiency affects approximately 1 in 12 men.