The Div Disease (And How to Cure It)

Div-itis: the overuse of non-semantic and elements when semantic alternatives exist. Bad: Home Article Title Content here Good: Home Article Title Content here The semantic version: - Works with screen readers out of the box - Allows landmark navigation (jump directly to nav, main, etc.) - Provides clear document structure - Requires no ARIA patches - Is easier to style (nav ul li instead of .nav .menu-item) Divs aren't evil – they're for grouping when no semantic element fits. But they're the last resort, not the default.

Semantic HTML

📖 6 min read•Last updated: 9/26/2026

Using HTML elements for their intended purpose to convey meaning and relationships, forming the foundation of accessibility.

📋 Complete Guide Contents

Semantic HTML: The Foundation of Accessibility (That Everyone Ignores)

Semantic HTML means using HTML elements for their intended purpose.

Semantic Elements You Should Actually Use

HTML has over 100 elements. Most developers use about 10. Here are the semantic elements that matter for accessibility:

Document Structure: -

: Page or section header (not just any heading) -