4 Comments

Hi. MDN on <dl> has a link to the article (written in Sep 2020) reporting that iOS's screen reader (VoiceOver) fails to recognize <dl> elements; it reads it as plain text via the read-all command (it does recognize <dl> when nagivating with the virtual cursor, though): https://adrianroselli.com/2020/09/voiceover-on-ios-14-supports-description-lists.html

For accessibility, therefore, I think we should avoid using <dl> until iOS fixes this issue. What do you think?

Expand full comment

As always, it depends. Outside of the syntax rules, there are few exact answers to whether content is marked up correctly with HTML. It's all about the message communicated, the audience receiving the message, and how HTML may best communicate that information to the greatest number of people. There will always be edge cases, and as developers, we're trained to focus on those as potential points of failure.

In this specific situation, consider:

a. How many of your site visitors are using VoiceOver?

b. Are description lists enhancing the understanding of your content? Or is it causing additional confusion?

Roselli states: "Understand how your users might access content in your description lists. If they tend to have the entire page read to them, the utility might be low. If they have a more methodical approach (owing to the nature of the content, density of information, existing patterns, and so on), then description lists could be handy."

Never let the perfect be the enemy of the good. I wouldn't exclude use of an HTML element based on one use case for a tiny portion of my audience that's doing more good than harm.

Expand full comment

Thank you very much for your answer, Jen! After I wrote my comment, I came to a conclusion that we can use <dl> when (1) being read as plain text is fine or (2) <dl> is not part of an article. Which assumes that some of the visitors use VoiceOver. Also, I realize the trio of <section>, <h2>, and <p> may be used instead, depending on the context. As you say, I'll make a judgement based on whether <dl> makes content easier to understand.

Expand full comment

In the end, that's what HTML is all about -- identifying elements in your document to make the document structure understandable. That's it! That's why a million divs are bad. HTML isn't a clothes hanger for JavaScript. So yes, whatever markup makes the most sense to your audience is what you should use. (And it's probably not 75 layers of nested divs.)

Expand full comment