Don't Use CSS Text Truncation with Ellipses (...) for SEO

Tadashi Shigeoka ·  Sun, September 22, 2024

I’ll introduce why we have a policy against using CSS to truncate text with ellipses (, ...), as it may result in SEO penalties.

Related: Does truncating text with CSS based on screen width constitute cloaking? - Google Search Central Community

Reference: “Cloaking” in SEO

“Cloaking” in SEO refers to when the content displayed to search engine crawlers (programs that search engines use to browse websites and collect content) differs from the content displayed to actual users. This is one of the black hat SEO techniques that attempts to deceive search engine algorithms to artificially boost search rankings.

Examples of cloaking include:

  • Displaying only text to search engines while showing images or flash content to users This allows search engines to understand and properly evaluate content as text-based, while users see completely different content.

  • Showing keyword-stuffed pages to search engines while displaying different pages to users Search engines see pages with frequent specific keywords to boost rankings, but actual users may see unrelated content or advertisements.

Risks of Cloaking

Cloaking violates search engine guidelines. Search engines like Google strictly crack down on cloaking, and sites that engage in cloaking risk penalties. In the worst cases, they may be completely excluded from search results.

Difference from Legitimate SEO

Legitimate SEO provides the same content to both search engines and users, improving website rankings through appropriate methods.

Reference: “Hidden Text” in SEO

“Hidden Text” in SEO is a technique that stuffs specific keywords for search engines to artificially boost search rankings, and is an SEO anti-pattern that results in penalties. This technique refers to embedding text on web pages that is invisible to users but recognized by search engines.

Main Hidden Text Techniques

  1. Making text the same color as the background: For example, displaying white text on a white background to make it invisible to users.
  2. Hiding text with CSS: Using styles like display: none or visibility: hidden to prevent display on the page.
  3. Using extremely small font sizes: Making font sizes extremely small so they’re barely visible.
  4. Placing text off-screen: Using position: absolute to display text outside the screen area.

Impact of Hidden Text

Hidden text may be considered spam behavior by search engines (like Google). Using such techniques can result in the following penalties:

  • Removal from search engine indexes
  • Significant decrease in search rankings
  • Potential blacklisting of the entire domain

Why to Avoid

While hidden text might be a technique for short-term SEO effects, search engine algorithms have evolved significantly, making detection risks high in the long term. Also, since it’s content that doesn’t provide value to users, it goes against search engine guidelines. Search engines like Google prioritize websites that provide valuable content to users, so it’s important to conduct SEO through legitimate methods.

Appropriate SEO Measures

  • Improving content quality: Create valuable content that provides information users are seeking.
  • Optimizing metadata: Properly set page titles, meta descriptions, etc., and naturally include keywords.
  • Improving page speed: Create fast-loading pages to enhance user experience.

As such, hidden text is a technique that should be avoided due to the high risk of losing trust from search engines.

That’s all from the Gemba about not wanting to truncate text with CSS for SEO purposes.