我们如何提升Baklib的SEO表现
Baklib因客户端AJAX加载内容致谷歌爬虫无法抓取，SEO受影响。解决方案为：用户访问用带查询参数URL异步加载内容并设规范标签，机器人访问则服务器端渲染整页，效果良好。
- 用于在内容间导航的分类树（左侧）
- 内容部分（中间）
- 目录（右侧）
- 搜索（顶部）
到目前为止，我们还没有谈到实际问题。最近，我们的一些客户Dagle开始抱怨，知识库SEO受到了影响，用户在使用搜索引擎查找内容时遇到了麻烦。经过初步分析，我们发现页面加载内容的机制对SEO产生了影响。
我们获取内容的实现是在客户端初始化完成后进行的，会发起一个“ajax”请求来获取当前选定文章的内容，然后内容稍后才被绘制到DOM上。知识库是基于以下步骤加载的。
- 用户打开一个URL，例如：[https://docs.document360.com/docs/december-2023]
- 页面的整体布局在服务器端渲染
- 服务器返回整体渲染的布局页面，以及一些在客户端进行渲染所需的数据。
- 一旦布局初始化完成，客户端会向服务器发送请求以获取当前文章的内容，网络请求的URL看起来像这样‘{subDomain}/load-article/{slug}’
- 更具体地说，URL可能看起来像这样 https://docs.document360.com/docs/december-2023
Google 爬虫会访问同样的 URL，但它无法找到文章内容，因为 Google 不知道我们是通过子嵌套路由 'load-article' 来加载内容的。因此，这显然是一个根本性问题，对我们的 SEO 造成了巨大影响。这还导致了几个更多的问题：
- Google 搜索结果中出现重复条目
- Google 缓存的内容是空的
当我们查看公共网站的‘缓存’页面时，它完全是空的。因此，我们着手寻找一个最优且强大的解决方案，既能提高我们的 SEO 分数，又不会在未来引发更多问题。
我们是如何解决这个问题的：
我们仍然坚持认为，当用户在分类树之间切换文章时，不应该重新加载整个页面，所以我们无论如何都需要进行一次‘ajax’调用。但我们需要在不渲染整个页面的情况下渲染内容。
让我们设想两种场景：
- 用户访问页面并通过导航树阅读文章
- 机器人或蜘蛛在链接上爬取页面
场景 1: 用户访问页面
当用户访问页面时，如上所述，我们只应在文章间导航时渲染内容。但对于情况 2 则不然，当机器人访问一个 URL 时，它只需要爬取内容，它并不关心或不知道我们是否再次渲染了内容。
为了更好地理解，这里有一个更好的例子。从用户的角度来看，当用户浏览文章时，我们移除了名为'load-article'的嵌套路由，而是直接向实际URL发起请求，并添加一些额外的查询参数来通知服务器这个请求是由用户发起的。
URL看起来像这样：'{subDomain}/release-notes/?partialView=on'。Google会将带参数和不带参数的URL视为两个不同的URL。为了解决这个问题，我们添加了一个规范标签，这样Google就会忽略带有查询参数的URL[更多参考请见Google文档]。
一个网站可以有查询参数来保存状态等。因此，当这个请求到达服务器时，服务器只返回内容。一旦接收到内容块，它就会被绘制到客户端。
场景2：机器人访问页面
当机器人访问页面时，我们在服务器端渲染整个页面内容。当机器人访问页面时，它只能通过站点地图直接知道内容的URL。
最后的话
我们部署了这个解决方案，并在内部观察了几周，发现这种方法效果更好，并且通过Google Lighthouse测量的指标有所改善。
之前
之后
如果您对SEO的工作原理有更深入的研究兴趣，可以查看以下参考资料。
💛🧡🧡客户评价：Baklib做得很好，您将获得一个易于设置和运行的可靠知识库系统。用户界面简单明了，对文章进行编辑也很快。它没有过多您不需要的额外功能和，他们显然花了时间把基础知识做好。
Baklib是一款直观的知识库软件，可轻松添加您的内容并与任何应用程序集成。试试Baklib吧！
