你不得不知道的SEO与前端之间的关系（使用display:none就是SEO作弊吗）

经常收到小伙伴的私信，如：

从飞优角度来讲，我们把以上问题简单定义为网站前端设计会不会影响到SEO的整体效果，以使用Display:none属性为例,它会不会被判定为SEO作弊？在搞清楚之前我们先需要掌握Display:none的具体定义和使用场景。

Display:none的定义

Display:none是CSS代码中在需要隐藏文字时需要用到的代码，当放到网站的页面时，它可以简单的控制内容是否显示。主要作用节省屏幕空间以达到美化和提升用户体验的目的地。

比如：许多大型CMS门户网站，为了实现简洁而良好的用户体验，经常会使用display:none属性去隐藏部分模块，当用户鼠标划过或点击某个按钮等行为时，这些模块会通过js代码显现出来。它可以在有限的空间里给用户展示更多的内容，提高了用户的体验，节约了屏幕空间。

参考示例-导航展示

但是任何事物都有两面性，它的另一面就是被人用来SEO作弊。

前端与SEO的关系

Display:none这种可以隐藏文字的功能经常会被SEO作弊者利用，意图提高文字相关性，或希望某些与页面不相关的但搜索次数高的关键词能有排名和流量。当然，搜索引擎也不是傻子，在作弊与反作弊的较量上几乎从没有停止过，如今这个属性已经造成了搜索引擎的敏感。

这么理解起来比较晦涩，总的来说就是用户想看到的你没有给展示，但是我只能通过查看源代码及相关提示引导才能看到相关的内容，从这一行为上判断就能筛选出这个内容是否是正常行为或者刻意为之，若是刻意的那你能从相关的JS代码进行查看，所以检查出来也是比较容易的。

那我们再回到读者之前的问题：

Q1.请问display:none是否被搜索引擎认为作弊？或者直接忽略其中的内容？

Q2.如果想实现部分内容不在前台显示，而被搜索引擎抓取，比较可靠有效的方式是什么？

关于Q1：仅仅因为使用display:none并不会被搜索引擎认为是作弊，也不会忽略其中的内容。

Display:none可以有很正常的使用场景，和作弊没有任何关系，比如PC版和移动版显示不同菜单、排版，某些内容太长，缺省设置是隐藏的，用户点击“显示更多/点击阅读”或加号，或者点击选项卡，内容才显示。这很正常。 

参考示例说明：

关于Q2：但你说的情况可能就危险了，因为实现部分内容不在前台显示，而被搜索引擎抓取。如果所谓部分内容不在前台显示，指的是前面说的类似情况，用户点击选项的话，还是可以显示的，那没问题。如果不显示的内容，无论用户做什么都显示不出来（除了看源代码），用户是怎么都看不到的，而你又想被搜索引擎当作正文抓取，那就是刻意隐藏文字了，有作弊之嫌。这样会收到惩罚，这里一般性而言黑帽会用得较多，具体示例就不变展示，否则会有被判定为恶意怂恿之嫌疑，撤了撤了！

正确倡导前端与SEO良性发展

当然大家也不必杞人忧天，按照飞优前面介绍的正确的使用场景这是不会判定为作弊的，只有哪些刻意为之通过挂相关的高流量词做跳转不展示给用户且能正常抓取这样才会收到搜索引擎的严判，基本上就是死刑了。

若非要用到display:none并且也需要关联到文字且做到隐藏，那我们不妨采用这种替代方案，这是能接受的：

.xxx{display: block;height: 0;width: 0;overflow: hidden;}

所以大家还是不要太刻意使用捷径来做SEO，没有捷径可走，唯有扎实做好内容，解决用户需求，这样才能形成好的搜索体验带来源源不断的自然流量。

最后祝愿大家都能流量暴增！