Observation Details
The switch "Mit Young-Streaming-Vorteil" can be operated by keyboard and assistive technology. Operating the switch by assistive technology has the following issues:
Off state is announced as "invalid data off" (using attribute
aria-invalid="true")Changes made to the following content are not announced; the user will not know of the changes
Remediation Notes
Remove aria-invalid="true" from the button element to allow for correct announcement of "on" and "off" states.
Announcing content changes that are happening on toggling the switch can be done in multiple ways. ARIA live regions are a ways to do so but are highly complex for the limited changes made. It is recommended to avoid ARIA use if possible (see First Rule of ARIA Use), so the easiest way would be:
Announce changes prior to toggle element, to make changes expected; this can be via a description text like "50 % mehr Datenvolumen bei Buchung einer Streaming-Option sichern. Klicke den Schalter 'Mit Young-Streaming-Vorteil' und das extra Datenvolumen wird in der Tarifliste angezeigt"; it also is possible to hide some of this via a
visually-hiddenCSS class, if necessary
Another option is to use the toggle element's accessible name and not simply providing the toggle label via the visible text but adding hidden text to it as well that could read "Young-Streaming-Vorteil einschalten und extra Datenvolumen in der Tarifliste anzeigen lassen". It is important to notice, that the visible label must be changed to "Young-Streaming-Vorteil" to not fail 2.5.3 Label in Name, though.