Links

Accessibility Techniques for Links
Topic	Technique	WCAG AA Requirement
Semantic Markup and Purpose	Link Markup: Links MUST be semantically designated as such. Note: Ideally this means using an `<a>` element with a valid `href` value. In rare problematic cases, setting `role="link"` (and adding all other aspects of link functionality) may be acceptable. Testing methodology 4.1.2.a	Required WCAG 4.1.2
Semantic Markup and Purpose	Links Versus Buttons: Links SHOULD be used only for actions that take the user to other locations, and SHOULD NOT be used for button-like functionality. Note 1: "Other locations" means other web pages, or to other locations in the same web page. Typically, the URL will change after activating a link. Note 2: "Button-like functionality" means scripted features, including submitting forms.	Best Practice
Link Text	Discernible Text: A link MUST have programmatically discernible text, as determined by the accessible name calculation algorithm. Testing methodology 4.1.2.a	Required WCAG 4.1.2
	Distinguishable Link Purpose: The purpose of each link MUST be understandable and distinguishable from other links on the same page, either from the link text alone (ideally), or from the immediate surrounding context of the link. Testing methodology 2.4.4.a	Required WCAG 2.4.4
	Avoid "Link" (or Similar) in the Link Text: The link text SHOULD NOT state its semantic role (e.g. don't say "link to..."), because screen readers already state the role before reading the link text.	Best Practice
	Consistent Link Text Across Pages: Links to the same destinations MUST be consistently identified with the same (or very similar) link text across all pages of the site. Testing methodology 3.2.4.a	Required WCAG 3.2.4
	Links Opening In New Tab or Window: A link that opens in a new window or tab SHOULD indicate that it opens in a new window or tab.	Best Practice
	Links to Non-HTML Files: A link to a file or destination in a non-HTML format (e.g. MS Word, PDF, plain text, etc.) SHOULD indicate the type of file or destination.	Best Practice
	Links to External Sites: A link to an external site MAY indicate that it leads to an external site.	Best Practice
Keyboard Accessibility	Keyboard-Focusable: Links MUST be keyboard-focusable. Testing methodology 2.1.1.a	Required WCAG 2.1.1
Keyboard Accessibility	Keyboard Activation: Links MUST activate with the enter/return key. Testing methodology 2.1.1.a	Required WCAG 2.1.1
Focus Order	Focus Order: The navigation order of focusable elements (links, form elements, etc.) MUST be logical and intuitive. Testing methodology 2.4.3.a	Required WCAG 2.4.3
Focus Order	Tabindex: The `tabindex` attribute SHOULD NOT be used with positive values to customize the tab order (e.g. don't use `tabindex="1"`).	Best Practice
Link Colors, Contrast, and Styles	Links Visually Distinguishable from Non-Links: Links MUST be visually distinguishable from surrounding non-link text. Testing methodology 1.4.1.b	Required WCAG 1.4.1
	Color as a Way to Visually Distinguish Links: Color alone MUST NOT be used as the only way to distinguish links from surrounding text unless the color contrast between the link and the surrounding text is at least 3 to 1 and an additional differentiation (e.g. underline, outline, etc.) is provided when the link is hovered or receives focus. Testing methodology 1.4.1.b	Required WCAG 1.4.1
	Link Contrast: Links MUST have a contrast ratio of 4.5 to 1 (for small text) or 3 to 1 (for large text) against their background. Testing methodology 1.4.3.a Testing methodology 1.4.3.b	Required WCAG 1.4.3
Target Size	Target Size: Links SHOULD measure a minimum of 44px by 44px. Note: Inline links in paragraphs or blocks of text MAY be smaller.	Best Practice
Visual Focus Indicator	Focus Indicator: All links MUST show a visual focus indicator when in focus. Testing methodology 2.4.7.a	Required WCAG 2.4.7
	Enhanced Focus Indicator: Links MAY have enhanced visual focus indicator styles.	Best Practice
	Focus Indicator Contrast: The contrast of all visual focus indicators against the background MUST be at least 3 to 1.	Required WCAG 1.4.11 (WCAG 2.1)
Visual Hover Indicator	Enhanced Hover Indicator: Links SHOULD have enhanced visual hover indicator styles.	Best Practice
Visual Hover Indicator	Hover Cursor Style: On hover over a link, the mouse cursor SHOULD appear as the pointer style, to provide a visual confirmation of the link role. Note: On most browsers, the pointer style is represented by an icon of a hand with the index finger pointing forward.	Best Practice
In-Page Navigation	Skip Navigation: A keyboard-functional "skip" link SHOULD be provided to allow keyboard users to navigate directly to the main content. Note 1: The "skip" link SHOULD be the first focusable element on the page. Note 2: The "skip" link MUST be either visible at all times or visible on keyboard focus. Note 3: "Skip" links, landmarks (e.g. `<nav>`, `<main>`, etc.), and page table of contents are each valid and sufficient methods to satisfy the WCAG 2.4.1 requirement to allow users to bypass blocks of content. Ideally the design would include all of these techniques, where appropriate. Testing methodology 2.4.1.a	Required WCAG 2.4.1 (This technique is one way to satisfy this requirement)
In-Page Navigation	Page Table of Contents: A table of contents for the page MAY be included at the top of the content or in the header. Note: Ideally, the links in the table of contents SHOULD correspond to the heading structure in the page content. Testing methodology 2.4.1.a	Required WCAG 2.4.1 (This technique is one way to satisfy this requirement)