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

1.3.1 Info and Relationships (A) Semantic HTML elements are used for styling or layout purposes

Priority: Moderate Low Page: Smartphone Tarife Observation Permalink
Accompanying Files
Observation Details

Semantic HTML elements must not be used for styling and layout purposes. Semantic elements carry a certain role that is communicated to assistive technology. Using semantic elements with a certain role for styling or layout purposes while the content does not match the communicated role, it will confuse users of assistive technology. Certain elements will be announced in certain ways, so that e.g. line break elements <br> or empty paragraph elements <p></p> are announced as "empty group".

FAQ section:

  • Empty paragraph after section heading

  • Improper use of line breaks in FAQ item "Worauf sollte ich bei meinem neuen Handytarif achten?"

  • Table content in FAQ item "Was verbraucht am meisten Datenvolumen?" displayed by use of non breaking spaces: <li><strong>Serienstreaming</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ... 1 Stunde</li>

"Tarifdetails" / "Jetzt zur Telekom wechseln" dialog windows:

  • Extensive use of line break elements

  • Use of <strong> elements for heading content

  • Info icon dialog window

    • Use of line breaks

    • Use of <b> to emphasize text content

    • Use of emphasis for heading content

Remediation Notes

Ensure proper use of semantic HTML.

  • Semantic elements must not solely be used for styling or layout purposes

  • All styling and layout changes must use CSS

  • Limit use of line breaks to intended purposes, e.g. in poetry or code snippets