什么是JavaScript SEO？

很多的博客网站是由WordPress提供的支持，其余还有很多的网站大部分都由JavaScript提供。大多数网站使用某种JavaScript来增加交互性并改善用户体验。有些人将其用于菜单，获取产品或价格，从多个来源获取内容，或者在某些情况下，用于网站上的所有内容。截止目前，JavaScript无处不在。我并不是说SEO必须要去学习如何编写JavaScript，相反SEO最需要了解Google如何处理JavaScript以及如何解决问题。

什么是JavaScript SEO？

JavaScript SEO是Technical SEO（搜索引擎优化）的一部分，该技术旨在使JavaScript繁重的网站易于爬取和建立索引，并且易于搜索。目的是要找到这些网站并在搜索引擎中排名更高。JavaScript对SEO非常有好处。它与许多SEO习惯不同，有一些学习曲线。人们确实倾向于在可能有更好解决方案的事情上过度使用它，但是您有时必须使用已有的东西。你只需知道，Javascript并不完美，也不总是适合SEO工作的工具。与HTML和CSS不同，它无法进行逐步解析，并且可能会严重影响页面加载和性能。在许多情况下，您可能会为了性能而牺牲性能。

Google如何使用JavaScript处理网页？

在搜索引擎的早期，下载的HTML响应足以查看大多数页面的内容。由于JavaScript的兴起，搜索引擎现在需要呈现许多页面，就像浏览器一样，以便他们能够以用户的方式查看内容。Google处理渲染过程的系统称为Web渲染服务（WRS）。 Google提供了一个简单的图表来说明此过程的工作方式。

假设我们从URL开始该过程：

1. Crawler

Crawler将GET请求发送到服务器。服务器以标头和文件内容作为响应，然后将其保存。该请求很可能来自移动用户代理，因为Google现在主要采用移动优先索引。 您可以使用Search Console中的URL Inspection Tool来查看Google如何抓取您的网站。当您为网址运行此代码时，请检查“ Crawled as”的覆盖率信息，它应该告诉您是否仍在使用桌面索引编制或移动优先索引编制。

这些请求主要来自美国加利福尼亚的山景城，但也对美国境外的语言环境支持页面进行了一些爬网。我之所以这样说是因为某些网站会阻止或对待来自特定国家/地区或以不同方式使用特定IP的访问者，这可能会导致Googlebot无法看到您的内容。

一些站点还可能使用用户代理检测来向特定的搜寻器显示内容。特别是在JavaScript网站上，Google可能会看到与用户不同的东西。这就是为什么Google工具（例如Google Search Console中的URL Inspection Tool，移动友好测试和Rich Results Test）对于解决JavaScript SEO问题非常重要。它们向您显示Google看到的内容，对于检查Google是否可能被阻止以及他们是否可以看到页面上的内容非常有用。同样需要注意的是，尽管Google在上图中将抓取过程的输出表示为“ HTML”，但实际上，它们正在抓取并存储构建页面所需的所有资源。HTML页面，Javascript文件，CSS，XHR请求，API端点等。

2. Processing

图像中的“Processing”一词混淆了许多系统。 我将介绍其中一些与JavaScript相关的内容。

资源和链接

Google不会像用户那样浏览页面。处理的一部分是检查页面是否具有指向其他页面的链接以及构建页面所需的文件。这些链接被拉出并添加到抓取队列中，这正是Google用来确定抓取优先级和计划抓取的时间。

Google将从<link>标记之类的内容中提取构建页面所需的资源链接（CSS，JS等）。 但是，指向其他页面的链接必须采用特定的格式，Google才能将其视为链接。内部和外部链接必须是具有href属性的<a>标记。对于不支持搜索的JavaScript用户，有很多方法可以使其起作用。

缓存

Google下载的每个文件（包括HTML页面，JavaScript文件，CSS文件等）都将被积极地缓存。 Google会忽略您的缓存时间，并在需要时提取新副本。我将在“渲染器”部分中进一步讨论这一点以及它为什么如此重要。

重复消除

在将下载的HTML发送到呈现之前，可以从下载的HTML中删除重复的内容或将其取消优先级。使用应用程序外壳模型时，HTML响应中几乎不会显示任何内容和代码。实际上，站点上的每个页面都可能显示相同的代码，并且可能是在多个网站上显示的相同代码。有时这可能会导致页面被视为重复页面，而无法立即进行渲染。更糟糕的是，错误的页面甚至错误的网站都可能显示在搜索结果中。随着时间的推移，这应该会自行解决，但可能会出现问题，尤其是对于较新的网站。

最严格的指令

Google将在HTML和页面的呈现版本之间选择限制性最强的语句。如果JavaScript更改了一条语句，并且与HTML中的语句冲突，则Google只会服从限制性最强的一个。Noindex将覆盖索引，HTML中的noindex将完全跳过呈现。

3. 渲染队列

现在每个页面都转到渲染器。许多使用JavaScript和两阶段索引（HTML然后呈现页面）的SEO的最大担忧之一是页面可能几天甚至几周都无法呈现。当Google对此进行调查时，他们发现页面以5秒的中值时间到达了渲染器，而第90个百分位是数分钟。因此，在大多数情况下，获取HTML和呈现页面之间的时间量不应该成为问题。

4. 渲染器

渲染器是Google渲染页面以查看用户所见的地方。他们将在这里处理JavaScript以及JavaScript对文档对象模型（DOM）所做的任何更改。

为此，Google使用的是无头Chrome浏览器，该浏览器现在“常绿”，这意味着它应该使用最新的Chrome版本并支持最新的功能。直到最近，Google才使用Chrome 41进行渲染，因此不支持许多功能。Google提供了有关Web Rendering Service（WRS）的更多信息，其中包括拒绝权限，无状态，扁平化轻型DOM和阴影DOM等内容。网络规模的渲染可能是世界第八大奇迹。 这是一项严肃的工作，需要大量的资源。 由于规模庞大，Google在呈现过程中采取了许多捷径来加快处理速度。

缓存的资源

Google严重依赖缓存资源。页面被缓存；文件被缓存； API请求被缓存；基本上，所有内容在发送到渲染器之前都会被缓存。他们并没有为每次页面加载都下载并下载每种资源，而是使用缓存的资源来加快此过程。这可能会导致一些不可能的状态，在这种状态下，渲染过程中会使用以前的文件版本，而页面的索引版本可能包含旧文件的一部分。进行重大更改后，您可以使用文件版本控制或内容指纹生成新文件名，以便Google必须下载资源的更新版本以进行渲染。

无固定超时

一个常见的SEO谬论是，渲染器仅等待五秒钟即可加载页面。虽然让您的网站更快一直是个好主意，但对于Google缓存上述文件的方式，这种说法并没有真正意义。他们基本上是在加载一个页面，其中已经缓存了所有内容。诸如URL Inspection Tool之类的测试工具，在这些工具中实时获取资源，并且需要设置合理的限制。

渲染器没有固定的超时时间。他们可能正在做的事情类似于公共Rendertron所做的事情。他们可能会等待诸如networkidle0之类的事件，此时不再有网络活动发生，并且还设置了最大时间，以防卡住或有人试图在其页面上挖掘比特币。

Googlebot看到了什么

Googlebot不会对网页执行任何操作。他们不会点击或滚动，但这并不意味着他们没有解决方法。对于内容，只要无需进行任何操作即可将其加载到DOM中，他们就会看到它。我将在疑难解答部分中对此进行详细介绍，但是基本上，如果内容在DOM中但只是隐藏的，则可以看到它。如果在单击之后才将其加载到DOM中，则将找不到该内容。

Google无需滚动即可查看您的内容，因为他们有一个聪明的解决方法来查看内容。对于移动设备，他们加载页面大小为411x731像素的页面，并将其长度调整为12,140像素。从本质上讲，它成为屏幕尺寸为411x12140像素的超长手机。对于台式机，它们的操作相同，并且从1024x768像素变为1024x9307像素。

视觉效果可能有助于解释切出的部分更好。 在Chrome开发工具中，如果您在“效果”标签上运行测试，则会获得加载图表。 此处的绿色实心部分表示绘画阶段，对于Googlebot来说，这是从未发生过的事情，因此可以节省资源。

5. 抓取队列

Google的资源中有一些关于抓取预算的内容，但是您应该知道每个站点都有自己的抓取预算，并且每个请求的优先级都必须确定。Google还必须平衡您的网站爬网与Internet上其他所有网站的平衡。一般而言，较新的网站或具有许多动态页面的网站的爬网速度可能会较慢。 某些页面的更新频率将低于其他页面，并且某些资源的请求频率也会降低。

写在最后

JavaScript是明智使用的工具，而不是SEO所担心的工具。希望本文能帮助您了解如何更好地使用它。不要害怕与您的开发人员联系并与他们合作，并向他们提问。他们将成为您最大的盟友，帮助您改善搜索引擎的JavaScript网站。

数聚梨软件为您提供最专业的谷歌seo优化服务，1-3个月内网站权重以及关键词进入谷歌前10页数量显著增加

立即点击淘宝咨询

立即扫描二维码微信咨询