从SEO的角度看分页、无限滚动和”阅读更多”哪个好？
在一年多前，极诣在《 SEO的未来，写给从事或者即将从事SEO的从业者》一文中曾经断言SEO是会消失的职业，也是最应该被消灭的职业。之所以这样说是因为SEO的各个职能被分解了，一个优秀的SEO，应该是一个前端工程师，一个网站构架师，一个产品经理，一个好编辑，一个业务开发，一个内容营销者。这个岗位很难在市场中找到优秀的人才的原因也在这里。SEO需要大量的知识和与企业内部各个职能进行沟通的能力，当然还需要与其他外部资源沟通的能力。所以说SEO之所以消失，并不是SEO本身消失，而是SEO职能被消化。它应该被溶解到整个系统中去。
本篇我们举一个小例子来看看从SEO的角度来看，解决列表和长内容应该如何选择最优的解决方案。这显然是一个产品经理的问题，那么SEO会怎么看待呢？
传统分页方式（Pagination）
大部分列表依然在传统分页模式上。百度桌面版就是最好的例子。在许多电子商务网站上我们可以看到结果以页的单位呈现。有许多内容性质的网站也会把长文章分割成若干个小段，而用若干个页面来呈现文章。
传统分页方式有它的优点：
- 避免一次性载入大量数据，增加客户端和服务器端负担。
- 增加页面浏览量，从而增加广告位以增加广告收入。
- 易于SEO。搜索引擎大都对分页展现有良好的理解能力。
但是传统分页的缺点也比较明显：
- 由于每次都要载入页头页尾边栏等元素，总的数据量增大。
- 许多媒体即便很短的文章也要强行分页，破坏了用户体验。
- 处理不当会造成重复内容，反而不利于SEO。
- 研究表明相对于其他两种方式，分页的用户阅读量最少
在我们处理分页的SEO时，需要做好两点：
首先要应用rel=”prev”和rel=”next”标签。举个例子：
https://maxket.com/page/2/ 这个页面中我们会添加
<link rel=”prev” href=”https://maxket.com/” />
和
<link rel=”next” href=”https://maxket.com/page/3/” />
表示前一页和后一页分别是什么。这样的写法是谷歌所支持和推荐的，百度的支持未知。这样做的好处是搜索引擎可以理解你这“一系列”页面之间的关系，它们可能有着相同的页面标题和描述，但是搜索引擎可以理解你的意图。
其次，直白地说出“上一页”，“下一页”，“第n页”总会对还不支持上述标签的搜索引擎提供帮助。在锚点文字和页面标题中使用这些词可以帮助搜索引擎理解这组页面之间的关系，免得丢弃重复内容。
无限滚动（Infinite Scroll）
无限滚动的诞生得益于Ajax技术的应用。如今我们随处可以看到无限滚动的页面。在手机上必应图片搜索就是无限滚动的。国外著名的各大社交网络都应用了无限滚动技术。
无限滚动技术依赖的是一种叫 Lazy Loading的设计理念，也就是说当用户还没要往下探索之前先不要提前加载大量内容，由此来节约资源。与之相反的叫做eager loading。微信朋友圈文章就用了Lazy Loading技术，仅当你阅读到该处，该处图片才会读取。
无限滚动的优点非常明显：
- 无限滚动节约了资源，只有用户需要往下看时才载入。
- 无限滚动仅仅载入内容部分，进一步节省了资源。
- 翻页变得更加便利。只需滚动或者手指往上滑即可看“下一页”
- 相较于翻页，用户浏览量变得更多。
可是无限滚动也有一些缺点：
- 浏览者对内容的专注度不够，他们往往只是很快地浏览。
- 多次滚动后会对客户端资源造成影响，此时可能会需要释放一些资源。
- 无限滚动通常会有一些SEO问题。如果是社交网络那大可不必担心，因为每个人的内容可能都是客户化的，而且社交网络对搜索引擎的依赖度低。但是如果是电子商务网站的话那会影响搜索引擎发现内容的能力，因为搜索引擎不会“向下滚动”。许多内容可能缺少了列表页帮助它们把内容“推到表面”。
- 用户很难看到页脚上的内容，这造成很大麻烦。因为联系方式等重要信息都会在这里。
对SEO来说要解决的是上面第三点。我们其实可以通过现代浏览器 History API的pushState()和replaceState()来完成。当用户向下滚动时，我们会载入新页面接到现有页面，同时更新浏览器地址栏内地址。这样做对SEO没有影响，只是用户可以很好地复制地址栏内的网址。对搜索引擎来说读取的是第一页，然后通过该页面内的rel=”next”标签可以找到下一页。每一页都是不一样的内容。通过这个方法自然人和机器人的需求都可以被满足。这里有个谷歌推荐的简化的例子（需翻墙） http://scrollsample.appspot.com/items。下图说明了原理：
“阅读更多”，“载入更多”（Read More，Load More）
这种方法提供了一个按钮，让访客自己决定是否要载入更多的内容在该页面尾部。我们打开腾讯新闻的手机网页版就会发现这种功能，其实它是非常普遍的。
“阅读更多”，“载入更多”更多像前两种模式的择中选择，说下优缺点。
“阅读更多”，“载入更多”的优点：
- 节省资源，这点与无限滚动一样。
- 用户仍然轻松与页脚交互，如果这也算优点的话。
- 用户浏览的内容仍然比分页模式多。
- 移动设备上应用时可以防止初始页面过长。
“阅读更多”，“载入更多”的缺点同样存在：
- 用户浏览的内容比无限滚动要少。
- 多次载入后会对客户端资源造成影响，此时可能会需要释放一些资源。
- 处理不当会造成SEO问题。
这里的SEO问题有两种。一种是文章应用“载入剩余X%”时，如果默认载入页面时未载入剩余部分内容，对搜索引擎来说可能看到许多很短的文章，判定为垃圾网页。如果只是隐藏内容，那么是否被搜索引擎判定为作弊又是一个问题。另一种是我们之前说的入口问题，这是和无限滚动一样的问题。
在处理列表时，最优做法是结合无限滚动和载入更多按钮。SEO方面建议文章载入全部内容，列表的话应用浏览器的API和分页来载入实现。请参考桌面版的必应图片搜索（这个例子里并没有分页）。
总结一下
我们在上面讨论了三种处理长内容的方式，没有一种是完美的。我们可以扬长避短，结合各种方式来进行设计和部署。对SEO来说，内容相对于搜索引擎的发现是关键，避免相同内容的页面是原则。
感谢阅读，感谢关注极诣。
