HomeFix guides → Semantic HTML structure (WCAG 1.3.1 A)

acc

How to fix: Semantic HTML structure (WCAG 1.3.1 A)

Why this matters

A page built entirely from <div>s carries no structural meaning to assistive technology. HTML5 semantic elements (<header>, <main>, <article>, etc.) each have implicit ARIA roles screen readers use to navigate. WCAG 1.3.1: information conveyed by presentation must be programmatically determinable.

Background

A page built entirely from <div>s carries no structural meaning to assistive technology. HTML5 semantic elements each have implicit ARIA roles. WCAG 1.3.1: information conveyed by presentation must be programmatically determinable.

References

WCAG 2.1 SC 1.3.1 Info & Relationships (A) · HTML5 semantic elements

How to fix

Code snippet for each stack we cover. Pick the one matching your server / framework.

nginx
No server config.
apache
Same.
cloudflare
Same.
wordpress
Use a modern block-based theme (Twenty Twenty-Three+) — semantic by default. Avoid page builders that wrap everything in nested <div>s.
flask
Refactor templates: <header>, <main>, <section>, <article>, <aside>, <footer>. Each carries implicit ARIA.
express
Same.
rails
Same.

Verify it's working

View source. Count semantic tags vs <div>. Aim for a balanced semantic structure.

Want to know if your site has this issue?

Run a free 53-check audit — security, GDPR, NIS2, and technical SEO.

Audit my site →