Present definitions of words or phrases using definition lists
no. 068
Make sure definitions of phrases or words are marked up using definition lists
One of the most common accessibility issues found when definitions are provided has to do with the lack of structural markup provided to help users of assistive technologies identify them as such. Word definitions are often marked up using simple paragraphs or DIVs, with the definition terms visually rendered in bold. Since each definition stands on its own, none of that structure is semantically conveyed to assistive technology. As a result, finding the list of definitions is made much harder to users who can’t see the page. Definition lists can fix that problem.
To do so, simply make sure every definition term (or name) is marked up using a DT element, and every description (or value) that follows is marked up using a DD element. Finally, properly nest the whole list of DT-DD definitions using a DL element to programmatically bind everything together, modifying the default presentation with CSS if need be. By doing so, not only will the definitions be semantically structured as a stand-alone unit, the component’s structure will make it that much easier to find for [...]