如何轻松加速您的网站！ –缓慢的网站会阻止转化！！！

速度是杀手。

在所有的设计，**，测试和策略讨论中，很容易忘记存在一个可能影响或破坏网站性能的小问题。 我说的是加载速度。

加载速度比您想象的要重要得多。

这是排名因素：

在搜索结果位置方面，加载速度的影响如下所示：

（来源： https : //ahrefs.com/blog/on-page-seo/ ）

较慢的位置=较低的位置。 理想的加载速度尽可能接近零：前10个SERP加载的时间不到一秒钟。

这对游客也很重要。

Episerve在2015年的报告中说： “在全球范围内，缓慢的加载时间被认为是现代移动用户的最大挫败感。” 现在，移动用户已成为网络流量的主要来源。

对转换的影响甚至比我们对SERP所观察到的更为严重，而且更为明显：

（来源： https ： //www.soasta.com/blog/mobile-web-performance-monitoring-conversion-rate/ ）

转化率在2.4秒达到峰值; 加两秒钟，它减半。 加一秒钟，它下降了27％。

为什么这仍然是一个问题？ 随着更快的宽带比以往任何时候都更加广泛地分布，并且智能手机变得越来越快，功能越来越强大，为什么网页没有跟上？

主要是因为我们正在使用额外的带宽来为站点添加pack头，跟踪Cookie和大图片。

（来源： https : //www.cachefly.com/category/faster-websites/ ）

罪魁祸首是图片，自2011年以来，图片增长了3倍，但脚本也取得了巨大飞跃。 如果您拥有纯HTML网站，那么现在的规模将与2011年相同，当时美国的平均互联网速度要慢3倍。

但是，页面加载速度不仅很差。

情况越来越糟糕。

根据2014年的数据，电子商务中的Web性能每年平均降低23％：然后，电子商务网站需要6.5秒的时间来呈现其主要内容，几乎是完全加载的两倍。

现在，平均排名最高的网站大约需要9秒钟才能加载。

（来源： http : //www.seochat.com/c/a/google-optimization-help/average-page-load-time-of-top-ranking-websites-in-google/ ）

（这些是整个网站，而不是单个页面。）

这会影响谁？

大家。 在所有行业中，跳动都很高，因此未能执行我们希望用户执行的操作（也就是缺乏转换）的情况也是如此。

（来源： https : //conversionxl.com/guides/bounce-rate/seo-impact/ ）

电子商务网站尤其遭受高度反弹和放弃购物车。

（来源： https ： //www.barilliance.com/measure-cart-abandonment/ ）

购物车放弃率从2012年的最高点近72％下降-但仅降至69.23％，跌幅很小。 绝大多数电子商务网站的访问者都放弃了。

它与加载时间直接相关。

（来源： https : //bluestout.com/blog/how-to-reduce-mobile-ecommerce-bounce-rate/ ）

那弹跳呢？

电子商务跳出率也与加载速度相关。 该电子商务网站的用户跳出率平均为44％。 根据负载速度经验对它们进行拆分，有明显的区别：

（来源： https : //www.linkedin.com/pulse/how-load-time-affects-bounce-rate-across-devices-report-jack-maden ）

请记住，这里将快速装载机定义为“ 4秒内”！ 在快速和慢速负载组之间，台式机的跳动增加了24％。

内容网站的跳动很高，这与加载速度有关。

服务的潜在客户生成站点也是如此。

最终，各个行业的反弹和加载速度之间的关系看起来或多或少是这样的：

（来源： http : //www.ironpaper.com/webintel/articles/web-design-statistics-2017/ ）

您是否受缓慢的加载速度影响？

您怎么知道您的网站是否受加载速度慢的影响？ 首先检查您的基本加载速度。 您可以使用Google的PageSpeed Insights工具来了解您网站的效果。

（来源： https : //developers.google.com/speed/pagespeed/insights/ ）

通过Google的工具运行您的URL，您将获得有关网站加载速度的数据，以及有关可以改进哪些元素以加速网站的建议。

请注意，台式机和移动设备的结果可能会大不相同：

但是，尽管Google的工具并不是涵盖基础知识的一站式商店，但它却没有向您展示很多东西。

因此，这里有五种出色的工具，可深入探究您网站的实际情况。

GTmetrix

为您提供按优先级排序的站点问题列表。

您可以移动服务器来查看您的网站在世界范围内的状况，并获得概述和可行列表（从A到F分级）。

想知道首先要解决什么？ 从这里开始。

2.语气

Pingdom也会给您评分。 它还提供了瀑布分析，因此您可以准确了解正在发生的事情。

但是，它不是免费的，与清单上的大多数工具不同。

3：点播显示器

提供瀑布分析和一系列不同的服务器，让您了解两者的交互方式。

Dotcom-monitor不会同时移动服务器，而是同时使用各种服务器。

4：负载影响

Load Impact提供浏览方案并分析您的内容。

它是免费的，但是您必须创建一个帐户，并且与该列表中的其他工具相比，它要复杂得多。

5：网页测试

我保存了最好的直到最后一次。 Webpagetest是我最常使用的。

该接口在1996年有点糟糕，但是功能快速，易于访问并且提供了适当的细节。

瀑布，内容分解和其他一些工具使您可以从“我的网站太慢”中走出来，并直观地看到哪些元素正在浪费加载时间。

惊喜，惊喜：它是图像和JavaScript。

因此，我们已经看到了许多不同的负载速度指标。 问题是，哪些真正重要？

重要的负载速度指标是对客户真正重要的指标：

• 页面可见的时间
• 是时候找到自己想要的东西了
• 是时候去做自己想做的事了

这是电子商务网站对负载速度如此敏感的原因之一。 一堆图像和按钮加载缓慢且带有小故障和跳跃，比加载时间过长的单个，建议不当的超级图像更加令人沮丧。 人们来到电子商务站点来做出自己想要的决定–上面的所有三个清单同时发生。

我们如何修复加载缓慢的网站？

如何加快慢速网站

1：最小化HTTP请求

每次在您的网站上加载文件时，浏览器都会向您的服务器发送HTTP请求。 当两台计算机通话时，速度变慢。 雅虎表示，这可能占到加载时间的80％。

要在Websitespeedtest中查看请求报告，请转到“测试结果”>“详细信息”并向下滚动; 这是第三份报告。

（这是一个非常简化的解释：如果您想了解更多内容，请查看Yoast的Jimmy Comack的这篇文章。）

存储在网页其他位置的页外资源越多，必须发送的HTTP请求越多，并且加载的速度就越慢。

更糟的是，因为最初将HTTP配置为仅在旧请求完成后才开始新请求。 为了加快处理速度，现在可以发出异步请求（所有请求都在彼此之上进行。）速度更快-但存在以混乱，混乱的方式加载页面的风险。 记住，我们并没有追求抽象的加载速度指标。 我们希望访问者能够定位自己并迅速采取行动，而不会反弹。

我们如何减少HTTP请求的数量？ 我们减少了正在加载的资源数量。

从图像开始。 删除所有不直接在页面上有用的图像。 拥有大量图像是一件好事，但是如果只是为了保留图像，请考虑删除它们。

接下来是视频。 一些带有大量视频的网站可能会增加一到两秒钟的网站加载时间：这就是大多数人愿意花的总时间，花费在一项资产上。 是不是真的值得吗？

Javascript是仅次于图像的第二大请求元凶。 JavaScript应该是异步的，这意味着它应该在其他所有操作同时加载。 否则，当您的浏览器使用Javascript时，它将停止加载网站上的所有其他内容，直到加载了JS。 使它异步或完全摆脱它。 如果您不能执行任何操作，请将其放在页面底部，以便最后加载。

最后是CSS。 每个CSS文件都是其自己的单独请求。 但是单个CSS文件通常可以满足您的所有CSS需求，因此将它们组合为一个文件以减少请求数量。

2：启用压缩

大页面需要很长时间才能加载。 但是可以使用开源Gzip工具压缩它们。

大多数Web服务器可以在发送文件之前使用Gzip将文件压缩为.zip文件。 您可能正在下载相同数量的文件（如果您还没有减少请求数量），但是信息量不一样，因此页面加载速度会更快。

雅虎表示，Gzip可以减少70％的加载时间。

要启用Gzip，请将以下代码放入您的.htaccess文件中：

#压缩文本，html，javascript，css，xml： AddOutputFilterByType定义文本/纯文本AddOutputFilterByType DEFLATE text / html AddOutputFilterByType DEFLATE text / xml AddOutputFilterByType定义文字/ css AddOutputFilterByType DEFLATE应用程序/ xml AddOutputFilterByType DEFLATE application / xhtml + xml AddOutputFilterByType DEFLATE application / rss + xml AddOutputFilterByType DEFLATE应用程序/ javascript AddOutputFilterByType DEFLATE应用程序/ x-javascript #或者，通过扩展名压缩某些文件类型： SetOutputFilter DEFLATE

3：启用浏览器缓存

浏览器缓存使访问者可以在其浏览器上存储网站的版本。 然后，当他们返回您的站点时，只需要打开构成您站点的大多数文件，而无需下载它们。

听起来不错吧？

在您的回访者与新访客之间查看Google Analytics（分析）概述报告。

新的访问者将具有空的缓存。 您无法通过浏览器缓存来提高他们的网站体验。 但是回访者是另一个故事：您可以为这些访客节省大部分网站加载时间。

如果您的回访者比例很高，或者您希望为网站拨入缓存，那么这里是一个很好的资源。

4：减少资源

许多不依赖于传统开发人员技能（或根本不依赖任何技能）的“网站建设者”都可以打造美观的网站。 但是窥探一下，代码看起来并不那么好。 肿胀且草率，这可能会使您的网站运行缓慢。

怎么办

您可以自己整理代码。 删除代码中不必要的换行符，缩进和空格可以加快速度。

但是最小化它甚至更有效。

看起来像这样：

（来源： https : //www.wpmyweb.com/how-to/minify-html-css-javascript-autoptimize.html ）

在此示例中，HTML的一个简单部分已自动缩小到将要使用的最小和最精简的格式，并且仍然可以使用。 在此过程中，已刮掉了11％的代码。

为了有效地缩小规模，请确定优先级：从引起最多问题的代码开始。 转到Google的PageSpeed Insights并在您网站的URL上进行测试。 在“可能的优化”下，您会看到用于最小化CSS，HTML和Javascript的选项。

仅减少这些CSS元素就可以节省大量数据。

您可以使用Minifycode.com之类的工具来缩小代码，然后将HTML，CSS或Java中有问题的代码替换为缩小的版本。

如果您运行的是WordPress，则有一个自动优化插件可缩小您的所有代码，尽管需要进行一些设置。

5：优化图像

图片是大多数网站中占用带宽最多的元素。 典型的错误是使图像处于带宽消耗格式或巨大尺寸。 查看这些图像加载所需的时间：

紫色线是图像。 最大的耗时为2.09秒。 大问题。

优化图像时，您需要集中注意的三件事是大小，格式和src属性。

图片尺寸

大图像会占用带宽。 如果您的页面宽度为500px，为什么图像宽度为2500px？

额外的大小是不必要的站点加载时间负担。

当然，该图像将在渲染时在站点上调整大小，但是每次也会加载整个海量文件。 不要调整图片大小：使用图片编辑工具裁剪图片以适合您网站的最大尺寸。

（如果没有Photoshop，请尝试使用Pixlr –基于浏览器的免费软件。）

图像格式

最佳图像格式为.jpg，第二为.png。 （并非所有浏览器都会渲染.png图像。）BMP，TIFF和Gif都会疯狂地占用带宽。

src属性

src属性告诉浏览器在哪里寻找图像。 在HTML中，它看起来像这样：

不要像这样：

<img src =””>

这意味着没有定义图像的来源。 发生这种情况时，浏览器将通过向页面本身发送请求来开始寻找它，从而增加了加载页面的数据负担–另外，您的图片也不会加载。

6：优化CSS交付

CSS告诉浏览器页面的每个元素应该是什么样的。 您可以通过两种方式来做到这一点：外部或内联。

外部CSS位于页面标题中，如下所示：

<link href =” https://static.hsstatic.net/content_shared_assets/static-1.4043/css/public_common.css” rel =“ stylesheet”>

呈现页面所需的所有信息（在本例中为Huspot页面）在CSS样式表中。

这比使用内联CSS更好，在CSS中将CSS放在HTML之间。 使用样式表可以减少代码的大小，而仅使用一个样式表可以减少请求的数量，从而减少加载时间。

要了解您的页面正在使用多少外部CSS工作表，请使用Varvy的CSS传递工具或GiftofSpeed之类的工具。

GiftofSpeed可帮助您优化CSS交付，但是如果您愿意自己做，Varvy会提供说明。

最后的想法：

AMP呢？

AMP应该使一切变得超快。 确实如此。 但是它通过迫使您使用CSS，HTML和Java的精简版本而没有太多选择余地而起作用。 它迫使您依赖Google的内容交付网络，该网络虽然速度很快，但是会将您所有的URL更改为Google的URL。 而且，您必须变得精巧，才能在AMP页面上获得诸如表格之类的简单内容。

如果您定期发布新闻，这可能是一个不错的选择，有些人建议将其用于目标网页。 但是，作为加快核心网站速度的一种方法，这是工作的错误工具。

结论

缓慢的网站加载速度可能会破坏您的SEO和您的转化。 解决方案在于精简和整理网站的基本代码，而且很多修复程序都没有那么复杂。 如果可以用更高的跳动，更少的销售额和潜在客户甚至影响SERP来衡量几分之一秒，那么现在就解决它们是有意义的。

如果我遗漏了您最喜欢的加载速度修复程序，或者您想添加一些内容，请联系我们！