The HTML description list element, dl, has been misnamed in developers' heads for 17 years. Since an HTML5 draft published January 2008, the spec calls it a 'description list', not a 'definition list'. Most developers are still writing it wrong conceptually, and that misunderstanding shapes how they use it.
Ben Myers documents four underused behaviors of dl in a single post. A dt can have multiple dd children. The dt and dd pairs can be wrapped in a div for styling purposes, but only a div, no other element qualifies. The entire dl can be labeled with aria-labelledby, pointing to an existing heading and giving assistive technology real context. These are not edge cases. They are valid, spec-compliant patterns most developers have never reached for.
Read the full piece at benmyers.dev for the complete markup walkthrough. Then go directly to Adrian Roselli's January 2025 updated note on screen reader support for description lists before you ship anything. The spec compliance and the assistive technology reality are two different documents, and you need both.
[READ ORIGINAL →]