Accompanying Files
Observation Details
The buttons in section "Das komplette Sport Programm" with sports channel logos are duplicated. The HTML structure is as follows:
<div class="styles_Program__switch__10Eau">
<button type="button"><img alt="Wow Logo" src="..." /></button>
<button type="button"><img alt="Dazn Logo" src="..." /></button>
<button type="button"><img alt="MagentaSport" src="..." /></button>
<div class="styles_Program__switch-window__dWIIF">
<div>
<button type="button"><img alt="Wow Logo" src="..." /></button>
<button type="button"><img alt="Dazn Logo" src="..." /></button>
<button type="button"><img alt="MagentaSport" src="..." /></button>
</div>
</div>
</div>This leads to three buttons not being visibly focused before reaching the actual buttons. See screenshot for jump from element 8 to element 12 in focus order. Elements 9-11 are the "hidden" buttons.
Remediation Notes
Ensure, cleaning up code, by removing duplicate and unused parts to provide clean, semantic HTML code.
Side note: Consider, moving the section to a tab group structure to match visual presentation, functionality, and code markup.