Nested Tables Test
The Nested Tables Test scans any URL for HTML tables containing other tables — a markup pattern from the 1990s used for visual layout before CSS existed. Nested tables are slow to render, inaccessible to screen readers, brittle on mobile, and almost always a sign of legacy markup that needs a CSS-based redesign. Modern best practice uses semantic HTML + CSS Grid / Flexbox for layout and reserves <table> exclusively for tabular data.
What This Tool Checks
- Total <table> elements on page
- Nesting depth of tables within tables
- Tables used purely for layout (not data)
- Accessibility role attributes on layout tables
- Mobile rendering of nested table layouts
Why It Matters for SEO
Nested table layouts are slow to render (each table requires multiple layout passes), inaccessible (screen readers announce table semantics where none was intended), broken on mobile (tables rarely reflow gracefully), and hard to maintain. CSS Grid and Flexbox solve every layout case nested tables were used for, with cleaner markup and better performance.
How to Fix It
Refactor every layout table to semantic HTML + CSS Grid / Flexbox. Reserve <table> for tabular data only. Configure your WYSIWYG editor to discourage table insertion. Add nested-table detection to your CMS pre-publish checks.
How It Works
We render the page, walk every <table> in the DOM, count the deepest nesting level, and classify each table as "data" (has <th>, <caption>, etc.) or "layout" (purely structural). Each layout table is reported with the modern CSS pattern that should replace it.
Common Mistakes to Avoid
- Email-newsletter HTML imported into website templates
- WYSIWYG editors generating nested tables when authors paste from Word
- Treating tables as the easiest way to align two columns
- Skipping CSS Grid because the team is unfamiliar
- Refactoring half the page to CSS but leaving legacy tables in templates
Quick Checklist
- No layout tables in production HTML
- Tables only used for tabular data
- CSS Grid / Flexbox handles all layout
- WYSIWYG configured to discourage tables
- Pre-publish lint catches new layout tables