10 个页面速度工具,用于查看您的着陆页加载速度

已发表: 2018-09-18

大多数网站在页面加载时会失去一半的访问者。 这是一个令人难以置信的令人震惊的现实,但当您考虑到今天的平均网页跳出率是 58.18% 时,可能就不是这样了。 更糟糕的是,点击后登陆页面的平均跳出率在 60% 到 90% 之间。

移动页面同样受到页面速度缓慢的影响。 2016 年 Google 和 SOASTA 的一项研究发现,跳出会话的平均移动网站加载时间比非跳出会话慢约 2.5 秒。

除了更高的 SEO 排名、更长的网站访问时间、更多的参与度和更高的转化率之外,加载速度更快的网站通常会产生更低的跳出率。 由于加载时间和跳出率之间存在如此强的相关性,营销人员必须利用页面速度工具来获得最大的结果。

在分析最值得信赖的测试页面速度的工具之前,让我们先看看最常见的因素和影响它的页面元素。

页面速度如何受到影响?

当发出页面请求时,前端组件和服务器端组件都必须完成各自的操作。 因此,即使您优化了前端,您也可以通过优化服务器端(服务器如何生成页面)来进一步加快加载时间:

页面速度工具加载时间

由于双方是连续的,它们的累计时间被认为是总页面加载时间。

上图中某处降低页面速度的一些最常见因素包括:

  • 大图像和文字图形
  • 视频
  • 页长
  • 脚本、字体和插件(HTML、JavaScript、CSS)
  • 不必要的重定向
  • 地理(国家、城市、组织、ISP、网络速度)
  • 带宽

以下工具有助于测试各种这些问题,让您更好地了解网站的速度。

10 个最值得信赖的页面速度工具

注意:这些工具中的每一个都提供了自己独特的功能、报告和分析结果的方法,这意味着您可能会收到不同的页面加载时间结果。 测试位置与托管网站的服务器之间的地理距离也有影响。 此外,第一次运行一个工具可能会比较慢,所以最好多次运行测试并取结果的平均值。

1. GTmetrix

页面速度工具 GTmetrix

GTmetrix 使用 27 个页面速度推荐(Google 速度测试)和 19 个 YSlow 推荐(雅虎速度测试)的组合来分析您的网站。 在报告的顶部,提供了从 A 到 F 的性能分数,以及页面详细信息,包括加载时间、页面大小和请求数量。

加载时间默认提供为“完全加载时间”(从访问者最初导航到页面到没有网络活动后 2 秒的时间)。 “加载时间”是可选的(当网页完成处理并且页面上的所有资源,包括图像、文本和脚本,都已完成下载时)。 报告的其余部分分为六个不同的部分:PageSpeed、YSlow、瀑布、计时、视频和历史。

GTmetrix 允许您针对各种连接类型测试和比较网站性能,以了解它如何影响您的页面加载速度。 它提供了连接限制功能来模拟您的站点访问者可能使用的 Internet 连接类型:电缆、DSL、3G 移动、2G 移动和 56K 拨号。 您还可以选择 Chrome 或 Firefox 作为可能的浏览器。

该工具有 7 个测试地点,但总共提供了 28 个专用测试服务器:11 个在加拿大温哥华; 5 在美国达拉斯; 7 在英国伦敦; 2 巴西圣保罗; 1个在澳大利亚悉尼; 1 在印度孟买; 和1在中国香港。

GTmetrix 支持 HTTP/2,它比 HTTP/1.1 更快地加载网页,试图解决 HTTP/1.1 的许多缺点和限制。 HTTP/2 的好处包括:

  • 复用和并发(可以在同一个 TCP 连接上快速连续发送多个请求)
  • 流依赖
  • 头部压缩
  • 服务器推送

此外,GTmetrix 是少数同时提供移动性能测试的页面速度工具之一。 它使用两部三星 Galaxy Nexus 手机,因此用户可以根据这些设备上的实际页面负载生成性能报告。

2. Pingdom

页面速度工具 Pingdom

Pingdom 允许您从 3 个主要位置测试您网站的速度:

  • 德克萨斯州达拉斯
  • 澳大利亚墨尔本
  • 加利福尼亚州圣何塞

它根据 Google 对免费版本的 PageSpeed 建议和对付费版本的 YSlow 建议提供性能等级。 Pingdom 还显示加载时间、页面大小、请求数量以及您的站点如何针对其他站点进行测试。 其他见解包括按内容类型划分页面大小、按域划分的页面大小、按内容类型和按域划分的请求。

Pingdom 速度测试的主要好处之一是为用户提供了性能洞察,概述了可以改进的地方。 但是,与 GTmetrix 不同的是,Pingdom 仅提供加载时间(而非完全加载时间),不提供连接限制,并且不支持 HTTP/2。

3. 谷歌 PageSpeed Insights

页面速度工具 PageSpeed Insights

PageSpeed Insights 是一项 Google 速度测试,它提供改进建议,并根据两个参数为您的网页评分 0 到 100 分:

  1. 加载时间(用户请求新页面后页面显示首屏内容的总时间)
  2. 整页加载时间(浏览器在用户请求后完全呈现页面所需的时间)

您的分数越高,您的网站就越优化,任何高于 85 的分数都表明您的页面表现良好。

PageSpeed Insights 为您网页的桌面版和移动版提供报告。 它检索 URL 两次——一次使用移动用户代理,一次使用桌面用户代理。 移动报告包括一个名为“用户体验”的附加类别,其中包括您的视口配置、点击目标(按钮和链接)的大小以及字体大小。

PageSpeed Insights 团队最近还在“Think with Google”上推出了一个新的页面速度工具,这是列表中的下一个。

4. 与谷歌一起思考:测试我的网站

页面速度工具 Google 移动版

与此不同的是它只测试移动页面速度。

在结果页面的顶部,是加载时间和估计的访问者流失率(代表由于加载时间而从您的页面流失的访问者的百分比):

页面速度工具AMP测试

“加载时间”是一个速度指数(不是完全加载时间),衡量可见页面内容在 3G 网络中的 Moto G4 设备上使用 Chrome 显示所需的时间。 (注意:使用 3G 网络进行测试,因为到 2020 年,全球 70% 的蜂窝网络连接将以 3G 或更慢的速度发生。)

结果的中间部分是行业比较,根据 Google 对超过 500 万个网页的内部研究计算得出:

页面速度工具行业比较

最后,测试我的网站工具显示了通过对页面进行一些修复可以节省多少时间,并附有 PageSpeed Insights 推荐的修复的详细报告:

页面速度工具谷歌测试建议

5. 谷歌速度记分卡

页面速度工具 Google Scorecard

速度记分卡在其数据库中包含来自 12 个不同国家/地区的数千个站点,并允许您比较多达 10 个域以查看您的移动站点的堆叠情况。 您还可以比较 3G 和 4G 连接的页面加载速度。

既然我们讨论了缓慢的页面加载速度如何影响跳出率和转化率,那么收入呢? 为了给你一个想法,谷歌还包括一个影响计算器来估计潜在收入品牌可能因页面加载缓慢而损失的美元金额:

页面速度工具收入影响

要查看您的估计损失,请填写计算器的字段:域、当前速度、平均每月访问者、平均订单价值和转化率(其中许多可以在 Google Analytics 仪表板中找到)。

6.KeyCDN

页面速度工具 KeyCDN

KeyCDN 是另一种在移动设备上运行良好的页面速度工具。 KeyCDN 提供 16 个测试地点供您从全球范围内进行选择,并可选择将测试结果设为私有或与他人公开共享。

结果包括瀑布细分,底部有网站预览。 在结果中,您可以看到发出了多少 HTTP 请求、请求的页面的完整大小以及加载时间。

7. 网页测试

页面速度工具 Webpagetest

WebPagetest 包括 40 多个不同的测试位置和超过 25 种浏览器(包括 14 种移动设备)可供选择。 有这么多测试位置可用,因为任何人都可以为 WebPagetest 托管测试位置,只要它们满足最低系统要求。

可以使用连接限制功能运行测试,以模拟网站访问者可能使用的潜在互联网连接:电缆、DSL、3G 慢速、3G、3G 快速、4G、LTE、移动边缘、2G、56K 拨号、FIOS、本地连接, 和自定义速度。

它提供了一种独特的测试方法,运行“第一视图”和“重复视图”。 它还提供了更高级的功能,如视频捕获、多步事务、内容阻止、禁用 JavaScript、忽略 SSL 证书和欺骗用户代理字符串。

当 WebPagetest 提供其结果时,它会根据默认情况下的完全加载时间为您的站点分配一个从 A 到 F 的字母等级,加载时间是可选的。 其他评分参数包括 FTTB、压缩、缓存、CDN 的有效使用等。 该报告分为六个部分——摘要、详细信息、性能审查、内容细分和屏幕截图——提供丰富的诊断信息以及瀑布图、页面速度优化检查和改进建议。

最后要注意的是,WebPagetest 支持 HTTP/2。

8. Dotcom-Monitor

页面速度工具 Dotcom Monitor

Dotcom-Monitor 在全球提供 20 个不同的测试地点和七种浏览器,包括移动和基于云的。 此工具的独特之处在于您可以同时运行所有地理测试,然后单击进入每个报告以了解有关它们的更多信息。

报告分为五个部分 - 摘要、性能、瀑布细分、主机和错误,您可以在这些部分下找到:

  • 按位置汇总
  • 所有页面元素的基于浏览器的加载时间测试
  • 检测慢/缺失元素
  • 10% 最快的元素
  • 10% 最慢的元素
  • 综合瀑布图
  • 按主机元素细分(包括 DNS、连接、SSL、请求、第一个数据包和下载)
  • 错误检查和诊断

9. 页面定位

页面速度工具 Pagelocity

Pagelocity 工具在桌面和移动设备上都可用且响应迅速。 它根据内容状态、页面结构和编码等组件为用户分配 100 分的总分。 报告包括:

  • 内容摘要:关于页面文本内容的宝贵见解(关键字、标题链接、图像的替代文本等)
  • 资源细分:关于您的页面结构的信息——它有多少图像、脚本或样式文件,以及阻止渲染的内容以及这些因素如何影响您的页面加载时间
  • 代码提示和见解:关于如何更新代码以提高可维护性和可扩展性的建议,以及有关标记的有用数据(类/ID、标签、Google PageSpeed、首字节时间等)

Pagelocity 的一个独特功能是它提供的并排指标的竞争分析,显示您相对于竞争对手的优势,以及他们可能存在的任何弱点。

10. YSlow

YSlow 是一个开源项目,它根据 Yahoo! 的 34 条高性能网站规则中的 23 条分析网页。 它遵循三个步骤来生成其性能测试结果:

  • 抓取 DOM 以查找所有组件(图像、脚本等)
  • 检索有关每个组件大小的信息(gzip、expire headers 等)
  • 使用数据为每个规则生成一个成绩,给你一个整体成绩

YSlow 还提供包含统计信息、改进建议和性能分析工具(包括 Smush.it 和 JSLint)的页面摘要。

要运行 YSlow 页面速度工具,您可以使用 YSlow chrome 扩展程序或从 GTMetrix 获取 YSlow 结果。

需要注意的是,这些工具中的每一个提供的分数、见解和反馈都是建议,而不是必须满足的硬性规则或要求。 此外,要意识到您可能已经在按照报告的建议进行操作,而该工具可能没有捕捉到它。

如果您确实决定需要进行更改以加快网页加载速度并提供更好的用户体验,那么有一些常用方法。

品牌如何加快网页速度?

上述工具对于检查可以轻松修复的主要页面问题非常有用。 因此,让我们花一点时间来解决其中的一些修复问题。

优化图片

确保图像不超过它们需要的大小,它们采用正确的文件格式,并为网络压缩。 25%的页面通过压缩图片和文本可以节省250KB以上,10%可以节省1MB以上。 关于视频,要么忽略它,要么将文件托管在另一个平台(如 YouTube 或 Vimeo)而不是您的服务器上。

异步加载

选择异步加载允许元素同时加载,而不是顺序加载,以防止页面加载速度出现任何延迟。

缩小 CSS、JavaScript 和 HTML

通过消除空格、逗号和其他不必要的字符、删除代码注释和最小化格式来优化您的代码。

减少重定向

减少重定向会产生很大的不同,因为每次页面被重定向到另一个页面时,访问者必须等待更长时间才能完成 HTTP 请求-响应周期。

缓存您的页面

浏览器缓存意味着当有人重新访问您的网站时,浏览器不必重新加载整个页面。 通过缓存样式表、图像和 JavaScript 文件等信息,您可以减少对服务器的请求数量,从而显着加快页面加载时间。

提高服务器响应时间

服务器响应时间受多种因素影响:流量、每个页面使用的资源、服务器使用的软件以及托管解决方案。 要缩短服务器响应时间,请查找性能瓶颈,例如数据库查询和路由缓慢以及内存不足。

选择适合您需求的页面速度工具

决定使用哪种工具最终取决于您要为网站跟踪和衡量的指标。 尽管在功能上存在差异,但每一个都在识别您的网站可能会变慢的区域并提供加速它的见解和建议方面提供了巨大的价值。

在设计快速加载的点击后登陆页面时,没有什么可以与 AMP 相比的。 凭借独特的框架和最少的 HTML,AMP 点击后登录页面可以立即加载,从而提供出色的用户体验。 立即请求演示,了解 Instapage AMP 构建器如何使数字营销人员能够快速轻松地创建和发布快速加载的内容。

AMP 点击后着陆页演示