2020年网站速度优化全面指南
时间：2024-04-21 19:30:02 | 来源：建站知识
时间：2024-04-21 19:30:02 来源：建站知识
网站速度对于网站而言非常重要，以至于搜索引擎使其成为实际的排名因素。如果您想改善网站速度，第一步就需要对网站进行检测，了解影响您网站速度的因素。其实很多工具都可以为开发人员和网站管理员提供网站速度检测。这里我们推荐的检测工具是百度统计的网站速度诊断。至于“网站速度如何优化？”您将在本文中找到所有需要了解的内容。
什么是网站速度诊断？
网站速度诊断是百度统计提供的在线工具，用于识别网站上的网络性能问题。尽管这些工具主要与SEO技术有关，但这些工具还可以从用户体验和可访问性的角度分析网站。您可以通过优化分析来访问网站速度诊断。
您可以输入要诊断的页面地址，几秒钟后，该工具将返回一个页面，其中包含有关网站性能的一些结果。在顶部，将有一个综合评分，该评分是多个因素的平均值。您将在下面看到有关实际影响速度的详细信息。
网站页面速度到底是什么？
好的，我们知道该工具的功能：它会根据您认为您的网站的运行速度给出得分。但是页面速度到底是什么？页面速度是单个页面在您的网站上加载的速度。由于图像和脚本等因素，不同的页面可能具有不同的速度。
但是速度是相对的。它取决于许多因素，例如网站的性能，服务器的性能，您所使用的特定网页，连接类型，用户的Internet服务提供商，Internet软件包，设备的处理能力，浏览器，用户的身份。当时正在执行的操作，正在运行的应用程序数等等。
但是，我们只能使用我们可以工作的网站和服务器。我们实际上没有控制其余部分的权利。只是为了弄清楚，页面速度并不是一个分数，就像百度统计的那样。这是网页的加载时间，以秒为单位。那才是最重要的。
当然，加载时间有不同的因素。例如，您可能要在最后运行一些脚本，因为它们最初不需要使用。他们可能需要花费很多时间才能完成加载，因此总加载时间可能会更长。但是，如果该站点在此之前仍可用，则不是什么大问题。
例如，假设您要运行退出意图弹出脚本。假设该脚本需要5到10秒的加载时间。但是，您只想在20到30秒后向用户显示它。如果立即开始运行脚本，则可能会推迟加载其他重要元素，例如用户应该看到的第一件事：折叠内容上方。这将是非常糟糕的，尤其是因为您将在未来约20-30秒内不使用该脚本。
因此，您可以将脚本加载推迟到其他至关重要的加载之后，以便为用户提供更好的体验。但是，如果您具有使菜单正常工作或对网站的可用性至关重要的脚本，则可能不希望将其加载到最后。这将破坏体验，因为用户将无法在加载其他所有功能之前访问该功能。
网站速度会影响SEO优化吗？速度检测得分需要是100分吗？
简单的答案是页面速度确实会影响SEO。页面速度是直接的排名因素，它也会通过提高跳出率和减少停留时间而间接影响排名。
如今的搜索引擎的宗旨是“用户至上”。研究表明：平均3G加载速度非常慢，还显示用户在大约3秒钟后离开站点。这意味着他们的体验很差，搜索引擎不喜欢对提供不良用户体验的网站进行排名。
您必须记住的是，速度是以秒为单位测量的，而不是以0到100的点为单位的。网站速度诊断是可以帮助您提高速度的工具，但实际得分不一定意味着任何东西。
即使这样，提高页面速度得分也很重要。为什么？因为对于搜索引擎，我们不确定是否将得分作为排名因素。但是，我发现页面速度得分完美的网站排名不佳，得分低于50的网站排名很好。
但是，您必须考虑百度如何进行这些测试。我们不知道从哪里进行测试。您的服务器是否在不同地区使用4G连接对其进行测试？
但是，仅出于用户考虑，将加载时间放在首位。而且，不要仅使用百度统计进行测试。坚持到底，我将向您展示几个工具，您可以使用这些工具来测试网站从不同位置加载的速度。
有时，百度会自相矛盾！例如，网站速度诊断工具考虑使用百度统计脚本渲染阻止，这意味着您稍后应将其加载到页脚中。但是，百度统计非常明确地指定了该脚本必须放置在您网站的<head>部分中，否则它将无法正常运行。 当然，这不仅会发生在百度工具和脚本上，还会发生在您无法控制的任何第三方脚本中。
请注意，只有不到1秒的时间才能算是很快！为此，您可能需要一个非常简单的网站，没有第三方插件或精美的弹出窗口。如果您的网站确实想进行网络营销，这就不容易了。
因此，加载速度对于SEO很重要，但完美的网站速度诊断得分并不重要。只要您的网站在3秒钟内加载完毕，大多数用户就可以正常使用。
优化网站速度的关键点
网站速度诊断那里的所有东西可能有些难以消化。最有可能的是，您将无法解决所有问题！我们已经排除了获得100％的分数并不重要。但是，这些关键要素将显着提高网站加载速度。
警告：在进行这些改进之前，请同时备份文件和数据库。他们可能会弄乱您的网站，您必须确保可以返回以前的版本！
服务器响应时间
服务器是您无法真正改善自己的东西。你要么是好人，要么是坏人。要对其进行改进，您将不得不大幅度减少其负载，或者改善其硬件，除非您拥有物理计算机，否则这两个都无法控制。
因此，首先要拥有一台好的服务器很重要。但是，如何选择一个好的服务器？
好吧，任何在百度上排名靠前的服务器托管公司都可以提供优质的服务。但是，这取决于您的测试。最好的建议？如果您主要关注本地SEO，请选择本地服务器。例如，如果您的大多数观众都住在北京，请选择一个位于北京的数据中心服务器。
如果数据中心遍布国内，则信息必须传播很长一段距离才能到达目标受众。
您始终可以使用网站速度诊断工具测试托管服务提供商自己的网站，并查看服务器响应时间。如果它可以获得分数，则说明您自己拥有良好的托管服务提供商。
但是，最好是您知道某个人是托管服务提供商的实际客户，以便您可以在那里测试速度。
实际上，主机商自己的网站可能位于专用服务器上，而您的网站将位于虚拟空间或者云主机中。这意味着您将与其他人共享计算机的CPU和带宽。
图像压缩
通常，图像是网站的最大问题。它们很大，需要大量下载。
图像有两种类型的问题。第一个是屏幕大小与实际图像大小（以像素为单位）的比较，第二个是磁盘大小。
磁盘大小：映像在硬盘或SSD上占用的物理空间越多，下载所需的空间就越大。100 KB的下载速度比1000 KB（1MB）快得多。如果您的博客文章中有10张这样的图片，那么您的网站加载速度会很慢。您可以使用WP Smush优化图像。这是一个可以压缩图像而不会损失任何质量的插件。这意味着您可以将1000×1000像素的图像从200 KB缩小到150 KB，而不会注意到质量差异，因此使其加载速度提高了25％。
屏幕尺寸：屏幕尺寸是显示图像的尺寸。为了使图像加载更快，首先必须确保所使用的图像不大于要显示的图像。例如，如果您有一个HTML区域，该区域使用CSS样式设置为300×300像素，但是在源中加载了1000×1000像素的图像，那么您将损失700×700像素的加载时间。
那是因为浏览器必须下载1000×1000像素的图像，然后将其缩小到300×300像素。下载和缩小过程都需要更多时间。您可以通过上传宽度和高度与显示时相同的图像来解决此问题。
WordPress在上传图片时会通过创建图片的多个实例来自动执行此操作。这就是为什么您会在图像文件路径的末尾看到300×300或150×150后缀的原因。这就是为什么您可以选择大小（大，中，缩略图）的原因。尽管它并不完美，特别是如果您通过单击和拖动来手动调整图像大小，并且从长远来看会占用服务器上的更多空间，则它确实有助于提高加载速度。
延后图像是您可以做的另一件事，以缩短加载时间。这意味着您可以稍后在用户向下滚动网页时下载它们。短暂的一会儿，图像将不可见，但最终会一次又一次地出现。这有助于浏览器将重点放在重要部分上，即用户此时正在查看的部分。
有许多插件可以帮助您做到这一点。但是，在某些情况下，例如在由WordPress或WooCommerce创建但在由较不受欢迎的插件创建或插入时，许多错误或仅延迟图像。
当然，还有其他CMS的插件，例如Joomla或Magento。只需对它们执行百度搜索即可。如果您不在WordPress之类的流行CMS上，则可以使用jQuery来推迟图像，但是，如果您自己不是一个人，那么肯定会需要一名开发人员。
近些年，谷歌推荐使用下一代图像格式。它们非常有用，尤其是从移动设备加载网站时。但是，有一个原因是没有多少人使用它们。并非所有主流浏览器都支持下一代图像格式。这意味着您需要为不同的浏览器动态提供不同的格式。
如果您可以在CMS上使用一个容易的插件，但是如果您使用的是自定义平台，则需要从头开始开发一切，这会花费很多。
如果您适当地调整大小和优化图像，将它们转换为JPEG2000或WebP等下一代图像格式所节省的成本可能不值得花时间和金钱。
但是，如果您有时间和预算，一定要去做。您可以使用此工具来检查是否支持用户花费最多时间的浏览器。搜索WebP或JPEG2000。
HTML和CSS结构
网页的HTML结构决定了其加载方式。浏览器从上到下阅读页面，并且以相同的方式加载元素。这意味着，如果要先加载某些内容，则必须将其放在页面的较高位置。
通常，问题不在于HTML，而在于CSS。如果您混乱地编写CSS，将导致加载时间变慢和用户体验差。
让我们举个例子。大多数网站（如果不是全部）都遵循以下HTML结构：head> body> footer。
如果我的CSS文件首先对页脚进行样式设置，则即使在折叠之前，页脚也会收到样式设置。同时，标头和正文可能保持不变。
最好先添加移动样式，因为移动设备是最慢的样式。
渲染块JavaScript也是如此。推迟不重要的脚本。将它们添加到页脚中，以便最后加载它们。
但是，如果您有重要的脚本（例如百度统计的脚本）应尽快运行，则应将它们保留在标题中，并确保它们能够正常运行，即使这可能会导致速度诊断得分较低。
继续阅读：提升网站速度：删除未使用的CSS和无效规则
缩小和压缩脚本
缩小是通过从文件中删除不必要的信息来缩小文件规模的过程。
例如，在编写JavaScript和CSS时，大多数（如果不是全部）编码人员都喜欢使用空格以保持其代码整洁和易于阅读。但是，这些额外的空间加起来，尤其是在您有很长的代码的情况下。
减少代码的另一种方法是组合相似的元素。
例如，如果您的页眉和页脚部分相同，则不要这样写：
body {
font-size: 16px;
}
footer {
font-size: 16px;
}
您可以写：
body, footer {
font-size: 16px;
}
压缩是通过将重复出现的信息序列替换为对该特定序列的单个引用来收缩文件的过程。
因此，例如，如果我们有以下代码：123 4 123 123 123 4 123 123，我们可以将123替换为1并得到像这样的压缩版本：1 4 1 1 1 4 1 1。当然，它是比我们介绍的要复杂得多。
这通常发生在服务器端，最常见的一种称为Gzip压缩。服务器发送压缩版本。浏览器收到压缩文件后，通过反转过程对其进行解压缩，以读取其实际内容。这和WinRAR非常相似。我们可能所有人都知道，因为我们一直免费使用它！
如果您使用的是流行的CMS，则肯定会找到用于压缩的插件。例如，如果设置正确，W3 Total Cache插件会做很多事情，包括这两项。
请记住，压缩取决于服务器设置。如果您的服务器不支持Gzip，则将无法压缩文件。如果您有Apache服务器，请确保已安装mod_deflate。
您可以询问服务器提供商，如果您的主机支持它。如果尚未安装，则应该可以免费安装，因为这是非常基本的操作。
如果您不在常用的CMS上，只要安装了mod_deflate，还可以通过添加以下代码来通过.htaccess文件（Apache服务器）启用Gzip压缩 。
有时，您也可以结合使用脚本。有一些插件可以做到这一点，例如Autoptimize。结合脚本就是它所说的。您无需将两个文件组合在一起。这样，仅对服务器发出一个请求，而不是多个请求。但是，组合脚本可能多次导致错误，因此请确保您之前备份了所有内容。
快取政策
缓存是将文件存储在客户端浏览器中的过程，以便以后可以快速访问它们。
例如，如果用户是第一次访问您的网站，则必须下载您的徽标。但是，如果您具有有效的缓存策略，则该文件将存储在用户的浏览器中。当用户第二次访问您的站点时，它无需再次下载该文件，因为它将立即从他们的计算机中加载。
动态元素（短缓存策略）： 动态元素是网站上经常更改的元素。例如，您可能会继续在首页的滑块中添加新帖子。
在这种情况下，HTML是动态元素，因此请根据需要设置一个简短的缓存策略。如果用户在同一会话中返回该页面，则30分钟可能就足够了。
在某些情况下，如果及时性对于您的用户来说很重要，例如在新闻网站上，您可能根本不想缓存这些元素。
静态资源（长缓存策略）： 静态资源是很少更改的文件。这些通常是图像和CSS或JS文件，但它们也可以是音频文件，视频文件等。
您可以为图像和CSS文件设置更长的缓存时间，因为您知道自己不会经常更改它们。您甚至可以长达一年，但通常只需3个月即可。
第三方工具： 您实际上对第三方工具没有控制权，因此，如果您觉得托管在其他地方的工具会使您的网站运行速度非常慢，则最好选择一个替代方法或放弃它。
一种解决方案是将文件托管在您自己的服务器上并对其进行缓存。但是，这可能效率不高，因此不建议这样做，因为一旦有新版本出现，您就必须不断更新这些文件，否则该工具或应用程序将无法正常工作。
缓存插件： 有许多插件可以正确处理良好的用户体验所需的缓存协议。如果您使用的是WordPress，则其中一个插件是W3 Total Cache。但是，如果您想寻求更好的选择，WP Rocket也很受欢迎，但它需要花钱。
只需在百度上搜索缓存插件/扩展程序/模块+您的CMS即可找到所需的内容，查看评论以挑选最佳的。
.htaccess文件缓存： 如果您不在流行的CMS上运行网站，则还可以从Apache服务器上的.htaccess文件设置缓存控制标头。
有多种方法：
## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 hour"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 1 month"
</IfModule>
## EXPIRES CACHING ##
或者，您也可以使用以下代码：
# One year for image files
<filesMatch ".(jpg|jpeg|png|gif|ico)$">
Header set Cache-Control "max-age=31536000, public"
</filesMatch>
# One month for css and js
<filesMatch ".(css|js)$">
Header set Cache-Control "max-age=2628000, public"
</filesMatch>
max-age属性中的数字以秒为单位，因此3600表示一小时，86400表示一天，依此类推。
重置缓存：修改网页时，如果以前已缓存了较早的版本，则想重置缓存。但是，您只能重置服务器上的缓存。
这意味着下载了某个文件的先前版本的用户在再次访问该网站时仍会从其计算机上加载该旧版本。在您的缓存策略中设置了一定时间后，或者如果用户手动重置了浏览器缓存，则将刷新文件。
如果您的网页设计或代码中有严重错误，则可以更改文件名。这样，您可以确保该特定文件的缓存将被重置。
有时，浏览器的缓存可能很难重置。有时，客户端和服务器之间的路由器和数据中心也可能会缓存文件，因此，如果看不到修改，请等待几个小时。
其他用于衡量和提高站点速度的SEO工具
当然，百度统计的网站速度诊断工具不是检查和提高页面速度的唯一工具。一次，我们真的不知道从哪里进行测试。如果您的网站托管在美国的服务器上，并且百度从国内进行测试，则网站的速度自然会变慢。
但是，有些工具可以指定从何处进行测试。
平度
Pingdom Speed Test是一个很棒的工具，它可以测量网页加载的速度。测试完成后，至少在视觉上，您将获得一些类似于百度统计上的结果。
有趣的是，您可以选择要在哪里进行测试。当然，选择是有限的，但总比不知道要好。
如果您专注于本地SEO，请选择离您的服务器最近的位置。如果您不知道它的实际托管位置，请咨询您的托管提供商，您会找到答案。
如果您有国际化的受众，从不同的位置进行多次测试也是一个好主意。
GT-Metrix
GT Metrix一直是我们最喜欢的速度测试工具之一。尽管它仅从加拿大温哥华进行测试，但是它提供的见解非常有用。
快速提示：如果您与他们创建一个免费帐户，则无需等待太多时间即可执行测试。为了减少服务器上的负载，当请求太多时，它们会将您添加到队列中。但是，注册用户具有优先权。
mod_pagespeed
mod_pagespeed是Google的服务器插件。其目的是直接在服务器端解决核心级别上与页面速度相关的所有问题。这意味着即使您添加未优化的图像，mod_pagespeed也会自动压缩，优化并将其转换为下一代图像格式。
但是，安装mod_pagespeed绝对比处理WordPress中的所有内容更具技术性。如果您的服务器已经安装了它，或者您知道自己在做什么，请继续安装它。但是，始终优先考虑拥有一个快速站点而不是试图掩盖事实总是一个更好的主意。
无论如何，此mod将增加服务器的负载，因为每次您上传未优化的图像时，它都必须使用处理能力进行转换。
百度MIP（移动网页加速器）
如果您希望自己的网站在移动搜索方面真正快速，可以随时实施百度MIP。
MIP（Mobile Instant Pages - 移动网页加速器），是一套应用于移动网页的开放性技术标准。通过提供 MIP-HTML 规范、MIP-JS 运行环境以及 MIP-Cache 页面缓存系统，实现移动网页加速。
不仅如此，当用户滚动搜索结果时，MIP页面将在移动浏览器中预加载，从而在用户点击标题时立即加载该页面。
当然也有缺点。尽管情况每天都在变得越来越好，但您从各个方面都受到限制。此外，您网站的设计必须受到影响，并且看起来几乎与使用MIP的任何其他网站一样。
在WordPress和其他CMS上，您可以通过插件将MIP添加到您的网站。对于自定义网站，您需要与开发人员联系，如有此需要可以跟南京网站建设专家浪知潮网络联系。
结论
提高网站速度对于提高搜索排名至关重要。百度网站速度诊断提供了一组最佳实践和可能的改进，并根据它们对您网站速度的影响确定了优先顺序。
虽然分数本身并不会引起您太多的关注，但是最好使分数至少超过50。这是个好主意。但是，请注意加载时间（以秒为单位）。一个好的网站应该会在3秒钟内加载完毕。一个非常非常快的驱动器应该在大约1。
拥有良好的服务器，压缩图像并使代码中的内容保持简洁明了，对于网站速度而言，这将为您带来最大的收益。
您的网站速度检测得分是多少？提高网站的加载速度后，您是否看到了更好的排名？请与我们分享您的经验！
在线咨询
