Skip to content
SeoWiki

The SEO encyclopedia

On-Page SEO

Tabbed Content SEO 2017

Tabbed content is page content hidden behind tabs or accordions that can improve UX while still being crawlable and indexable if the full text is present in the HTML at load time.

Beginner3 min readUpdated 2026-07-26Reviewed by Lucía Marín

Key takeaways

  • Tabbed content is not penalized by Google when the text is in the initial HTML.
  • Always keep primary keywords and core value propositions visible outside tabs.
  • Avoid JavaScript‑dependent lazy loading for critical SEO content.
  • Use clear, descriptive labels to improve UX and accessibility.
  • Test with Lynx or Google Search Console to confirm crawlability.

This tactic applies to any page where tabs or accordions are used to group related information, such as product details, FAQs, or specifications.

Example: Tabbed content on a product page

  • Scenario: An e‑commerce product page for a smartphone.
  • Tabs used: Overview, Specs, Reviews, Warranty.
  • Implementation: All four tab panels are present in the HTML on page load. Only the first tab (Overview) is visible; the rest are hidden with CSS.
  • Outcome: Googlebot can crawl and index all text inside Specs, Reviews, and Warranty without clicking because the content is in the initial HTML.
  • Pitfall avoided: The primary keyword “smartphone” is used in the visible Overview, not hidden in a tab.

Quick-start: 5 steps to implement tabbed content for SEO

  1. Plan content hierarchy: Place your primary keywords and most important value above the tabs or in the first visible panel.
  2. Load all tab content in HTML: Ensure every tab’s content is part of the initial HTML response; do not fetch it via API or lazy-load on click.
  3. Use CSS for show/hide: Hide inactive panels with CSS classes (`display: none`, `visibility: hidden`), not with JavaScript that removes them from the DOM.
  4. Add descriptive tab labels: Use clear, keyword-relevant labels (e.g., “Technical Specifications” not “More”).
  5. Test crawlability: Use Google Search Console’s URL Inspection tool or a text‑based browser like Lynx to verify that full content is visible to bots.

Common mistakes with tabbed content

  • Hiding core keywords: Putting the page’s primary keyword targets and most important copy only inside collapsed tabs.
  • Dynamically loading content: Loading tab content only after a user click, instead of including it in the initial HTML response.
  • Poor labeling: Choosing vague or marketing-heavy tab labels that do not clearly describe the content inside.
  • Using tabs to hide poor structure: Tabs are not a workaround for a cluttered page; consider creating a clearer information architecture instead.

Next step

FAQ

Is tabbed content bad for SEO?

No, if implemented correctly. Google can crawl and index content hidden in tabs as long as it is present in the initial HTML and not loaded dynamically after user interaction.

Does Google crawl accordion content?

Yes, Google can crawl and index accordion content provided the text is part of the initial HTML response and not fetched via JavaScript after interaction.

Should I hide primary keywords in tabs?

No. Keep your most important keywords and value propositions outside tabs to ensure strong relevance signals.

What is the safest way to implement tabbed content?

Include all tab content in the initial HTML, use CSS to show/hide, and avoid JavaScript-dependent lazy loading for critical content.

Related topics

Sources

Reviewed by Lucía Marín, Founding editor.