有一些 SEOs 还停留在 “ JavaScript 对 SEO 不友好 ” 的阶段，但其实 JavaScript 已经成为目前 WEB 生态不可缺少的一项技术，并且 Google 早就实现了对 JavaScript 的支持，比如 Google 已经可以识别 JavaScript 中的内容。
John Mueller 在 2017 年也说过：
作为 SEO 应该注意到：WEB 已经不再是单纯 HTML 的。SEOs 需要学习一些 JS 开发知识，以及 JS SEO 内容。JS 也不会消失。
补充：百度也有渲染爬虫，并对 JavaScript 内容进行识别。因此，本文对百度 SEO 同样适用。
JavaScript SEO 是什么
JavaScript SEO 是技术 SEO 的一项，可以帮助基于 JavaScript 技术的网页实现 SEO 友好，比如抓取、渲染和收录等核心环节，另外也可以优化网页性能，提升用户体验。
Googlebot 如何处理 JavaScript 内容
我们先看下 Googlebot 现在的机制，是如何识别到 JavaScript 中的内容。
Googlebot 之前只有 “网址发现 – 抓取 – 索引” 这 3 个环节，现在加入了 “渲染” 环节，主要就是增强了 JavaScript 内容的识别。
以下是 Googlebot 目前的几个阶段：
- Googlebot 通过 sitemap、网页抓取的方式，将发现到的 URL 汇总成 URL 队列
- Googlebot 按照队列对 URL 分别抓取
- Googlebot 将已抓取网页加入渲染队列，用无头 Chromium 对网页进行渲染，并执行 JavaScript，获取 JavaScript 内容
- 如果网页被判断有价值，Googlebot 将网页纳入索引库
所以，主要是 Googlebot 加入了渲染环节，导致 Googlebot 可以识别出 JavaScript 中的内容。
但需要注意的是，并不是所有内容 Googlebot 都能获取到。需要一些事件触发才展示的内容(比如滚动、点击)，Googlebot 是不一定能获取到的。
注：图中的呈现，就是渲染，翻译问题。
JavaScript SEO 优化指南
JavaScript SEO 主要有内容可识别、链接 SEO 友好、懒加载 SEO 友好、网页性能优化、AJAX 可抓取等 5 个方面，还有几点注意事项。
JavaScript 内容可识别
比如 Alibaba.com 的这种方式：
先加载一个前端框架(在 CDN 上，可实现秒开)，接着使用 JavaScript 动态加载内容。
SEO 需要检查 Googlebot 是否能真正能抓取到自己网站的内容，主要有 3 种工具：GSC 的网址检查工具、Google 的移动设备适合性测试，以及 Google 快照。
这里重点分享下 GSC 网址检查工具的用法：使用 GSC 的网址检查，“测试实际网址”，然后点击“查看被测试的网页”。在右侧的源代码就是 Googlebot 抓取 + 渲染后的 HTML 代码了。你可以在这个 HTML 里查看核心内容是否被 Googlebot 抓取到。
再附赠个小技巧，可以将爬虫看到的的 HTML 源代码复制下来，在 Chrome 中随便打开一个网页，按 F2 将这部分 HTML 内容复制进去，然后敲回车。这样浏览器中看到的内容就是 Googlebot 看到的内容。
另外，Google 的移动设备适合性测试跟网址检查工具类似，Google 快照就是看快照是否包含核心内容。
JavaScript 链接 SEO 友好
因为 Googlebot 是按照 URL 进行抓取和索引，所以链接中要出现可抓取和索引的 URL，不要使用 JS 链接和锚点链接。
以下是几个案例:
好的
<a href="/page">简单友好</a>
<a href="/page oneclick="goto('page')">任然友好</a>坏的
<a oneclick="goto('page')">不友好,没有使用href属性</a>
<a href="javascript:goto()'page">不友好,不是可用的链接地址</a>
<span oneclick="goto('page')">不友好,没有使用a标签 </span>
<a href="#page">不友好,是描点,不是单独的url</a>懒加载 SEO 友好
懒加载是目前 WEB 翻页的常用方式，尤其是移动端。但懒加载尤其需要注意对 SEO 友好。因为 Googlebot 并没有滚动行为，而是采用调整屏幕长短的方式来获取更多内容。
