百度网站搜索引擎优化-SEO和JavaScript：你需要知道的6件事
2021-01-18 16:58:49
了解JavaScript的基础已经成为现代SEO优化专业人员的一项重要技能，尽管直到最近这两个学科之间的关系一直是一个备受争议的主题。
在SEO和JavaScript界面上徘徊的关键问题是搜索引擎爬虫是否能够正确感知网站的内容，并且真实地评估用户体验。
虽然可以通过爬虫直接读取与PHP，CSS等一起使用的HTML，但是无法立即访问基于JavaScript的网站。Google抓取工具首先分析DOM，然后才会渲染网站。
基本定义
在我们深入研究优化JavaScript的最佳实践之前，让我们快速浏览一些基本术语：
JavaScript是一种用于使网页动态和交互的编程语言。您可以将JavaScript放入HTML文档，或者创建链接或引用它。
HTML代表超文本标记语言。简单来说，它是一个内容组织者：HTML提供网站的结构（项目符号列表，标题，副标题，段落等）并定义静态内容。
AJAX 是异步JavaScript和XML。基本上，它更新内容而不刷新整个页面。AJAX使Web应用程序和服务器能够在不干扰当前页面的情况下进行通信。
但是，您应该注意，从2018年第二季度开始，Google将不再需要AJAX来呈现基于JavaScript的网站。
现代SEO专业人员也应该对DOM（文档对象模型）有基本的了解。您可以将DOM视为Google用于浏览和分析网页的工具。
首先，Google收到HTML文档并识别其JavaScript元素。然后浏览器启动DOM，使搜索引擎能够呈现页面。
1.让搜索引擎查看您的JavaScript
Robots.txt旨在为Google搜索引擎提供适当的抓取机会。如果阻止他们看到JavaScript，则网页抓取工具的页面显示方式与用户不同。
这意味着搜索引擎无法获得完整的用户体验，Google可能会将此类操作解释为隐藏真实内容。
最好的方法是为网络抓取工具提供他们以与用户完全相同的方式查看网页所需的所有资源。
考虑安排与网站开发人员的会议，并共同决定哪些文件应该从搜索引擎中隐藏，哪些文件应该可以访问。
2.内部链接
内部链接是一个强大的SEO工具，用于向搜索引擎显示您的网站架构并指向最重要的网页。
这里最基本的建议是：使用内部链接，甚至不尝试用JavaScript点击事件替换它。
是的，可能会通过点击事件找到并抓取结束网址，但网页抓取工具不会将其与您网站seo的全局导航相关联。
因此，最好通过在HTML或DOM中使用常规锚标记来实现内部链接，以便为用户提供更好的体验。
3. URL结构
基于JavaScript的网站过去常常在URL中包含片段标识符，但Google不建议使用单独的哈希（＃）和hashbangs（＃！）。
强烈推荐的方法是pushState History API。它更新地址栏中的URL，并允许JavaScript网站利用干净的URL。
干净的URL也称为搜索引擎优化友好的URL，由纯文本组成，非专业用户可以轻松理解。
考虑使用pushState进行无限滚动，因此每次用户点击页面的新部分时URL都会更新。在完美的场景中，用户可以刷新页面并仍然保持在完全相同的位置。
此外，探索SEO 最佳URL实践并开始使用它们来改善用户体验。
4.测试您的网站
谷歌能够抓取并理解许多形式的JavaScript，尽管其中一些可能比其他形式更具挑战性。
以下是BartoszGóralewicz的一项实验，该实验展示了Googlebot如何在不同的框架上与JavaScript进行交互。
这项研究有助于我们了解何时需要主动担心和采取行动。
但是，预测可能的错误和问题并避免它们总是更好，那么为什么不进行一些测试呢？
请按照以下两个基本步骤来检测可能的中断：
检查网页上的内容是否显示在DOM中。
测试几页以确保Google能够为您的内容编制索引。
了解Google是否能够在您的robots.txt中查看您的内容和JavaScript并对其进行正确分析至关重要。因此，请考虑手动检查您的内容片段并通过Google获取内容以查看内容是否显示。
按照Google提供的这份简短指南测试您的网站。
完成所有测试，结果看起来很有希望？大！
但是，如果某些东西不起作用呢？
如果有任何迹象表明Google无法正常查看您的内容，请致电您的开发团队寻求帮助。
同时，HTML快照可以挽救这种情况。
5. HTML快照
谷歌在2009年推出了HTML快照，并于2015年批准了它们。这是一个长篇故事和一个持续的主题。
您应该知道的是，Google仍然支持HTML快照，尽管它已经确定它们是“避免”的元素。
在几种情况下，HTML快照可能是必需的，因此您至少应该熟悉它们。
例如，如果搜索引擎无法掌握您网站上的JavaScript，则可以为他们提供HTML快照，这比根本没有索引和理解您的内容更好。
在完美的世界中，网站将在服务器端使用某种用户代理检测，并向机器人和用户显示HTML快照。
请注意，Google力求看到与观看者完全相同的体验。因此，最好将HTML快照返回给搜索引擎抓取工具。
但是，只有在JavaScript出现问题的情况下才会这样做，并且无法联系您的支持团队。
6.网站延迟
当浏览器使用收到的HTML文档创建DOM时，它会完全按照HTML文档中提到的方式加载大部分资源。
如果HTML文档顶部存在一个海量文件，浏览器将首先加载这个巨大的文件，所有其他信息只会在之后出现，并且会有很长的延迟。
Google关键渲染路径的关键思想是首先加载对用户至关重要的信息。换句话说，为用户提供最重要的内容。
如果您的JavaScript文件或一些不必要的资源阻碍了页面加载速度，您可能会使用渲染阻止JavaScript，也称为感知延迟。
这意味着您的网页可能会更快出现，但JavaScript代码正在减慢它们的速度。
检查使用Page Speed Insights或其他类似工具加载页面所需的时间。分析结果以查看是否存在渲染阻止JavaScript。
以下是一些解决它的顶级解决方案：
在HTML中添加JavaScript。
将“async”属性添加到HTML以使JavaScript异步。
减少HTML文档中的JavaScript元素。
在尝试改善这种情况时，请记住JavaScript的基本规则。
例如，脚本必须按特定顺序排列（优先顺序）。如果某些脚本引用文件，则只能在加载引用的文件后使用它们。
您应该经常与开发团队保持联系，以确保任何更改都不会中断用户体验。
结论
搜索引擎不断发展，因此毫无疑问，谷歌优化他们将来会更好，更快地解读您的JavaScript。
目前，网站搜索引擎优化请确保您的现有内容可以抓取并可获取，并确保适当的网站延迟。希望本文将帮助您优化您的网站
在SEO和JavaScript界面上徘徊的关键问题是搜索引擎爬虫是否能够正确感知网站的内容，并且真实地评估用户体验。
虽然可以通过爬虫直接读取与PHP，CSS等一起使用的HTML，但是无法立即访问基于JavaScript的网站。Google抓取工具首先分析DOM，然后才会渲染网站。
基本定义
在我们深入研究优化JavaScript的最佳实践之前，让我们快速浏览一些基本术语：
JavaScript是一种用于使网页动态和交互的编程语言。您可以将JavaScript放入HTML文档，或者创建链接或引用它。
HTML代表超文本标记语言。简单来说，它是一个内容组织者：HTML提供网站的结构（项目符号列表，标题，副标题，段落等）并定义静态内容。
AJAX 是异步JavaScript和XML。基本上，它更新内容而不刷新整个页面。AJAX使Web应用程序和服务器能够在不干扰当前页面的情况下进行通信。
但是，您应该注意，从2018年第二季度开始，Google将不再需要AJAX来呈现基于JavaScript的网站。
现代SEO专业人员也应该对DOM（文档对象模型）有基本的了解。您可以将DOM视为Google用于浏览和分析网页的工具。
首先，Google收到HTML文档并识别其JavaScript元素。然后浏览器启动DOM，使搜索引擎能够呈现页面。
1.让搜索引擎查看您的JavaScript
Robots.txt旨在为Google搜索引擎提供适当的抓取机会。如果阻止他们看到JavaScript，则网页抓取工具的页面显示方式与用户不同。
这意味着搜索引擎无法获得完整的用户体验，Google可能会将此类操作解释为隐藏真实内容。
最好的方法是为网络抓取工具提供他们以与用户完全相同的方式查看网页所需的所有资源。
考虑安排与网站开发人员的会议，并共同决定哪些文件应该从搜索引擎中隐藏，哪些文件应该可以访问。
2.内部链接
内部链接是一个强大的SEO工具，用于向搜索引擎显示您的网站架构并指向最重要的网页。
这里最基本的建议是：使用内部链接，甚至不尝试用JavaScript点击事件替换它。
是的，可能会通过点击事件找到并抓取结束网址，但网页抓取工具不会将其与您网站seo的全局导航相关联。
因此，最好通过在HTML或DOM中使用常规锚标记来实现内部链接，以便为用户提供更好的体验。
3. URL结构
基于JavaScript的网站过去常常在URL中包含片段标识符，但Google不建议使用单独的哈希（＃）和hashbangs（＃！）。
强烈推荐的方法是pushState History API。它更新地址栏中的URL，并允许JavaScript网站利用干净的URL。
干净的URL也称为搜索引擎优化友好的URL，由纯文本组成，非专业用户可以轻松理解。
考虑使用pushState进行无限滚动，因此每次用户点击页面的新部分时URL都会更新。在完美的场景中，用户可以刷新页面并仍然保持在完全相同的位置。
此外，探索SEO 最佳URL实践并开始使用它们来改善用户体验。
4.测试您的网站
谷歌能够抓取并理解许多形式的JavaScript，尽管其中一些可能比其他形式更具挑战性。
以下是BartoszGóralewicz的一项实验，该实验展示了Googlebot如何在不同的框架上与JavaScript进行交互。
这项研究有助于我们了解何时需要主动担心和采取行动。
但是，预测可能的错误和问题并避免它们总是更好，那么为什么不进行一些测试呢？
请按照以下两个基本步骤来检测可能的中断：
检查网页上的内容是否显示在DOM中。
测试几页以确保Google能够为您的内容编制索引。
了解Google是否能够在您的robots.txt中查看您的内容和JavaScript并对其进行正确分析至关重要。因此，请考虑手动检查您的内容片段并通过Google获取内容以查看内容是否显示。
按照Google提供的这份简短指南测试您的网站。
完成所有测试，结果看起来很有希望？大！
但是，如果某些东西不起作用呢？
如果有任何迹象表明Google无法正常查看您的内容，请致电您的开发团队寻求帮助。
同时，HTML快照可以挽救这种情况。
5. HTML快照
谷歌在2009年推出了HTML快照，并于2015年批准了它们。这是一个长篇故事和一个持续的主题。
您应该知道的是，Google仍然支持HTML快照，尽管它已经确定它们是“避免”的元素。
在几种情况下，HTML快照可能是必需的，因此您至少应该熟悉它们。
例如，如果搜索引擎无法掌握您网站上的JavaScript，则可以为他们提供HTML快照，这比根本没有索引和理解您的内容更好。
在完美的世界中，网站将在服务器端使用某种用户代理检测，并向机器人和用户显示HTML快照。
请注意，Google力求看到与观看者完全相同的体验。因此，最好将HTML快照返回给搜索引擎抓取工具。
但是，只有在JavaScript出现问题的情况下才会这样做，并且无法联系您的支持团队。
6.网站延迟
当浏览器使用收到的HTML文档创建DOM时，它会完全按照HTML文档中提到的方式加载大部分资源。
如果HTML文档顶部存在一个海量文件，浏览器将首先加载这个巨大的文件，所有其他信息只会在之后出现，并且会有很长的延迟。
Google关键渲染路径的关键思想是首先加载对用户至关重要的信息。换句话说，为用户提供最重要的内容。
如果您的JavaScript文件或一些不必要的资源阻碍了页面加载速度，您可能会使用渲染阻止JavaScript，也称为感知延迟。
这意味着您的网页可能会更快出现，但JavaScript代码正在减慢它们的速度。
检查使用Page Speed Insights或其他类似工具加载页面所需的时间。分析结果以查看是否存在渲染阻止JavaScript。
以下是一些解决它的顶级解决方案：
在HTML中添加JavaScript。
将“async”属性添加到HTML以使JavaScript异步。
减少HTML文档中的JavaScript元素。
在尝试改善这种情况时，请记住JavaScript的基本规则。
例如，脚本必须按特定顺序排列（优先顺序）。如果某些脚本引用文件，则只能在加载引用的文件后使用它们。
您应该经常与开发团队保持联系，以确保任何更改都不会中断用户体验。
结论
搜索引擎不断发展，因此毫无疑问，谷歌优化他们将来会更好，更快地解读您的JavaScript。
目前，网站搜索引擎优化请确保您的现有内容可以抓取并可获取，并确保适当的网站延迟。希望本文将帮助您优化您的网站
