TL;DR
Product page tabs (Specs, Reviews, Q&A) hide your most keyword-rich content from Google’s relevance assessment. The tab implementation method matters: CSS display:none, DOM manipulation, and off-screen positioning are treated differently. For e-commerce sites without Amazon-level domain authority, competitors with visible specs outrank you for long-tail product queries even when your hidden content is more comprehensive.
The Conversation
Rachel, product manager at electronics retailer, 5,000 products, Magento, intermediate SEO knowledge, frustrated that detailed spec queries don’t bring up product pages: We have incredibly detailed product specifications. Every TV lists resolution, refresh rate, HDR support, HDMI ports, everything buyers search for. But when I search “Samsung QN85B 120Hz gaming,” we don’t rank. Our product page has all that info. Why doesn’t Google show us?
SDC SEO Brain: Where is that specification information located on your product pages? In the main content area or in tabs?
Rachel: In a Specifications tab. We have tabs for Overview, Specs, Reviews, and Q&A. It’s a clean UI that our UX team designed.
SDC SEO Brain: Content in tabs that requires clicking to reveal is deprioritized by Google for ranking purposes. Google can see and index the content, but when determining which page best answers a query, visible content weighs more heavily than hidden content.
Rachel: But Google renders JavaScript. They can see what’s in the tabs.
SDC SEO Brain: Seeing and weighting are different. Google has stated that content hidden behind user interaction, tabs, accordions, read-more links, is considered secondary content. The assumption is that if you hid it, it’s less important. For ranking long-tail queries about specific specs, your hidden spec content loses to competitors who display specs visibly.
Rachel: That’s frustrating. We put it in tabs because nobody wants a 2,000-word product page.
SDC SEO Brain: UX and SEO goals are conflicting here. Users like tabs for scannability. Google likes visible content for relevance assessment. You need a strategy that serves both.
Rachel: Who are our competitors that are ranking for these spec queries?
SDC SEO Brain: Let’s check. Search for a specific spec query and see who ranks. What do their product pages look like?
Rachel: I just searched “Samsung QN85B 120Hz.” Best Buy and Amazon rank first and second. Let me look at their pages.
Rachel: Best Buy shows key specs right below the product title. Not in a tab. Resolution, refresh rate, screen size, all visible immediately.
SDC SEO Brain: That’s why they rank. The content relevant to the query is in the primary visible area. Google immediately sees that the page answers the query. Your page might have the same information, but Google has to click a tab to evaluate it, and it doesn’t value that content equally.
Rachel: Amazon uses tabs too. But they still rank.
SDC SEO Brain: Check their implementation. Some tab implementations use CSS to hide content, which Google treats as hidden. Others load content but render it in the DOM visibly even if the tab isn’t “active” from a styling perspective. Amazon also has massive domain authority that lets them rank despite technical inefficiencies.
Rachel: We can’t compete with Amazon’s authority. We need to fix our presentation.
SDC SEO Brain: Exactly. For a retailer your size, on-page optimization matters more because you can’t rely on domain authority to compensate. Let’s prioritize which content needs to be visible.
Rachel: How do I know which specs people actually search for?
SDC SEO Brain: Search Console shows queries driving impressions to your product pages. Filter by a product category, look at the queries, and note which specs appear in searches. If you see lots of queries including “120Hz” or “HDMI 2.1” or “Dolby Vision,” those specs need visible placement.
Rachel: What about reviews? Ours are in a Reviews tab. They contain great natural language content.
SDC SEO Brain: Reviews are keyword-rich. Users describe products in their own words, often using the exact phrases other buyers search for. “Great for gaming” or “perfect size for bedroom” are real search patterns. Hiding reviews in tabs hides that natural language content from Google’s relevance assessment.
Rachel: Should I display all reviews on the page? Some products have hundreds.
SDC SEO Brain: Show a selection visibly, maybe the most helpful reviews or first several reviews, with a “show more” that loads the rest. The initial visible reviews provide keyword-rich content. Additional reviews can load on interaction without SEO penalty because the base content is already visible.
Rachel: What about Q&A? Same issue?
SDC SEO Brain: Q&A is extremely valuable for long-tail SEO because questions match how people search. “Does this TV have Bluetooth?” is both a common Q&A entry and a common search query. If your Q&A content is hidden in a tab, that query match is deprioritized.
Rachel: Our Q&A tab has maybe 5-20 questions per product. Should those be visible?
SDC SEO Brain: Show the top questions visibly, perhaps the most viewed or most helpful. These are your highest-value Q&A entries. Use FAQ schema markup on these visible questions to potentially get FAQ rich results in search.
Rachel: You mentioned CSS-hidden versus DOM-hidden tabs. What’s the difference?
SDC SEO Brain: This is where implementation details matter significantly. Three categories:
CSS visibility methods: display:none, visibility:hidden, and opacity:0 all hide content but the HTML exists in the DOM. Google can see this content but has historically deprioritized it. However, CSS transitions between opacity:0 and opacity:1 may be treated differently than display:none toggles because the content is technically “visible” at opacity:0, just transparent.
DOM manipulation: JavaScript that removes and inserts DOM nodes on tab click means inactive tab content doesn’t exist until interaction. Google’s renderer may or may not execute the click to populate that content. Worst case for SEO.
CSS clip-path or position:absolute with negative coordinates: The content is visible to screen readers and in the DOM, but positioned off-screen. Some SEO practitioners believe this gets full weight because it’s technically visible to the rendering engine. Evidence is mixed.
For Magento specifically, check your theme’s implementation. The difference between these methods can be the difference between indexing and not.
Rachel: Which does Magento use by default?
SDC SEO Brain: It depends on the theme, but many Magento product page tabs are CSS-hidden. Check your page source, not the rendered page. If you can see the spec content in the HTML source even when the tab isn’t active, it’s CSS-hidden. If the content only appears after clicking, it’s DOM-loaded.
Rachel: So I need to convince our UX team to change the product page template?
SDC SEO Brain: Position it as conversion optimization too. Specifications visible on initial load help buyers make decisions faster. Reviews visible without clicking build trust immediately. The UX team might resist “SEO changes” but embrace “conversion improvements.”
Rachel: We have 5,000 products. Template changes would affect all of them?
SDC SEO Brain: Yes, that’s the advantage. You’re not manually editing products. You’re changing how the template presents data. One template change improves 5,000 pages. This is where technical SEO has massive leverage.
Rachel: How do I measure if this works after we make changes?
SDC SEO Brain: Track long-tail query impressions and clicks in Search Console. Before the change, export your spec-related queries, their impressions, positions, and clicks. After the change, compare the same queries after Google recrawls. Improved visibility of spec content should improve rankings for spec-related queries.
FAQ
Q: Does Google index content hidden in tabs?
A: Yes, Google can access and index tab content. But it deprioritizes hidden content for ranking purposes. Visible content weighs more heavily in relevance calculations.
Q: What’s the difference between CSS-hidden and DOM-hidden tabs?
A: CSS-hidden tabs load content into the DOM immediately but hide it visually. DOM-hidden tabs only load content when clicked. CSS-hidden is slightly better for SEO, but both are deprioritized compared to always-visible content.
Q: Should I remove all tabs from my product pages?
A: Not necessarily. The goal is making important content visible by default. Key specs, first several reviews, and top Q&A questions should be visible. Additional content can remain in tabs for UX purposes.
Q: How do I know which content to make visible?
A: Use Search Console to identify which product attributes appear in search queries. If users search for “120Hz” or “Bluetooth” frequently, those specs need visible placement.
Q: Will making content visible hurt my page’s UX?
A: Done well, it improves UX. Key information visible immediately helps users make faster decisions. Progressive disclosure (visible summary, tabs for details) serves both SEO and UX.
Summary
Content in tabs is deprioritized for ranking even though Google can index it. Competitors with visible content outrank you for long-tail queries that match your hidden specifications.
Check competitors who rank for your target queries. Often they display key information visibly while you hide equivalent content in tabs.
Use Search Console to identify which product attributes appear in search queries. Make those specific attributes visible on product pages.
Reviews and Q&A contain valuable natural language that matches how people search. Display top reviews and questions visibly, with additional content loadable on interaction.
Template changes have massive leverage for e-commerce. One template modification improves thousands of product pages simultaneously.
Sources
- Google Search Central: Hiding content
- Google Webmaster Hangouts: John Mueller on tabs and accordions
- Google Search Central: Product structured data