Semantic HTML elements

Why it matters

Browser agents may combine the DOM, accessibility tree, and screenshots. Semantic elements like <main>, <nav>, and <article> provide durable structural meaning across those representations.

How to fix it

Use main, nav, header, footer and article for the page structure.

1. Replace layout div elements with semantic elements.

   <header>...</header>
   <nav>...</nav>
   <main>
     <article>...</article>
   </main>
   <footer>...</footer>

2. Use one main element per page.

Verify

Run a new scan for this checkpoint: