•  


Axe Rules | Deque University | Deque Systems

Links must be distinguishable without relying on color

Rule ID: link-in-text-block
User Impact: Serious
Guidelines : WCAG 2.1 (A), WCAG 2.0 (A), Trusted Tester

Start building more accessible experiences

Axe DevTools Pro helps dev teams find and fix up to 80% of accessibility issues while coding. No experience required. Get started with your free trial today.

Compliance Data & Impact

User Impact

Serious
Minor
Critical

Disabilities Affected

  • Low Vision
  • Colorblindness

Standard(s)

  • WCAG 2.1 (A)
  • WCAG 2.0 (A)
  • Trusted Tester

WCAG Success Criteria [WCAG 2.1 (A)]

  • 1.4.1: MUST: Use of Color

WCAG Success Criteria [WCAG 2.0 (A)]

  • 1.4.1: MUST: Use of Color

Trusted Tester Guidelines

  • 13.A: MUST: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.

How to Fix the Problem

Ensure all links that appear in blocks of text have a color contrast difference of at least 3:1 with the surrounding text to ensure that users who cannot distinguish between the colors can still find the link.

When the link has no distinct style, and it has a contrast difference of 3:1 or higher, you must manually test to verify that the link gets distinct style on focus and hover.

Success Criterion : Ensure color contrast of at least 3:1 for link text.

Deque's open-source aXe and browser extensions (for WorldSpace Attest and Comply) products are excellent, reliable tools to help you analyze the contrast ratio of your colors and tell you if they pass the 3:1 ratio guidelines or not.

Why it Matters

Some people with low vision experience low contrast, meaning that there aren't very many bright or dark areas. Everything tends to appear about the same brightness, which makes it hard to distinguish outlines, borders, edges, and details. Text that is too close in luminance (brightness) to the background can be hard to read.

There are nearly three times more individuals with low vision than those with total blindness. One person in twelve has a color deficiency - about 8% of men and 0.4% of women in the US. A person with low vision or color blindness is unable to distinguish text against a background without sufficient contrast.

When a sufficient color contrast ratio of 3:1 is not present to distinguish link text color from surrounding text color, users with low vision who experience low contrast cannot detect visually that the text is intended to function as a link.

Rule Description

Ensures users who cannot distinguish between colors can tell when text is a link by verifying the link has either a distinct style that does not rely on color or has a contrast difference of greater than 3:1 (which alerts you that manual testing is required).

The Algorithm (in simple terms)

Checks all links that appear in blocks of text for a color contrast difference of at least 3:1 with the surrounding text to ensure that users who cannot distinguish between the colors can still find the link.

This rule looks at common ways to distinguish links from surrounding text, including underline, font styling, border, and background. If the link has a distinct style that does not rely on color, there is no violation (pass). If the link has no distinct style and it has a contrast difference less than 3:1, there is a violation (fail). When the link has no distinct style, and it has a contrast difference of 3:1 or higher, you must verify that the link gets distinct style on focus and hover (manual testing required), as this cannot be automated reliably.

Resources

Other Resources

You may also want to check out these other resources.

  • G18: Ensuring that a contrast ratio of at least 4.5:1 exists between text (and images of text) and background behind the text
  • W3C Understanding Success Criterion 1.4.3: Contrast (Minimum)
  • Luminosity Colour Contrast Ratio Analyser

Refer to the complete list of axe 4.7 rules .

Was this information helpful?

You have already given your feedback, thank you..

Your response was as follows:

Was this information helpful?
Date/Time feedback was submitted:

- "漢字路" 한글한자자동변환 서비스는 교육부 고전문헌국역지원사업의 지원으로 구축되었습니다.
- "漢字路" 한글한자자동변환 서비스는 전통문화연구회 "울산대학교한국어처리연구실 옥철영(IT융합전공)교수팀"에서 개발한 한글한자자동변환기를 바탕하여 지속적으로 공동 연구 개발하고 있는 서비스입니다.
- 현재 고유명사(인명, 지명등)을 비롯한 여러 변환오류가 있으며 이를 해결하고자 많은 연구 개발을 진행하고자 하고 있습니다. 이를 인지하시고 다른 곳에서 인용시 한자 변환 결과를 한번 더 검토하시고 사용해 주시기 바랍니다.
- 변환오류 및 건의,문의사항은 juntong@juntong.or.kr로 메일로 보내주시면 감사하겠습니다. .
Copyright ⓒ 2020 By '전통문화연구회(傳統文化硏究會)' All Rights reserved.
 한국   대만   중국   일본