Links are among the most important elements in digital accessibility – arguably the most important. There are at least 16 unwritten rules you must implement to ensure a link is accessible. These rules aren't complex, but they require adopting a new way of thinking. The more of these rules you implement, the more you'll significantly improve the browsing experience for all users, especially people with disabilities.<\/p>\r\n
The Rules<\/h2>\r\nRule 1 – Avoid the word "link" in the link text<\/h3>\r\n
When screen readers reach a link, they announce to the user that it's a link – there's no need to repeat that in the text itself. Phrases like "link to..." or "click here" are redundant and cumbersome.<\/p>\r\n
Rule 2 – Avoid ALL CAPS (especially in English)<\/h3>\r\n
Writing in all capitals makes it harder for screen readers, which read letter-by-letter, and makes it difficult for people with dyslexia or reading disabilities, as the text appears as one shapeless block.<\/p>\r\n
Rule 3 – Avoid ASCII characters and emoticons in link text<\/h3>\r\n
Symbols like ":–)" can confuse screen readers. According to WCAG section 1.1.1 and criterion H86, you must provide a text alternative for these symbols. If unavoidable, use ARIA or an tag to convey meaning.<\/p>\r\n A screen reader will read every character and symbol in the URL, which is cumbersome and confusing. Instead, provide a clear description like "Visit the Computer Department on the XYZ website."<\/p>\r\n It's recommended not to exceed 100 characters for a link. A link that's too long – for instance, an entire paragraph – hurts users' ability to scan the page or skip between links.<\/p>\r\n Too many links create cognitive overload, especially for users with disabilities. There's no magic number – on a corporate site, 10–20 links is reasonable; on a content site, as needed, but think carefully first.<\/p>\r\n If a link triggers a download, you must indicate this. Links that lead to downloads without warning create confusion and loss of control. On pages with many downloads, specify the file type and consider using an icon with clear alternative text.<\/p>\r\n It's important to indicate in the link text whether clicking will open a new window. You can do this in the link text itself, the title attribute, or with an icon and appropriate description.<\/p>\r\n When links are arranged alphabetically or in a list (1, 2, 3...), add explanatory text before the list (for example: "Browse by letter"). Make sure links are spaced out and large enough to click – especially on mobile devices.<\/p>\r\n In long articles with an internal navigation index, add a brief explanation before the menu, like "Skip to section," to help users understand what they're seeing.<\/p>\r\n A link must be distinguishable even without color. The standard underline is sufficient – or any other clear visual marker. Never rely on color alone to differentiate a link.<\/p>\r\n When an image is a link, the alt text serves as the link text. Describe the action or purpose ("Submit form," "Find," "Search"), not the element type ("Icon," "Image").<\/p>\r\n Empty links – for example, around a logo or entire areas – are common but not accessible. Every link must be focused, active, and contain clear content.<\/p>\r\n Link design and behavior across your site should be uniform on all pages. Consistency is key to understanding and efficient use.<\/p>\r\n If you have no new information to add in the title attribute, simply don't use it. There's no point in hearing the same text twice.<\/p>\r\n A link with no content – no text, no alt-attributed image, no ARIA explanation – is not accessible. Avoid this practice entirely.<\/p>\r\n A link like "Back to top" is better placed at the end of the article, not as a floating element that follows the user. This preserves full keyboard control and ease of use.<\/p>\r\n The rel and rev attributes define the relationship of the link (for example "prev," "next") and help search engines, browsers, and assistive technologies understand the context.<\/p>\r\n Make sure each link state (link, visited, hover, focus, active) has sufficient contrast. This is essential for both vision and navigation within the interface.<\/p>Rule 4 – Avoid using a raw URL as link text<\/h3>\r\n
Rule 5 – Keep links short and concise<\/h2>\r\n
Rule 6 – Limit the number of links on a page<\/h3>\r\n
Rule 7 – Announce downloads<\/h3>\r\n
Rule 8 – Announce new window opens<\/h3>\r\n
Rule 9 – Organize links by context<\/h3>\r\n
Rule 10 – Explain table of contents<\/h3>\r\n
Rule 11 – Ensure clear visual distinction between links and text<\/h3>\r\n
Rule 12 – Use images as links carefully<\/h3>\r\n
Rule 13 – Avoid broken or empty links<\/h3>\r\n
Rule 14 – Stay consistent<\/h3>\r\n
Rule 15 – Don't duplicate information<\/h3>\r\n
Rule 16 – Never use empty links<\/h3>\r\n
Rule 17 – Position floating links correctly<\/h3>\r\n
Rule 18 – Use the rel attribute<\/h3>\r\n
Rule 19 – Ensure link state contrast<\/h3>\r\n