JS SEO：如何优化 JavaScript 在搜索结果中的高排名

JavaScript 是由 Sun Microsystems 开发的一种脚本语言。 JavaScript 现在是 Web 浏览器中用于创建交互式网页的标准编程语言。 JavaScript 最常用于向网站添加交互性。它通常嵌入在 HTML 文档中以提供动态行为，例如根据用户操作更改网站页面上显示的内容（例如，文本）。

JavaScript 的第一个版本于 1995 年发布，名为 LiveScript。 1997 年，Netscape 推出了自己的 JavaScript 实现，称为 JavaScript 1.0。从那时起，JavaScript 已被广泛采用，现在已成为客户端脚本的事实标准。

SEO 是任何网站的重要组成部分，最好优化您的 JavaScript 以在搜索结果中排名靠前。您可以通过缩小 JavaScript、延迟其加载、减少 HTTP 请求的数量、从页面（以及从单个文件）中删除不必要的脚本标签以及将文件合并到一个文件中（如果文件足够小）来做到这一点，和更多。

缩小 JS 和 CSS。

缩小 JS 和 CSS 是摆脱这些额外字节的好方法。这可以使用缩小器来完成，它会从源代码中删除不必要的字符而不影响其功能。

缩小过程通过删除空格和注释以及在可能的情况下缩短变量名称来工作。例如：

 var $div = document.getElementById("myDiv");

 var v_d__e___ = document .getElementById( "m_i_d" );

重要的是要注意该过程不会改变代码的功能；事实上，如果有必要，你仍然可以通过解释器运行这个版本（尽管我们不推荐它）。

延迟加载 JavaScript

在 HTML 代码中，您可以使用标签的 defer 属性来告诉浏览器异步加载您的脚本。这对于那些对页面的初始呈现不重要的脚本很有用，而是通过附加功能和特性来增强它。

延迟这些脚本允许它们在正常下载优先级之外加载，因此它们不会阻止内容立即显示。但是，如果您尝试将此方法用于立即需要其所有功能的主要脚本（例如您网站的主导航菜单），它将无法正常工作，因为它们需要快速加载时间。

实现 defer 的缺点是并非所有浏览器都支持它。它仅适用于 Firefox 3+（及更高版本）、Internet Explorer 10+（及更高版本）、Safari 5+ 和 Chrome 14+。

减少 HTTP 请求的数量

减少 HTTP 请求数量的一种方法是将所有 CSS 和 JavaScript 文件合并到一个文件中。如果您的代码多于几行，这对减少页面重量有很大帮助。但是，如果您有许多小文件，则将它们组合成一个大文件可能不适合您，因为用户的浏览器需要额外的时间才能一次下载所有文件。

删除不必要的 JavaScript、CSS 和 HTML

幸运的是，您无需成为编码大师即可优化您的 JavaScript 以进行搜索。你只需要遵循一些简单的规则：

1. 删除未使用的 CSS。
2. 删除未使用的 HTML。
3. 删除未使用的 JavaScript。
4. 从代码中删除不必要的注释和空格（例如，“//”或“/* */”）。
5. 删除 JavaScript 文件中不必要的换行符、分号、括号、大括号和逗号，这样当项目在 Jenkins CI 服务器或 TravisCI 等构建服务器上被 Google Closure Compiler 或 UglifyJS 2 等工具缩小时，它们不会破坏项目中的任何其他内容服务器/等...

合并文件。

将 JavaScript 文件合并到一个文件中是个好主意。这可以通过像 Grunt 或 Gulp 这样的构建系统来完成，它允许您使用连接和缩小等功能。如果您不想了解构建系统，有许多服务会自动为您完成这项工作。

最简单的方法之一是使用 Cloudflare（提供免费计划）。只需通过其界面上传所有文件，然后使用其设置选项卡下的“缩小”选项。

他们会为您的服务器上的每个文件提供一个自定义 URL，然后将所有这些文件最小化，然后再将它们发送回您的访问者的浏览器。这对他们来说速度更快，因为他们只有一个来自 Cloudflare 的请求，而不是来自网络上不同域的多个请求。

另一个选项是 JSPACK（付费），它是类似的，但提供了更多的功能和对压缩/删除多少代码的确切控制，以便获得比其他压缩工具默认情况下提供的更好的优化性能结果，因为特定目标需要特定情况某些应用程序可能需要访问包含在特定目录结构中的 JavaScript 文件中包含的某些部分数据，该目录结构完全位于 Internet 上的其他地方...

此外，可以创建自定义徽标和自定义图形并将其放置在您的 HTML5 网站/应用程序中，以赋予其额外的魅力，确保人们记住您。

标题和说明！

用 JavaScript 编写的页面需要有许多与用 HTML 和 CSS 编写的页面相同的 SEO 元标记。标题和描述都是元标签有效 SEO 策略的重要组成部分。

Web 浏览器将显示标题 SEO 元元素，搜索引擎通常会利用此信息为已编入索引的页面构建标题。即使没有在网络浏览器中显示，搜索引擎也可以使用描述 SEO 元元素来为已编入索引的页面生成文本片段或描述。

使用 JavaScript 定义标题和描述 SEO 元标记没有问题，因为它是一种完全有效的方法。

根据谷歌的说法，甚至可以使用 JavaScript 来修改这两个 SEO 元标记。底线是标题和描述元搜索引擎优化元应该包含在每个页面上，包括那些主要用 JavaScript 编写的页面。

摆脱逗号优先的编码风格等。

首先，让我们解决这个问题：请停止使用逗号优先的编码风格。它们是过去可以在 JavaScript 中使用逗号来排列变量声明和参数列表的遗留物。这不再有效，而且从一开始就不应该是合法的！

那么你怎么知道你的代码是否使用了这种风格呢？很容易判断：只需在同一行中查找多个语句，用逗号（或空格）分隔。请参见下面的示例：

 var x = 1; var y = 2; var z = 3;

如果你的 JavaScript 看起来像这样——或者更糟糕的是，如果它在每个语句之间有空行——它需要认真的工作！幸运的是，一旦您知道它们是什么以及在哪里寻找它们，解决这些问题并不难。

从正文（或页脚）底部加载 JavaScript。

请记住，JavaScript 应该从正文（或页脚）底部加载，CSS 从顶部加载。

这是因为搜索引擎会通过从顶部开始并向下运行来抓取您的网页，因此在访问 JavaScript 或 CSS 文件等内容后，它们往往会忽略所看到的任何内容。

如果您使用异步加载技术（如 Ajax 或延迟脚本），则不必担心这一点，因为这些方法并行加载文件但仍允许索引。

将 CSS 放在顶部，将 JavaScript 放在底部。

为搜索引擎优化页面的最简单方法之一是将 CSS 放在顶部，将 JavaScript 放在底部。这是因为浏览器会在 JavaScript 之前加载 CSS。为此，您可以在索引文件中添加一个指向样式表的标签，然后添加另一个引用您的 JavaScript 文件的标签。

这很重要的原因是，如果有人在他们的浏览器上禁用了 JS，那么除非正确编码，否则他们将根本无法使用该网站——这意味着将 CSS 放在首位！

使用 gzip 压缩组件。

Gzip 是一种压缩算法，可以减小文件的大小。它可以在 JavaScript 和 CSS 中使用，因此您可以将它用于您正在使用的所有组件。

在将代码上传到 CDN 或托管服务提供商之前，您需要对其进行压缩。 Gzip 减少意味着当用户访问您的页面时，您不必下载比所需更多的字节。

Gzip 支持在所有现代浏览器中都可用，因此值得在两端添加 gzip：浏览器端和服务器端 (NodeJS)。

要压缩您的内容，您需要使用基于 gzip 的压缩。您可以使用此工具检查文件是否已正确压缩。

避免使用 CSS 表达式。

CSS表达式是 CSS3 中引入的一项功能，允许您在样式表中使用 JavaScript。您可以使用它们来动态更改属性的值，甚至可以迭代值数组。

但这就是为什么你不应该使用 CSS 表达式的原因：它们很难优化并且让浏览器更难缓存你的样式表（这很糟糕）。此外，它们可能会在不支持它们的旧浏览器上导致意外行为。所以不惜一切代价避免使用它们！

最后的话

以优化搜索的方式使用 JavaScript 是在搜索结果中获得高排名的好方法。然而，重要的是要记住，并非所有用户都启用了 JavaScript 或在浏览您的网站时可用的带宽量相同。

如果在为 SEO 目的优化 JavaScript 内容时，这些限制可能会影响您的网站在搜索排名中的表现，就像您网站上的任何其他类型的内容会被 Google 的算法处理一样。