具有 CSS Hidden 属性的 H1 元素？答案

【问题标题】：H1 Element with CSS Hidden property?具有 CSS Hidden 属性的 H1 元素？
【发布时间】：2015-01-28 00:08:57
【问题描述】：

这周我一直在研究很多标题标签和概述策略。现在，我被很多信息困住了。

阅读HTML5 Doctor: Document Outline article，我对“Untitled Sections”没有任何问题，但是，你放置一些标题标签并用CSS隐藏它的方式。当我读到这里时，我的大脑被炸毁了。我一直听说“隐藏元素策略，是 SEO 的黑帽问题”。

考虑代码：

 <header>
   <h1>My Website</h1>
   <nav>
     <a href="#"></a>
   </nav>
 </header>
 <main>
   <h2>This is a cool title</h2>
 </main>

在大纲中，结果是：

我的网站
- 未命名部分
- 这是一个很酷的标题

好的，现在让我应用隐藏策略：

 <style>
   .hidden{ visibility: hidden; }
 </style>

 <header>
   <h1>My Website</h1>
   <nav>
     <h2 class="hidden">Navigation</h2>
     <a href="#"></a>
   </nav>
 </header>
 <main>
   <h2>This is a cool title</h2>
 </main>

现在，我的大纲得到了：

我的网站
- 导航
- 这是一个很酷的标题

只需使用 CSS 隐藏元素即可。

问题是：我真的能做到吗？

OBS：我用来测试大纲的工具：https://gsnedders.html5.org/outliner/

【问题讨论】：

我投票结束这个问题，因为它是关于 SEO 的
这是黑帽搜索引擎优化，会让您的网站被禁止。不要只向搜索引擎提供内容。
这应该保留，因为它是任何前端开发人员/编码人员了解 SEO 及其工作原理的基本要求。它们齐头并进，对于任何从 HTML/CSS 开始的人来说，了解这个主题实际上是至关重要的。如果他们从一家公司开始并将他们的网站从搜索引擎中列入黑名单，那么这就是一个大问题。我投票支持这个话题停留一段时间。至少新手用户可以通过理解这一点有所收获。

标签： css html seo html-heading

【解决方案1】：

简单而直接的答案是您不应该使用隐藏文本...您可以通过在页面上隐藏关键字填充句子来在短时间内欺骗搜索引擎，但您可能会冒着拥有您的网站的风险永久禁止搜索引擎。

该方法在 1996 年和 1997 年创造了奇迹，当时搜索引擎能够自动识别并击败它们。这是一个搜索引擎渴望索引尽可能多的页面的时代——尽可能快地增加他们的索引。那时，所有形式的垃圾邮件都是可以容忍的。事实上，谷歌的创始人特别提到对搜索结果的操纵是迫使他们首先创建谷歌的一个因素。

幸运的是，自 1997 年以来，搜索引擎一直对操纵其结果的努力保持警惕，并且每个主要搜索引擎都明确禁止以下描述的每种方法。当然，谷歌在打击垃圾邮件的斗争中一直处于领先地位。使用这些技术中的任何一种都可能导致您的网站被主要搜索引擎永久禁止。

简而言之。如果您被发现使用这种方法，您可能会被永久禁止和列入黑名单的搜索引擎......所以不要冒险！

-Epik

【讨论】：

【解决方案2】：

使用隐藏文本被视为黑帽，并已被大多数主要搜索引擎识别为垃圾邮件。

你听说过Spamdexing

Google 和其他主要搜索引擎足够聪明，可以对抗 Spamdexing。

因此，使用隐藏标签可能对您的网站有害。希望这会有所帮助

【讨论】：