Important Notice: This website shows interim results and does not represent a complete accessibility audit. The content is not final, is under heavy development, and is not legally binding. The website and all its content is for internal use only; unauthorized use or distribution may result in legal consequences.

Documentation of accessibility observations for Deutsche Telekom – Mobilfunk & OneShop

2.1.1 Keyboard (A) League information collapsible cannot be opened by SPACE/ENTER

Priority: Critical Low Page: Sport Megasport Option Observation Permalink
Observation Details

League information collapsibles use generic containers to build interactive functionality.

<div role="button" tabindex="0">
  <img alt="Bundesliga Logo" src="...">
</div>

The element can receive keyboard focus but is not activated with click on SPACE / ENTER.

Remediation Notes

Use semantic HTML elements for interactive elements instead of rebuilding them from generic elements. Use <button> element to ensure possibility of keyboard navigation. This also removes the need of manually setting role attribute and tab index.

Side note: As the buttons are used to collapse / expand information, consider evaluating the use of a <details> & <summary> structure to get accordion functionality.

Side note: As the used image is a functional image, the text alternative must describe the purpose of the button's function rather than describing the image's contents.