Three important technical settings for website visitors with physical limitations or other impairments are crucial to ensuring comprehensive accessibility.

To activate these features, go to your website editor:

• Click the gear icon in the top left.
• Expand the additional options under "Website Settings".
• Select the last tab "Accessibility".
• Activate all three options there: "Enable Aria", "Enable Skip to Content", and "Enable Focus Indicator".
• Save on the green button and republish the website on the blue button.

"Enable Aria"

Activating ARIA (Accessible Rich Internet Applications) labels in the website code helps, for example, visually impaired users understand elements without text labels.

"Enable Skip to Content"

Website visitors who navigate solely with the keyboard (e.g., due to limited hand function) use the Tab key to jump from element to element. This also means that every time they open a new page on your website, they have to tab through all the links in the main navigation (header) to get to the main content of the page. The "Skip to Content" setting gives them an option to skip tabbing through the navigation.

"Enable Focus Indicator"

The focus indicator is a colored border that shows which element (button, link, ...) on the website is currently in focus, so it can be "clicked" by pressing the Enter key or the Spacebar. This is visibly displayed for all visitors and should therefore match the design of your page in color.

FAQ - Frequently Asked Questions

How do you operate a website using only the keyboard?

To operate a dropdown menu with the keyboard, users can navigate through the menu items and the page with the Tab key. When the desired item is reached, the menu can be opened with the Enter key or the Spacebar, and options can be navigated using the arrow keys. This allows the menu to be controlled entirely without a mouse.

How do you design the Focus Indicator?

The focus indicator is transparent by default.
You can design it under Global Design > Accessibility Design > Focus Indicator.
There you can adjust the color and thickness (Focus Size) of the outline as well as the border style (Focus Type).

How do you design the "Skip to Content" button?

• Technical Background of the "Skip to Content" function
  The "Skip to Content" option is technically enabled by a tabindex="-1" property in the website's navigation code. This instructs assistive technologies to ignore this specific element. The visual display of the website for other visitors is not affected by this.

• User Experience
  When a screen reader user opens a new page on the website, a "Skip to Content" element automatically appears in the top left corner of the browser window. This is the first interactive element that the screen reader reads aloud. If the user presses the spacebar while the focus is on this element, the navigation is skipped, and the next focusable element is the beginning of the website's main content.

• Designing the "Skip to Content" element
  By default, the "Skip to Content" element inherits the color setting from Global Design > Global Colors > Accent Colors > Primary Accent Color 3.
  You can design the "Skip to Content" element via Global Design > Accessibility > Skip to Content.
  There you can customize the text, background, and border of the element.

Required Practical Steps

You’ll find more helpful articles here:

• Checklist - Accessibility of your website
• How to make your website accessible
• Global colors – How to change your website's color scheme
• Insert alt text for images
• Create and publish an accessibility statement for your website
• How to add a link to your website footer (e.g. for the accessibility statement)

Updated on: 01/07/2025