Skip to main content
2025-06-17β€’5 min readβ€’navable Teamβ€’
accessible navigation elements checklistaccessible linksaccessible buttonsdigital accessibilityBFSG (Accessibility Strengthening Act)WCAG 2.1Web Accessibilityaccessible navigationaccessible user interfacedigital inclusion

Accessible Links & Buttons – Checklist: Maximize Your Website Accessibility

Starting June 28, 2025, the Accessibility Strengthening Act (BFSG) will become mandatory. It requires all companies to design their digital offerings accessibly. This includes designing links and buttons on your website so that they are accessible to all users, including people with disabilities. By implementing the Web Content Accessibility Guidelines (WCAG) 2.1, you can ensure your website's accessibility.

πŸ”Ž Why Accessible Links & Buttons are Essential for Your Website

Accessible navigation elements like links and buttons enable all users – including those with visual impairments, motor limitations, or cognitive disabilities – to use your website equally.

Your Advantages:

  • Legal certainty through compliance with BFSG: Companies that do not design their links and buttons accessibly risk fines and legal warnings.
  • Expansion of the target audience: Accessible websites reach people with various disabilities, thereby expanding your customer base.
  • Better visibility on Google: Google favors websites that comply with WCAG 2.1 guidelines. This means accessible websites gain better visibility in search engines.
  • Optimized User Experience (UX)

βœ… Checklist: How to Design Accessible Links & Buttons

1. Accessible Links: Understandable, Visible & Clear

Accessible links should be understandable, easily recognizable, and functional. This allows users to identify and use them without difficulty.

βœ” Descriptive link text: Avoid generic phrases like "click here" or "more". Instead, the link text should clearly describe the purpose, e.g., "Read more about the benefits of accessible websites for your company".

βœ” Visual emphasis: Links should be highlighted not only by color change but also by underlining, preceding symbols, or bold print to clearly distinguish them from normal text.

βœ” Clearly indicate the link target: If a link opens a new page or a document, this should be made clear. For linked documents, it is mandatory to indicate that it is a document.

πŸ“Œ Example of accessible links:

  • ❌ Poor: "Click here to learn more"
  • βœ… Good: "Read more about the benefits of accessible websites for your company"

2. Accessible Buttons: User Guidance through Clear Design

An accessible button must be clearly visible, easy to click, and accessible to ensure effective interaction.

βœ” Clear, action-oriented text: Buttons should always indicate a clear action, e.g., "Register now" instead of "Submit".

βœ” Alternative texts for controls: The function of the element should be clearly named (e.g., "Search") and the designation kept as short as possible.

βœ” Sufficient contrast: Ensure the button text has sufficient contrast against the background (at least 4.5:1).

βœ” Large, clickable area: Buttons should offer a sufficiently large area to be easily operated with a mouse, keyboard, as well as touchscreen devices.

βœ” Visual feedback: Ensure the button provides visual feedback when focused or pressed (e.g., through color change or animations).

πŸ“Œ Example of accessible buttons:

  • ❌ Poor: A button in the same color as the background without text
  • βœ… Good: A button with clear labeling like "Go to registration now" and good color contrast to the background

❗ Links and Buttons Not Accessible? Act Now with navable!

πŸš€ Your Solution for Accessible Links and Buttons with navable

πŸ›  navable Layover Tool: Immediate Accessibility Optimization for Your Website

βœ” Automatic accessibility improvement (ARIA labels, contrasts, HTML lang)

βœ” Progressive optimization – runs automatically in the background
(Note: Do not replace a comprehensive web analysis to ensure full accessibility.)

βœ” Individual customizations by users (font, contrast, reading mode, link highlighting, filters for images/animations)

βœ” Optimized keyboard navigation for easy use without a mouse

πŸ” navable Audit: Accessibility Analysis of Your Website

πŸ“Š In-depth BFSG analyses and WCAG review for sustainable accessibility

πŸ‘‰ To our Product Page

πŸ“§ [email protected]

Checklist: Accessible Links & Buttons

  • Clear Visual Distinction: βœ… Links & buttons must clearly stand out from the rest of the text.

  • Additional Visual Cues: βœ… Do not use color alone for identification.

  • Unique Link Texts: βœ… Formulate link texts precisely and contextually.

  • Focus Indicators: βœ… Clearly highlight the currently focused element.

  • Sufficient Size & Spacing: βœ… Ensure enough space between clickable elements.

Stay Updated

Get accessibility tips and updates.

Our Top Posts: