谷歌将你的网站的加载速度作为一个排名因素。那么,谷歌PageSpeed洞察力告诉你,谷歌是否认为你的网站是快如闪电还是慢如蜗牛。它还向你提供可操作的建议,你(或你的网站开发人员)可以用它来加速。
Google PageSpeed Insights (PSI) 是一个工具,它使用优化指标的组合来测量和报告网页在台式电脑以及移动设备上的性能。然后,该工具提供关于如何改进网页或博客文章的有用建议。
根据谷歌的一项研究,如果一个移动网页的加载时间超过三秒,53%的用户将不会在该网页上停留。出于这个原因,拥有一个快速、响应性和优化的网站是至关重要的。
它可以引导访问者留在网站上,浏览更多的页面,进行更多的转换,如果可能的话,还可以进行更多的购买。此外,良好的加载速度等于在SERP中获得更好的排名和更多的收入。
有许多工具可以帮助你,但在这篇文章中,我将只关注谷歌的PageSpeed Insights (PSI) 。
那么。
- 什么是谷歌PageSpeed Insights?
- 这个工具的目的是什么?
- 如何使用它?
无论你的知识水平如何,本指南将帮助你了解优化网站速度和性能的内容。
第1章:关于Google PageSpeed Insights工具,你需要了解什么?
在这第一章中,我将对PSI TOOL工具做一些解释,如何使用它,以及为什么它很重要。
1.1 什么是Google PageSpeed Insights?
PageSpeed Insights是由谷歌在2010年推出的,旨在推动网站的性能优化。
奇怪的是,同年,谷歌还推出了算法更新,使网站速度成为计算机搜索的直接排名因素。
自2018年底以来,PageSpeed Insights由Lighthous驱动,这意味着它基于Lighthouse API生成数据。
简而言之,PageSpeed Insights(PSI)的简单目标是分析你的网站页面在移动设备和桌面设备上的性能,然后提供关于如何使其更快的建议(可操作)。
这些建议或提议是谷歌在这个工具中提供的最有价值的信息。它们比加载时间得分更有意义。
要了解它们到底是什么,如何应用以及如何实施,重要的是要了解处理这些指标的两个数据集之间的区别。
- 实验室数据
- 现场数据
现场数据(也被称为RUM或真实用户监测)使用真实的页面加载数据,因此在捕捉和识别用户体验障碍方面非常有效。
然而,由于他们能分析的网站指标数量有限,其解禁的可能性大大降低。
值得注意的是,现场数据是从使用谷歌Chrome浏览器的实际网络用户那里收集的,而不是其他流行的浏览器,如Safari或FireFox。
与现场数据不同,实验室数据是基于Lighthouse的性能分析。
这使得它在排除性能表现问题时自然有效。然而,实验室数据的缺点是,它可能无法识别真实的用户体验问题。
1.2 如何使用Google PageSpeed Insights?
使用谷歌PageSpeed工具测试网页是相当简单和直接的。你所要做的就是复制你网站上任何页面或博客文章的URL,并将其粘贴到该工具中。
在粘贴网站的URL之后,点击 “Analyze“按钮,片刻之后,谷歌将提供你的PageSpeed Insights得分,包括每个网络指标的详细测量明细。
当谷歌分析网站的URL时,它提供了一个以100分为单位的分数。
这个分数是基于性能优化的最佳做法,已知可提供最佳的用户体验。
如上所述,除了你的PageSpeed得分之外,你还会收到谷歌关于如何提高页面速度和性能的一些建议。这可能包括诸如以下建议。
- 删除未使用的CSS。
- 减少JavaScript的执行时间。
- 推迟屏幕外的图像。
- 等等。
这些速度得分是通过谷歌的开源工具Lighthouse计算的。 Lighthouse旨在分析并帮助提高所有网页的整体质量。
Lighthouse甚至可以帮助评估诸如可访问性、渐进式网络应用程序和其他各种性能指标等因素。
使用谷歌的PageSpeed Insights工具可以让你详细评估Lighthouse对你的网页的看法。
1.3. 为什么速度很重要?
说到网络,整个网络都被期望是快速的。谷歌甚至认为PageSpeed Insights会影响其他搜索引擎的排名因素
如果你有一个缓慢的网站,你绝对会努力出现在搜索结果的前几页。
速度是谷歌在分析你在搜索引擎上的位置时,所关注的200多个排名因素之一。这就是为什么它是优化你的网站的最重要因素之一。
现在,让我们看看在这个工具上测试你的网站时可能收到的一些建议。
第2章:谷歌PageSpeed Insights的常见建议是什么?
为了提高你的网站的速度得分和性能,Google PageSpeed将在机会和诊断部分为你提供以下内容,即你应该遵循的建议
在本章中,我将解释其中几个:
2.1. 选择最好的框架或主题
选择一个WordPress主题是一件棘手的事情。由于有大量的免费和高级WordPress主题,你很容易迷失在为你的网站选择哪一个主题上
然而,如果在选择主题时有一个经验法则。首先,你应该关注主题的简单性和速度。
有些主题提供了许多内置功能,但你不可能使用所有的功能。所以你不需要一个功能丰富的主题。
通过选择一个简单的主题,你可以添加你觉得对你的网站来说是必要的插件
选择一个加载了许多功能的主题,只会让你有不必要的功能,在你的主机中占用更多的空间,而且只会减慢你网站的速度。
这里有两个你不会出错的主题的例子:
- Genesis Framework
- Thesis
两者都是简约的框架,易于使用和定制,以获得你想要的网站设计。最重要的是,由于代码简洁,两者都以其超快的加载速度而闻名。
对于Genesis,你可以从众多的主题中选择,你可以在框架之外使用这些主题来增强你的网站。对于Thesis,你也可以为同样的目的在不同的主题中进行选择。
2.2. 限制WordPress插件的使用
如果你使用WordPress,最好的功能之一是能够下载伟大的插件来支持你的网站。无论你的网站的目标是什么,你都会找到一个适合该目的的插件。
然而,有些人走得太远,在他们的网站上安装了太多的插件。由于过于依赖插件,你有可能因为每个插件的编码和脚本而使你的网站变慢。
为此,你应该尝试限制你在博客上使用的插件数量。
如果可能的话,如果你想在你的网站上实现一些东西,首先寻找其他的方法,而不是立即转向插件。
另外,有一些插件几乎可以做同样的工作。要做到这一点,要确保你的所有插件都有特定的任务。
2.3. 优化你的WordPress数据库
当在你的网站上编辑帖子和页面时,WordPress会存储以前的版本,这样你只需点击几下按钮就可以恢复到这些版本。
然而,如果你继续多次编辑你的帖子和页面,这些修订就会在你的数据库中累积起来
结果,你的数据库将包含你的内容的先前版本,而你不需要使用你的主机资源。
为了保持你的WordPress数据库的精简,你需要用尽可能少的修订来清理它。
你可以通过下载Disable Post Revision来做到这一点。
这将根据你使用该插件设置的各种过滤器,自动删除修订内容。
2.4. 优化图像
视觉内容在今天的数字营销领域发挥着重要的作用。
由于从信息图和图像中处理信息比从文字墙中处理信息要容易得多,越来越多的出版商依靠这些类型的内容的力量与他们的观众互动。
然而,使用视觉内容为你的营销提供动力的注意事项是它们的文件尺寸通常较大。一些信息图由于其长度和细节,可以大到3MB。
在你的网站上加载如此大的文件会降低你的网站速度,并有可能导致你的访客因为加载时间过长而离开你的页面。
因此,在发布你的文章之前,你应该在不影响其质量的情况下,通过最小化其文件大小来优化图片。这样,你就可以在所需的页面上显示图片,并使它们比平时更快。
有几种方法可以做到这一点
手动,你可以下载一个文件编辑器,如IrfanView,并通过降低其分辨率质量来保存图像。
每次保存图像时,你会经常看到一个窗口出现。在顶部,所有图像的默认保存质量被设置为80,这是一个足够好的数字,可以平衡图像分辨率和文件大小
然而,如果你想减少文件大小,你可以把记录质量降低到一个你能接受的数字。但是,请记住,随着数字的减少,质量也会下降。
另外,你需要注意你网站的内容栏,并将你的图片调整到你的栏目所允许的最大尺寸。这必须手动完成,以优化你的网页的加载速度
例如,如果你的内容栏是600px宽,确保你内容中的所有图片都是这个宽度。
如果你想在上传图片到WordPress之前对它们进行优化,你可以使用像Optimizilla这样的网络工具,它允许你上传和优化多达20张图片。
Optimizilla会自动将图片文件压缩到最佳大小,这样浏览器就可以在您的网站上更快地加载它。
然而,如果你想优化已经在你的WordPress媒体数据库中的图片,你可以简单地下载并安装WP Smush。
即使你没有对你的数据库中的图片进行优化,该插件也会自动为你做这项工作。一旦安装了该插件,它也会对您上传的任何图片进行同样的处理。
使用WP Smush可以为您节省优化图片的手动工作。这使您能够专注于为您的网站创造更好的内容。
2.5. 使用懒惰加载插件
如果你的文章和页面包含自上而下的图片,你应该知道,浏览器通常在用户开始看到它们之前会加载所有的页面元素
因此,你的充满图像的页面可能需要时间在用户的浏览器上加载。访客可能会厌倦等待它的加载,这将导致他们跳出。
为了防止这种情况发生,你应该在你的网站上安装一个延迟加载插件。一旦安装,在用户侧可见的图像和媒体文件将被加载
一旦用户向下滚动页面,图像将在屏幕上显示时逐一加载。这个插件使加载你的网站更容易管理,因为它不会一次性加载所有的内容。
A3 Lazy load是一个流行的插件,用于懒惰地加载您网站上的图像、iframe、视频和其他元素。
它有许多设置,所以你可以自定义你希望你的网站元素的加载方式。
它还经过测试,与WooCommerce、Advanced Custom Fields和各种CDN等流行插件100%兼容。
然而,如果你使用视频而不是图片来填充你的页面和帖子,那么Lazy Load for Videos就是为你准备的。
这个插件有助于改善你的页面加载时间,增加你的谷歌PageSpeed得分。它与oEmbed一起工作,用一个可点击的预览图像取代嵌入式YouTube和Vimeo视频。
通过只在用户点击预览图像时加载视频,没有加载不必要的JavaScript。这将有助于提供良好的用户体验,特别是在有许多嵌入式视频的网站上。
2.6. 将JavaScript和CSS最小化
这是谷歌会给你的最常见的建议之一。这个建议指的是会影响你网站速度的JavaScript和CSS脚本
因为用户的浏览器在显示你的页面之前必须下载所有这些程序,所以太多的程序会阻碍页面的加载时间。
事实上,在定制你的WordPress网站时,你会发现自己在标签标记前添加了JavaScript代码,或修改其CSS文件以达到一个特定的设计外观
虽然这些都是大多数网站所有者必须遵循的正常程序,但这两个页面元素都会导致你的网站变慢。它们需要一个HTTP请求来从第三方获取信息并加载到你的网站上。
因此,如果你加载大量的JavaScript代码或在你的网站上应用CSS变化,你可能会导致网站变慢。
假设你根本无法删除JavaScript和CSS,你可以下载一个插件,让你最小化页面的这两个元素。
通过最小化你的网站,你可以删除你的JavaScript和CSS中不必要的字符和空格,如:
- 白色的空格;
- 块定界符;
- 评论;
- 以及其他不需要加载页面的字符
通过删除这些字符,你可以减轻页面元素,使你的网站加载速度更快。
要开始使用,你可以选择这两个插件
这是两个轻量级的插件,只执行一个主要功能,而且做得很好最小化 Javascript 和 CSS。
比较这两个插件,Autoptimize似乎很适合初学者,因为它很容易使用,而且几乎不需要改变默认设置。
然而,如果你已经有一些经验,Better WordPress Minify似乎是最好的选择。
2.7. 选择可靠的虚拟主机/服务器
考虑你的WordPress网站所依赖的基础是很重要的。你的网站所依赖的许多支柱之一是你的虚拟主机
在你选择一个虚拟主机之前,你需要考虑你将吸引多少流量
通常,选择错误的虚拟主机的问题是服务器响应时间减少。如果你有足够多的访客同时浏览你的网站,这个问题就会发生。
一个特定的虚拟主机供应商和计划只能在给定的时间段内容纳一定数量的访问者。如果这个访问者的数量超过了设定的限制,运行中的虚拟主机服务器将受到影响。
因此,服务器将超负荷工作,以参与来自世界各地成百上千的浏览器的几个HTTP请求。
为了防止这种情况发生,你可以简单地应用上面提到的提示来提高你的网站的性能,这可以减轻虚拟主机服务器的一些负担。
然而,如果你已经遵循了上述所有的提示,但服务器的响应速度仍然比平时慢,那么可能是时候升级你的托管计划了,如果不是完全更换供应商。
例如,如果你订购的是共享主机,你应该考虑将你的计划升级为VPN或专用WordPress主机托管计划,以便它能够处理激增的流量而不影响速度。
2.8. 使用内容分发网络(CDN)
尽管为你的网站选择最好的虚拟主机将使你能够处理来自访问者的HTTP请求,然而它还是给你的主机服务器带来压力。
你想要的是将你的主机从来自不同浏览器的多个请求的负载中卸载出来。
一个内容交付网络(CDN)就能做到这一点。通过将请求分配到其在不同地点运行的服务器网络,减少你的托管服务器的负载
CDN将找到离用户最近的服务器来传递文件(脚本、CSS、图像),并将日期发送给用户,以加快网站加载速度。
市场上有许多CDN。然而,如果有一个CDN你应该使用,确保它与你目前使用的缓存插件兼容
下面是关于哪些CDN和缓存插件能很好地一起工作,以及你应该为两者做哪些调整的指南。
- W3 Total Cache and MaxCDN
- WP Fastest Cache and MaxCDN
- W3 Total Cache and KeyCDN
- WP Super Cache and KeyCDN
- W3 Total Cache and CloudFlare
只需按照每篇文章的说明,配置你的缓存和CDN插件,这样你的访问者就可以享受更快的网站加载速度。
2.9. 减少服务器响应时间
首个字节的时间(TTFB)衡量浏览器在发出请求后从你的服务器收到第一个字节的数据所需的时间。
TTFB不应与网站的整体速度相混淆,因为它只是衡量加载过程开始时的速度。然而,对于你的网站的性能来说,低TTFB是很重要的。
通过减少服务器响应时间,你可以大大改善你的Google PageSpeed报告
这里有一些因素,包括上面已经提到的一些因素,可以影响你的TTFB:
- 选择一个有信誉的DNS(域名系统)提供商。
- 选择一个高质量的虚拟主机提供商。
- 使用轻量级主题和插件。
- 实施浏览器缓存。
- 使用专门的WordPress优化插件。
- 减少安装在你网站上的插件数量。
- 使用内容交付网络(CDN)。
2.10. 提供下一代格式的图像
有些图像文件格式的加载速度比其他的快,但它们并不像JPEG或PNG那样流行
许多WordPress的优化插件现在包括了以新的webP格式提供图像的能力,这进一步减少了文件的大小,增加了初始加载时间
webP文件格式正在迅速成为新的网络标准,谷歌报告将推荐使用它来提高你的网站的性能以及加载时间。
2.11. 使用视频制作动画内容
使用GIF可以是显示动画内容的一种有吸引力的方式,但使用太多的GIF会使你失去一些性能点。
相反,你可以将这些文件转换成MP4或WebM等格式,这不会影响页面速度,并有助于使你的网站比使用GIF更快。
你也可以考虑在你的UI设计中使用HTML5或CSS/SVG动画,如果它比传统视频动画更有意义的话。
2.12. 在网页字体加载时使文本可见
字体是较大的文件,会对你的页面加载时间产生负面影响。
有时候,浏览器会隐藏你的文字,直到字体完全加载完毕。这导致性能指标和谷歌提出的建议,以提高你的分数
谷歌会告诉你通过应用与你的字体风格相匹配的Front Display API交换指令来解决这个问题。你需要修改你的CSS来解决这个问题。
2.13. 启用文本压缩
当这个建议出现在Google PageSpeed中时,它指的是使用gZIP压缩。在某些情况下,你所使用的服务器上会自动启用文本压缩。
否则,你的第一个选择是安装一个提供GZIP的插件。你也可以决定手动压缩你的文本,这涉及编辑你的.htaccess。
2.14. 减少请求的数量并限制传输大小
用户的浏览器为加载你的网站页面而发出的请求越多,你的服务器就会送回更多的资源。这就导致了网站加载时间的延长。
Google PageSpeed中的这项建议不会在你的报告中导致通过或失败。你将会看到一个数字,显示对你的页面的请求量及其相关的尺寸。
事实上,没有最大的尺寸或请求要求需要牢记。与其设置一个理想的数字,谷歌将建议你通过创建和实施性能预算来自己创建这些标准。
你可以根据以下几个方面来设定你的目标:
- 脚本以及框架的大小
- 最大的图片尺寸
- 你所调用的外部资源的数量
- 以及使用的网络字体的大小
这个性能预算将帮助你负责任地优化你的网站。
现在你可能想知道,当你遵循所有这些建议时,是否有可能在PSI上达到100分的满分?答案就在下一章。
第3章:是否有可能在谷歌PageSpeed Insights上获得满分,以及谷歌如何使用它?
3.1. 有没有可能获得谷歌PageSpeed Insights满分?
有许多网站开发人员和网站所有者很快就迷恋上了在谷歌PageSpeed Insights上取得100分的满分的想法。
说实话,这几乎是不可能的,而且也不是那么重要。试图达到这样的分数将迫使许多网站所有者对其他各方面的优化视而不见。
通过谷歌PageSpeed Insights工具管理网站时,获得的最有价值的信息是优化建议
这些建议应被用作改善你的PageSpeed得分的指导方针,但不应被视为福音。
在Google PageSpeed Insights上获得一个完美的分数,并不像提供一个良好的用户体验那么重要。
这意味着网页设计师和业主需要在以下方面找到平衡:
- 设计;
- 功能;
- 和性能。
PageSpeed Insights平台也不是对网站速度和页面加载性能的最终测试。
我总是建议通过各种网站速度优化平台来管理网站。这将给你一个更完整的画面和更多样化的反馈,以做出明确的决定。
每个平台都会对你的网站进行一些不同的评估,并为你提供不同的反应和反馈,以提高你的网站速度。
有些网站的加载速度为500毫秒,但他们在谷歌PageSpeed Insights上并没有得到满分,因为他们没有达到其所有的标准。
网站所有者需要确保他们专注于体验” 并在尝试考虑优化时将其作为优先事项。为什么?因为这个指标是对人类访客真正重要的东西
一个网站的访问者不会去寻找它的Google PageSpeed Insights分数,而只是想尽可能快地看到内容的显示。
这是唯一的根本原因,为什么你应该使用这个和类似的工具来识别你的网站上的潜在优化问题。
一旦发现真正的优化问题,你需要努力解决它们,以提高网站速度,从而改善用户体验。
3.2. 谷歌是如何使用PageSpeed Insights的?
除了用户体验(UX)之外,速度在搜索引擎对网站的排名中也起着重要作用。
PageSpeed Insights平台是由世界上最大的搜索引擎开发的。因此,假设你的PageSpeed Insights得分会在一定程度上影响你在谷歌SERP中的位置,这很正常。
现实的情况是,谷歌使用这个平台来确定其排名
因此,当你用Google Page Speed Insights工具分析你的网站以确定速度时,你应该期待相关和准确的反馈和建议,这将使你的SEO表现有所改变。
谷歌在确定一个网站在搜索结果中的位置时,会考虑许多因素,而不是仅仅根据加载时间对网站进行排名
这意味着,即使通过PageSpeed Insights工具获得100分的满分,也不能保证你在搜索引擎的SERP上获得最高位置。
页面速度得分是为了帮助提高你的网站的搜索引擎优化和在移动和桌面上的性能。
为了做到这一点,谷歌将移动性能得分与桌面性能得分分开,以帮助你针对每种环境微调你的网站。
现在,让我们看看最后一章,其中我将简要回答一些经常出现的问题。
第4章:关于Google PageSpeed Insights的更多问题
4.1. 什么是谷歌PageSpeed Insights?
Google PageSpeed Insights(缩写为PSI)是一个网络工具,负责评估网页的加载速度。
它一方面评估用户手机上的性能得分,另一方面评估电脑上的性能得分。此外,它还提供切实可行的建议,以便你能够提高页面的加载速度。
尽管它是一个直观的免费工具,易于使用,但有些人不相信它的相关性。
所有的数据都是从Chrome浏览器的用户体验报告中收集的,以给出这些信息。
4.2. 是什么促使谷歌创建PageSpeed Insights服务?
保证良好的用户体验和鼓励创建快速页面是促使谷歌从这个工具中向用户提供改进建议的两个主要原因。
4.3. 网页加载太慢怎么办?
以下是加载时间过长的页面的三个常见后果
- 弃权率增加
- 转化率下降
- 自然流量逐渐减少
根据Kissmetrics关于这个话题的研究,延迟一秒钟会导致网站的转化率下降7%。
4.4. 什么是好的Google PageSpeed分数?
请记住,你网站性能的真正指标是它的加载时间,而不是PageSpeed Insights得分。但谷歌自己说,不好的分数是在0到49之间,平均分数是在50到89之间,好的分数是90以上。
几乎不可能达到100分,特别是在半复杂的网站上。任何高于88分的都被认为是好的,但任何低于这个分数的都意味着你需要做出改变以提高你的分数。
4.5. 谷歌PageSpeed的统计数据是否准确?
并非如此!换句话说,当涉及到实际的用户体验和网站排名时,谷歌PageSpeed Insights的分数并不真正准确。它们不会也不可能测量访客在加载网站时的实际体验。
然而,它们可以帮助你发现一些你可能没有注意到或可能已经忘记的错误。
4.6. 如何使用谷歌PageSpeed Insights报告?
使用PSI报告是简单而容易的。你所要做的就是进入该工具的主页,输入你网页的URL,最后点击分析。
一旦显示结果,你应该尽快采取行动,纠正建议的错误。就在建议的下方,你会看到带有 “显示如何修复 “字样的链接。
点击它们后,你将看到拖慢页面的文件,以及如何处理它们以减少服务器响应时间的提示。
4.7. 为什么网页的速度真的很重要?
网页速度对用户来说是很重要的,因为,更快的网页效率更高,在网页上提供了更好的用户体验。
4.8. 一个网站的速度是否会影响它的搜索引擎优化?
是的!页面速度是一个直接的排名因素,自从谷歌的算法速度更新以来,这一事实变得更加广为人知。然而,速度也会因为大量的跳出而间接影响排名。
4.9. 如何提高网站在移动设备上的加载速度?
- 评估并减少服务器响应时间。
- 避免或尽量减少重定向。
- 严格测量往返时间。
- 将Java脚本放在底部,CSS放在HTML文件的顶部。
- 等等。
4.10. 如何减少我的网站的加载时间?
为了提高你的Google Insights Pagespeed得分,请遵循这些指示。
- 减少HTTP请求。
- 最小化和合并文件。
- 对所有CSS和JavaScript文件使用异步加载。
- 推迟JavaScript的加载时间。
- 保持低的服务器响应时间。
- 根据你的需要选择一个好的托管计划。
- 消除不必要的下载。
- 压缩你的数据。
- 创建一个缓存层次。
- 优化你的图像。
- 优化你的字体。
- 避免点击后登陆页面的重定向。
- 尽量减少CSS、HTML和JavaScript。
- 优先考虑折叠上方的内容。
- 移除阻挡渲染的JavaScript。
4.11. 我如何在谷歌上检查我的网站速度?
- 登录到谷歌分析。
- 转到主页。
- 打开报告。
- 选择 “行为”>”网站速度”。
4.12. 一个网站的加载速度应该有多快?
简而言之,你的网站应该尽可能快地加载! 移动网站的理想加载时间是1至2秒。
4.13. 为什么网站加载缓慢?
流量太大:在一定水平上,网络服务器只能处理一定数量的人的请求。一旦超过了这个数字,页面的加载速度就会更慢
访问者越多,网站的速度就越慢。随着访问者增多,服务器供应商可能还需要为网站投入额外的资源。
小结
除了检查你的速度得分,你还应该专注于实施该平台的建议,以确定你的网站需要改进的地方。
毫无疑问,谷歌PageSpeed Insights是一个对开发人员、网站管理员和网站所有者有用的工具。我希望这篇文章能够启迪你,让你了解它是如何工作的,以及你如何利用它来发挥你的优势。
但对一些人来说,可能很容易被技术术语所迷惑,并对结果产生误解。如果你处于这些情况之一,请求助于SEO机构的专业知识吧!他们拥有必要的技能和经验。
他们拥有必要的技能和经验,可以完成繁重的工作,帮助你提高网站的性能,提供更好的用户体验。
我希望通过本指南,你现在对谷歌PageSpeed Insights工具有了更多的了解。