All Vulnerabilities/Poor Semantic HTML Structure
lowseo

Poor Semantic HTML Structure

Detects excessive div usage and missing semantic HTML elements.

Why This Is Bad

Your code is a 'soup' of generic boxes. It confuses search engines and makes navigation difficult for screen reader users.

How To Fix

Replace generic divs with semantic HTML elements:

tsx
// Before (BAD - "Div Soup")
<div>
  <div>Header content</div>
  <div>
    <div>Main content</div>
    <div>Sidebar</div>
  </div>
  <div>Footer</div>
</div>

// After (GOOD - Semantic HTML)
<div>
  <header>Header content</header>
  <main>
    <article>Main content</article>
    <aside>Sidebar</aside>
  </main>
  <footer>Footer</footer>
</div>

Key semantic elements: - `<main>` - Primary content (one per page) - `<header>` - Introductory content - `<nav>` - Navigation links - `<article>` - Self-contained content - `<section>` - Thematic grouping - `<aside>` - Related content - `<footer>` - Footer content

When You Pass This Check

Your HTML structure is clean and semantic. Search engines love it!

Check If Your Repo Has This Issue

Our free scanner will detect this and 17 other common issues in your codebase.