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：但在某些网页中，我们看不到任何网站标题或描述，而是网站徽标。在这种情况下，设计师建议使用 atext-indent来隐藏它们。

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

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

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

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

我不知道它是否使爬虫能够爬取那些文本，但这里也有同样的问题，它正在取代它。

选项 III：但唯一有用的是display: none，它就像一个纯 HTML 评论 ( )

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

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

因此，选项 I 和 II 对于占位问题很有用。

我怎么能把它们放在 SE-Crawler 那里，但在没有发生的情况下从眼睛看不见？

score 1 · Accepted Answer

使用CSSclip属性是解决此问题的一个非常干净且不冲突的解决方案。

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