4.1.2 Name, Role, Value (A) Interactive element does not use correct semantic HTML

Observations:

• Dropdown "Wählen Sie ein iPhone aus" uses span role="combobox" tabindex="0" instead of semantic input field for selection / dropdown

• Handyankauf form

  • Step indicators use <button type="button" disabled> but are not buttons

  • CAPTCHA reload button uses span aria-hidden="true" instead of button element

  • "Wo finde ich die IMEI-Nummer" uses a href="#imei" title="..." instead of button element; side note, #imei is not found in DOM

    • Close button in dialog window uses <button type="button"> which is redundant and unnecessary

  • "Zurück" button use a href="#" title="Zurück" instead of button element

  • Info "i" icon buttons (step 3) use <span aria-hidden="true"><svg>... instead of semantic (accessible) button element

    • Close button in dialog window uses <button type="button"> which is redundant and unnecessary

  • "Wo finde ich die Angabe" uses a href="#imei" title="..." instead of button element; side note, #imei is not found in DOM

    • Close button in dialog window uses <button type="button"> which is redundant and unnecessary

  • "Prüfen" button uses <button type="button"> which is redundant and unnecessary

  • "Ohne Aktion fortfahren" button uses <button type="button"> which is redundant and unnecessary

  • "Anrede" dropdown uses span role="button" tabindex="0" ... and select id="..." name="title" (with non-unique id) instead of semantic input element

All interactive elements that do not use the correct interactive HTML elements must be built in a way, that semantic information is provided and updates to semantic information are accessible via assistive technology. Building interactive components with incorrect HTML elements results in inaccessible content. These accessibility issues might occur:

• Interactivity of element is not announced → user will not know, that element is interactive

• Changes to states (e.g. collapsed/expanded) is not announced → user will not know of the change

• Target resource is not announced → e.g. user will not know, where a link leads to

• Interactive action is not announced → e.g. user will not know, that a dialog window will be opened

Issues in 4.1.2 Name, Role, Value often occur together with other issues e.g. in 2.1.1 Keyboard and 2.4.7 Focus Visible.