Definition List

elements must only directly contain properly ordered

and

groups

Definition lists must be structured using correctly ordered groups of

and

elements so content is meaningful for all users. This blog explains what the definition-list rule checks, why proper ordering matters for accessibility, how to structure

content correctly and how this supports WCAG 2.2 and wider compliance expectations. The article is fully original, SEO‑optimised and structured using the Welcoming Web content framework.

What it is

The definition-list rule checks whether each

element contains only: - properly ordered

(definition term) and

(definition description) groupings, - or allowed supporting elements such as

, or

wrappers.

A valid definition list follows a clear structure where each term is associated with one or more descriptions, and each description follows its related term. Browsers and assistive technologies rely on this order to present definitions correctly.

Why it matters

Definition lists are used for terms, labels, metadata, product attributes and structured explanations. When the structure is broken: - screen readers may announce terms and definitions out of order, - relationships between items become unclear, - users may misunderstand content or miss key information, - cognitive load increases because the pattern is inconsistent.

Well‑structured

elements support predictable reading order, clearer associations and a more accessible presentation of paired information.

Who delivers it

Front end developers implement correct

/

patterns in templates and components. Designers determine when a definition list is the correct structure. Accessibility engineers and QA testers review markup structure to ensure that semantics match intent. Welcoming Web assists teams by detecting definition lists that contain invalid or incorrectly ordered elements.

How to fix incorrectly structured definition lists

1. Ensure each

is followed by its related

The description must appear immediately after the term.

Incorrect example:

<dl>  <dd>A device used for writing</dd>  <dt>Pen</dt></dl>

Corrected version:

<dl>  <dt>Pen</dt>  <dd>A device used for writing</dd></dl>

2. Avoid placing headings, paragraphs or other elements directly inside

If additional structure is needed, wrap supporting content in a

.

3. Group multiple descriptions under a single term when appropriate

Some terms require more than one explanation.

<dl>  <dt>Accessibility</dt>  <dd>Practices that support inclusive use.</dd>  <dd>Design and development approaches that improve usability.</dd></dl>

4. Keep relationships clear and predictable

Avoid placing unrelated items between

/

pairs.

5. Validate structure using accessibility tools

Check that assistive technologies announce “term” followed by its associated “definition” in the expected order.

Best practice guidance

Use definition lists only when terms and descriptions are the best semantic match. Maintain a clean structure with minimal interruptions between pairs. Avoid styling that hides the logical structure or rearranges visual order in ways that confuse relationships. Use

for metadata, glossaries, FAQs or paired information where clear associations help comprehension.

Compliance mapping

Correctly structured definition lists support: - WCAG 2.2 requirements for meaningful sequence and semantic structure, - ADA Title III expectations for clear relationships between elements, - EN 301 549 guidance on programmatically determinable structure, - Equality Act 2010 obligations for understandable information.

Welcoming Web supports alignment with recognised standards but does not issue or guarantee compliance certification.

How Welcoming Web supports teams

Welcoming Web identifies

elements containing invalid or misordered content. The platform maps issues to WCAG requirements and provides guidance for structuring

/

pairs correctly.

Key points for development teams

Definition lists must use

and

only. Order must reflect term then description. Additional content can be placed in wrappers. Semantic clarity improves accessibility. Testing confirms correct reading order.

Call to action

Run an audit Check your site for incorrectly structured

elements. Supports WCAG 2.2 and ADA goals.

FAQs

What does the definition-list rule check

It checks whether

elements contain correctly ordered

and

pairs or allowed wrapper elements.

Why must

structure follow term then description Because assistive technologies rely on this order to communicate meaning.

Can I include headings or text directly inside a

No. Use a

wrapper for additional structure.

Can a

have multiple

descriptions Yes. A term can have multiple valid definitions.

Do visual styles affect semantic order

Styling does not change semantic relationships, but confusing layout can mislead users.

Does correct

structure guarantee WCAG compliance It supports WCAG structure goals but does not guarantee full compliance.

How does Welcoming Web help with definition list issues

Welcoming Web identifies misordered or invalid structure and provides guidance to correct it.

Disclaimer

Welcoming Web supports accessibility improvement and alignment with recognised standards but does not issue or guarantee compliance certification.