css - 隐藏网站标题和/或标语或网站描述对 SEO 有影响吗？

Question

在几个教程中我发现，站点标题和站点描述对于 SEO 很重要。甚至他们中的一些人也使用 <h2>网站标题和<h1>对于网站描述，将搜索引擎的注意力吸引到网站问题上。

<header>

<div id="logo"><a href="#"><img src="images/logo.png" alt="Logo of the Company" title="Company Title"/></a></div>

<hgroup>
<h2 id="site-title">Site Title</h2>
<h1 id="site-description">Site Description</h1>            
</hgroup>

</header>

选项 I:但是在某些网页中，我们看不到任何网站标题或描述，而是看到网站 Logo 。在这种情况下，设计师建议使用 text-indent隐藏它们。

#site-title,
#site-description{
    text-indent: -9999px;
    }

它会通过从可见部分缩进来隐藏文本，这样搜索引擎就会抓取它们并且它对 SEO 友好。但问题是，他们占用了标题部分的空间。为了满足我们需要为以下元素留出空间的空间，这对我来说不是一个好的解决方案。

选项 II:除此之外，我们可以使用 visibility:hidden

#site-title,
#site-description{
    visibility: hidden;
    }

不知道能不能让爬虫抓取到那些文本，不过这里也有同样的问题，它正在占位。

选项 III:但唯一有用的是 display: none它的工作方式类似于纯 HTML 注释 ( <!-- commented out --> )

#site-title,
#site-description{
    display: none;
    }

但实际上，它只是让文本消失了，我认为即使是从爬虫的眼睛中也是如此。所以，对我来说，它对 SEO 不友好。

因此，选项 I 和 II 对解决换位问题很有用。

• 我如何才能将它们放在那里以供 SE-Crawler 使用，但在不发生的情况下从眼睛中看不到？

Answer 1

使用 CSS clip Property是解决此问题的非常干净且无冲突的解决方案。

    h1#site-title,
    h2#site-description{
        position: absolute;
        clip: rect(1px 1px 1px 1px); /* IE7 */
        clip: rect(1px, 1px, 1px, 1px);
    }

CSS clip Property
The clip CSS property defines what portion of an element is visible. The clip property applies only to elements with position:absolute.

浏览器支持: