Accessible Links & Buttons according to BFSG | Checklist & Solutions for Accessible Websites
The BFSG has applied since 28 June 2025 to specific products and consumer services. Assess your offering with the BFSG check solution. The checks below help you find technical barriers on your website.
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.
Accessibility is not a direct Google ranking factor (Google Search Central). Clear headings help people navigate and search engines understand the content.
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
Frequently Asked Questions (FAQ) about **Accessible Links** and **Buttons**
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.
Explore criteria in the WCAG hub. Use the Accessibility Audit for machine-evaluable findings and add manual tests.
Further reading and sources
Stay Updated
Get accessibility tips and updates.
Our Top Posts:
- •BFSG Checklist: How to Implement Website Accessibility for Your Business
- •navable MCP v0.2: Dual-Engine Scanning (axe-core + Pa11y/HTMLCS) in One Scan
- •Automate Web Accessibility with AI | navable MCP
- •Install the navable Widget in WordPress: Step by Step
- •BFSG: Which Companies Are Affected? Scope and Exemptions
- •Free Accessibility Testing Directly in VS Code with axe DevTools
- •Accessibility for Agencies: How navable Speeds Up Your Audits
- •Accessible Navigation & Structure according to BFSG | Checklist & Solutions for Accessible Websites
- •Accessible text design: WCAG rules and recommendations
