The TÜFA-TEAM tips at a glance

Status of compliance

We firmly believe that the internet should be available and accessible to everyone and are committed to providing a website that is accessible to the widest possible audience, regardless of their circumstances and abilities.

To achieve this, we adhere as strictly as possible to the World Wide Web Consortium (W3C) Web Content Accessibility Guidelines 2.1 (WCAG 2.1) at AA level. These guidelines explain how to make web content accessible to people with a variety of disabilities. Following these guidelines helps us to ensure that the website is accessible to all people: blind people, people with motor impairments, visual impairments, cognitive disabilities and others.

Various technologies are used on this website to ensure that it is as accessible as possible at all times. We use an accessibility interface that allows people with certain disabilities to customise the UI (user interface) of the website and design it according to their personal needs.

In addition, the website uses an AI-based application that runs in the background and constantly optimises the level of accessibility. This application corrects the website's HTML code and adapts its functionality and behaviour to the screen readers used by blind users and to the keyboard functions used by people with motor impairments.

If you have found a malfunction or have suggestions for improvement, we look forward to hearing from you. You can contact the operators of the website using the following e-mail info@tuefa.de

Screen reader and keyboard navigation

Our website implements the Accessible Rich Internet Applications (ARIA) attributes and various behavioural changes to ensure that blind users visiting the website with a screen reader can read, understand and enjoy the features of the website. Once a user with a screen reader enters your website, they will immediately receive a prompt to enter the screen reader profile so that they can browse and operate your website effectively. Here's how our website covers some of the key requirements for screen readers, along with console screenshots of code examples:

1. Optimisation for screen readers: we run a background process that learns the components of the website from top to bottom to ensure compliance even when the website is updated. In this process, we provide screen readers with meaningful data using the ARIA attribute set. For example, we provide accurate form labels, descriptions for action icons (social media icons, search icons, shopping cart icons, etc.), validation instructions for form inputs, element roles such as buttons, menus, modal dialogues (popups) and others. In addition, the background process scans all images on the website and provides an accurate and meaningful description based on image object recognition as an ALT tag (alternative text) for images that are not described. It also extracts text embedded in the image using OCR (optical character recognition) technology. To activate the customisations for screen readers at any time, users only need to press the Alt+1 key combination. Screen reader users will also receive automatic prompts to switch on screen reader mode as soon as they enter the website.

   These customisations are compatible with all common screen readers, including JAWS and NVDA.

2. Optimisation of keyboard navigation: The background process also adapts the HTML code of the website and adds various behaviours using JavaScript code to make the website operable via the keyboard. This includes the ability to navigate through the website using the Tab and Shift+Tab keys, operate dropdowns with the arrow keys, close them with Esc, trigger buttons and links with the Enter key, navigate between radio and checkbox elements with the arrow keys and fill them with the spacebar or Enter key; in addition, keyboard users will find quick navigation and content skip menus available at any time by clicking Alt+1 or as the first elements of the website when navigating with the keyboard. The background process also handles triggered popups by moving the keyboard focus to them as soon as they appear and not allowing the focus to wander outside the popup.

   Users can also use keyboard shortcuts such as ‘M’ (menus), ‘H’ (headings), ‘F’ (forms), ‘B’ (buttons) and ‘G’ (graphics) to jump to specific elements.

Supported profiles for people with disabilities on our website:

• Epilepsy safety mode: This profile enables people with epilepsy to use the website safely by eliminating the risk of seizures caused by flashing or flashing animations and risky colour combinations.
• Visually impaired mode: In this mode, the website is adapted so that it is suitable for users with visual impairments such as failing eyesight, tunnel vision, cataracts, glaucoma, etc.
• Mode for cognitive impairments: This mode offers various assistance options to help users with cognitive impairments such as dyslexia, autism, CVA and others to focus more easily on the essential elements of the website.
• ADHD-friendly mode: This mode helps users with ADHD and neurodevelopmental disorders to read, browse and focus on the most important elements of the website more easily, while significantly reducing distractions.
• Blind mode: This mode configures the website so that it is compatible with screen readers such as JAWS, NVDA, VoiceOver and TalkBack. A screen reader is software for blind users that is installed on a computer and a smartphone and with which websites must be compatible.
• Keyboard navigation profile (motor impaired): This profile enables people with motor impairments to operate the website using the Tab, Shift+Tab and Enter keys. Users can also use keyboard shortcuts such as ‘M’ (menus), ‘H’ (headings), ‘F’ (forms), ‘B’ (buttons) and ‘G’ (graphics) to jump to specific elements.

Additional adjustments to the user interface, design and readability

1. Font adaptations – Users can increase and decrease the font size, change the font family (type), adjust the spacing, alignment, line height and much more.
2. Colour adjustments – Users can select different colour contrast profiles such as light, dark, inverted and monochrome. Users can also change the colour schemes of titles, texts and backgrounds with over seven different colour options.
3. Animations – People with epilepsy can stop all running animations with a click of the mouse. Animations controlled via the interface include videos, GIFs and flashing CSS transitions.
4. Emphasising content – users can have important elements such as links and titles highlighted. You can also specify that only focussed elements or elements held with the mouse pointer are highlighted.
5. Audio mute – Users with hearing aids may experience headaches or other problems due to automatic audio playback. With this option, users can mute the entire website immediately.
6. Cognitive disorders – We use a search engine that is linked to Wikipedia and Wiktionary and enables people with cognitive disorders to decipher the meaning of expressions, initials, slang, etc.
7. Additional functions – We offer users the option of changing the colour and size of the cursor, using a print mode, activating a virtual keyboard and many other functions.

Compatibility with browsers and supporting technologies

We endeavour to support the widest possible range of browsers and assistive technologies so that our users can choose the tools that best suit their needs with as few restrictions as possible. Therefore, we have worked very hard to support all major systems that account for over 95% of the user market share, including Google Chrome, Mozilla Firefox, Apple Safari, Opera and Microsoft Edge, JAWS and NVDA (screen readers).

Notes, comments and feedback

Despite our endeavours to give everyone the opportunity to adapt the website to their needs. There may still be pages or sections that are not fully accessible, that are in the process of being made accessible or that lack an appropriate technical solution to make them accessible. Nevertheless, we are constantly improving our accessibility, adding options and features, updating and improving them and developing and adopting new technologies. All of this is to achieve an optimal level of accessibility in line with technological advances. If you need help, please contact info@tuefa.de