谷歌分享单页应用的 SEO 技巧

在最新的 Google Lightning Talks 视频中,Martin Splitt 分享了使单页应用程序可被搜索引擎发现的技巧。

常规的、基于 HTML 的网站和单页应用程序之间的主要区别在于后者对 JavaScript 的依赖。

JavaScript 用于为单个页面应用程序创建 HTML,然后创建页面。

当用户导航到单个页面应用程序的不同部分时,需要 JavaScript 来加载其他内容。

当 JavaScript 加载新内容时,它被称为“视图”。

依靠 JavaScript 开发单页应用程序允许浏览器加载视图而无需完全重新加载。

JavaScript 还允许设计元素,例如应用程序不同部分之间的自定义转换。

简而言之——JavaScript 使单页应用程序按照它们的方式运行。

使用单页应用程序的挑战

在爬行和索引方面,JavaScript 对于搜索引擎来说并不理想。

正如 SEO 所熟知的那样,即使页面上的 JavaScript 数量适中,也会带来一系列全新的挑战。

挑战级别提高了一个档次 全部 内容被包裹在一层 JavaScript 中。

这正是单页应用程序的情况。

那么,如果 SEO 的任务是让单页应用程序被索引和排名,他们该怎么办?

这是谷歌推荐的。

Google 对单页应用的建议

Splitt 为单页应用程序提供了四个主要的 SEO 建议:

  • 覆盖所有代码路径
  • 将视图视为 URL
  • 优化每个视图的标题和描述
  • 改进应用程序处理错误的方式

以下是斯普利特每个要点的简要回顾。

覆盖所有代码路径

Splitt 给出了一个单页应用程序的示例,该应用程序似乎运行良好,但 Google 的移动友好测试无法呈现内容。

在示例中,问题源于不受支持的代码,该代码由移动友好测试确定。

更具体地说,代码没有考虑如果某些命令无法执行,应用程序应该做什么。

在 Splitt 的示例中,单页应用程序被指示获取用户的位置信息。 但是没有代码路径来指示应用程序在位置信息不可用时应该做什么。

这就是斯普利特所说的“覆盖所有代码路径”所指的内容。

在移动友好测试中无法加载页面的原因是因为 Googlebot 拒绝了地理定位请求。

如果有处理该场景的代码路径,则可以呈现内容。

将视图视为 URL

在单个页面应用程序中导航时,查看在每个视图之间单击时地址栏中的 URL 是否发生变化。

它应该改变,因为 Googlebot 使用 URL 来定位单个页面应用程序中的不同“页面”(也称为“视图”)。

如果所有内容都只有一个 URL,那么 Googlebot 只会看到主页,而不会看到其他任何内容。

这会导致排名出现问题,因为谷歌无法理解该网站的内容。

斯普利特建议如下:

“为了解决这个问题,我们可以使用历史 API 和带有 href 属性的适当链接标记,将视图公开为链接中的 URL。”

标题和说明

没有什么比优化网页的标题和描述更重要的 SEO 了。

然而,在优化单页应用程序的“视图”时,这个 SEO 基础经常被忽视。

这会导致所有视图都具有相同的标题和描述——并且您可能很清楚可能导致的问题。

每个视图都可以而且应该有自己独特的标题和描述。 这可以通过添加“一点额外的 JavaScript”来实现,Splitt 说。

处理错误

另一个常见问题是单页应用程序处理错误场景的方式,例如无效的 URL。

Splitt 提供了一个单页应用程序示例,该应用程序在服务器显示 HTTP 200 状态代码时显示错误消息。

理想情况下,如果显示内容时出现错误,则服务器不应返回表示一切正常的状态代码。

但是,这不是单页应用程序的选项,因为服务器不进行错误处理。

服务器将始终为单页应用程序返回 HTTP 200 状态代码。 运行代码或显示错误取决于 JavaScript 和浏览器。

这应该被修复,因为 HTTP 状态代码帮助 Googlebot 和浏览器决定如何处理错误响应。

没有直接的解决方法,因为在服务器加载单页应用程序后无法更改 HTTP 状态代码。

你什么 能够 要做的是更改单个页面应用程序中各个视图的默认状态代码。

所以 Splitt 建议创建一个服务于 404 代码的视图,一个服务于 500 代码的视图,等等。

然后可以编辑 JavaScript 以在代码中遇到错误时将浏览器引导到适当的视图。

有关此建议的更多信息,请参阅下面的完整视频:

给TA打赏
共{{data.count}}人
人已打赏

Google 发现广告现在可供所有广告商使用

2022-2-16 0:09:26

IndexNow 是搜索引擎索引的重大变化

2021-10-19 0:30:43

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
搜索