理解站点性能和自动化速度测试的10个步骤

[ad_1]

理解站点性能和自动化速度测试的10个步骤

网站速度对于SEO很重要,这已不是什么秘密。

Google不仅将其用作排名因素,而且从用户登陆您网站的第二秒起就必须为其提供良好的体验。

网站运行缓慢和性能不佳将影响用户体验和可访问性,并影响企业的增长,最终影响收入。

实际上,那些致力于提高速度的组织已经看到了网站流量的增加,更好的参与度以及转换率的提高。

Pinterest的 这是一个例子,在实施绩效预算后,他们看到了用户情感和参与度的提升,这意味着收入增加了44%。

性能优化的蓝图

考虑到所有这些,Google Chrome网络平台的Paul Irish和Elizabeth Sweeny分享了他们创建的有用蓝图,用于评估和优化网站性能。 2019 Google I / O活动

虽然这主要是针对开发团队的,但有些关键任务对SEO专业人员很有用,我在本文中对此进行了进一步探讨。

在这些领域开展工作将为您提供机会 与您的开发团队更紧密地合作 一个共同的目标:

为您的用户提供最佳体验。

这样做的方法。

1.了解关键指标

第一步是了解Google在衡量网站页面速度时使用的关键指标。

对我们来说幸运的是,Google公开了这些指标,并在 他们的发展现场

Google当前使用的指标是:

  • 首次合格涂料(FCP)
  • 最大含量的涂料(LCP)
  • 首次输入延迟(FID)
  • 互动时间(TTI)
  • 总封锁时间(TBT)
  • 累积版式移位(CLS)

这些指标都有 不同的权重,这会影响所提供的整体效果得分。

这些指标中的许多已被Google使用了几年,但是最近它们引入了一些更新的指标,这些指标变得越来越重要:

最大的满意涂料 (LCP)

此以用户为中心的度量标准显示在视口中可见的最大元素的渲染时间。

总封锁时间 (待定)

TBT测量网站的负载响应能力,并在页面可用之前量化页面的非交互性。

累积版式移位 (CLS)

另一个以用户为中心的指标,CLS通过量化用户经历意外的布局偏移的频率来衡量页面的视觉稳定性。

2.衡量用户体验的质量

此步骤涉及评估对您的站点上的实际用户的性能影响,因此确定最重要的指标的优先级很重要。

Google汇集了 有用的矩阵 可以帮助您考虑用户的期望以及与之相关的指标。

衡量用户体验” srcset =“” src =“ https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-18-at-15.57.35-5e5e66c93a467.png

在确定优化工作的优先级时,使用此矩阵来分析上述影响最大的性能指标非常有帮助。

3.概述页面速度

下一步是检查您网站的效果。在大型网站上工作时,最好总是选择一些关键页面来进行此分析。

这可能是可带来大量收入或获得大量流量的页面。

另外,如果您的站点具有用于关键页面的模板,则可以分析其中的一些模板,以了解整个站点的基本性能水平。

执行页面速度测试

有多种工具可让您执行页面速度测试,其中一些是免费的,并且是获取对网站性能的关键见解的良好起点。

Google的Pagespeed见解

Google的这款免费工具结合了Lighthouse的实验室数据和Chrome User Experience报告中的现场数据,以分析网页内容并提供改进建议。

Google的Pagespeed Insights“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-19-at-16.53.18-5e5e66cbe3823.png

它允许您测试移动和桌面体验,并根据我们上面提到的指标显示100分。

GTMetrix

GTMetrix是另一个免费工具,可提供速度指标细分以及优化机会。

另一个有用的功能是能够根据位置,设备和浏览器类型自定义测试的功能,因此可以用来模拟不同的浏览环境。

GTMetrix“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-19-at-17.07.36-5e5e66ce5e1ba.png

使用网络爬虫

尽管上面的工具对于逐页分析很有用,但是如果您要进行大规模测量以及查看视觉趋势,则使用爬网工具将非常有益。

使用搜寻器“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-20-at-09.26.34-5e5e66d851692.png

例如,通过使用DeepCrawl的自定义JavaScript功能,您将能够从Chrome中提取许多关键指标。 (公开:我在DeepCrawl工作。)

这不仅使您能够大规模收集有用的见解,而且还可以看到站点速度随时间变化的视觉趋势。

4.发现影响页面加载的特定方面

有许多因素可能会影响您的页面速度。罪魁祸首包括:

  • 大量JavaScript资源。
  • 图片文件较大。
  • 具有大量的重定向链。

使用Chrome开发工具可以使您发现页面上可能影响加载时间的所有特定方面。

最有用的报告位于“覆盖率”选项卡下,您可以通过运行记录来测试特定页面的负载。

Chrome开发者工具“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-19-at-17.45.16-5e5e66d16b5af.png

这不仅使您可以查看哪些资源会影响用户体验,而且还可以了解页面的不同方面的加载,渲染和绘画所花费的时间。

这将允许您查明影响加载速度的特定问题区域。

5.设置要跟踪的特定KPI

请务必记住,每个网站都是独一无二的,具有特定的挑战和个人的成功指标。

这些将根据网站的主要目标而有所不同,而KPI将取决于这些目标。

例如,我曾经与一位电子商务客户合作,希望通过自然流量增加销售量,因此将KPI设置为“在未来6个月内将自然用户的销售量增加10%”。

其他KPI可能基于增加的自然会话,生成或转换更多的线索以及降低页面的跳出率。

页面速度将直接影响这些KPI,因为Google会奖励一个快速的网站并提供更好的用户体验。

6.实施建议的更改

此步骤涉及实施在先前步骤中执行的测试所提供的建议更改。

常见的优化建议包括:

  • 实现缓存以减少初始请求的大小。
  • 提供下一代格式的图像。
  • 压缩和最小化HTML,CSS和JavaScript。
  • 消除渲染阻止资源。

在这里,您需要与开发团队合作,以了解站点上可能发生的情况并实现更改。

您可以向开发人员询问很多术语,这些术语可以帮助您更好地了解网站的工作方式,Rachel Costello在以下内容中提供了这些术语的有用列表: 她最近的谈话 关于技术SEO的未来。

向开发人员询问有关“ srcset =“” src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-27-at-15.55.23-5e5e66df8ecea的条款.png7.减轻第三方标签对性能的影响

查看您网站上的第三方标签及其对网站性能的影响也很重要。您可能会对此处看到的结果感到惊讶。

有许多工具可以直观地汇总不同第三方标签的请求数量,加载时间和运行时成本。

例如, 索取地图 在页面上显示标签的地图,并允许您选择测试位置以从中运行分析。

请求地图“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-19-at-17.59.32-5e5e66d63107f.png

以及 第三方网站,这使您可以识别对性能影响最大的标签。

第三方网站“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-19-at-17.58.32-5e5e66d45a606.png

了解这些标记的影响后,您可以查看不必要的标记并进行删除。

8.随时间跟踪指标

为了确保您实施的更改能够为您带来积极的影响,重要的是要随着时间的推移跟踪它们,以查看改进情况并确定任何退步。

有许多方法可以检查性能如何发展,包括:

9.与您的行业中其他人进行比较和监控性能

在大多数SEO任务(包括性能优化)中,进行竞争者分析很重要,以便了解行业中相似网站的表现以及与之比较的方式。

使用 网页测试的外观比较 您可以输入您的网站和竞争对手的网站,以比较加载体验并查看您的匹配位置。

网页测试视觉比较” srcset =“” src =“ https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-03-03-at-13.52.48-5e5e8b18ae6ae .png10.衡量绩效与收入之间的相关性

此列表的最后一步是您可以做的最有价值的事情之一:将上面收集​​的实际用户指标与实际业务目标联系起来。

这将使您能够收集ROI数据并证明所进行的改进的商业价值。

执行此操作的一种方法是选择要监视的重要代表性页面,以便了解随着时间变化的页面速度数据如何影响为这些页面设置的业务KPI。

例如,您可以测量这组页面的网站速度变化,并将结果与​​Google Analytics(分析)中的用户或转换日期相关联。

自动化性能测试和监控

进行网站速度分析可能是一项耗时的工作,尤其是当您设置了要审核的较大URL时。

因此,为了有效地跟踪一段时间内的改进,采用自动化方法进行测试可能非常有益。

有几种方法可以自动进行页面速度测试,包括:

使用履带

如上所述,您可以使用网站爬网工具来运行常规爬网并随时间监视网站速度。

通常,可以通过将爬网设置为每周,每两周或每月运行并在准备好查看时接收通知来自动执行这些报告。

使用搜寻器自动执行“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-20-at-09.51.24-5e5e66dc6e6c2。 png

Google Search Console

Google还在去年的Google Search Console中引入了速度报告,使您可以使用“ Chrome用户体验报告”中的数据查看网站关键速度字段指标的汇总视图。

还可以深入研究特定问题并查找需要改进的页面组示例。

Google Search Console“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screen-shot-2020-02-20-at-09.47.29-5e5e66da41958.png

最重要的是,您将能够随着时间的推移监视速度,并根据正在执行的工作查看是否有任何改进,以及发现任何回归。

在命令行中运行Lightspeed测试

也可以通过命令行运行Lighthouse报告。这样做的好处是您可以使其在后台运行,并且可以生成多种格式的结果。

为此,您需要安装Google Chrome浏览器和 node.js (JavaScript运行时环境)安装在您的计算机上。从这里开始,我们将使用NPM软件包在命令行上安装Lighthouse。

sudo npm install -g灯塔

安装完成后,您将可以使用以下命令直接从命令行运行灯塔测试;

灯塔{您的网址}

这将打开浏览器窗口,并自动为您执行常规的灯塔测试。您还可以定义输出格式,甚至可以无头运行命令,以免打扰您的工作流程。

例如,我将按以下方式运行分析;

灯塔https://www.asos.com/women/ –quiet –chrome-flags =“无头” –view

命令行中的灯塔“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screenshot-2020-03-02-at-10.21.06-5e5e66e2d33e9.png

这将使用无头Chrome浏览器运行测试,并在完成后以HTML文件打开输出,并将其保存到我的计算机中。

您可以在 Github仓库在这里,以及安装和运行它的完整说明。

Google Lighthouse“ srcset =”“ src =” https://cdn.searchenginejournal.com/wp-content/uploads/2020/03/screenshot-2020-03-02-at-10.21.16-5e5e66e5eef4d.png

这也是开始使用命令行运行分析的一种很好的方式,并且对我提高使用它的舒适度也有很大的帮助。

总结一下

快速高效的网站的需求并没有消失。

作为SEO专家,我们有很大的机会与我们的开发团队合作,为网站访问者和搜索引擎爬虫提供最佳体验。

通过执行上面概述的10个步骤,我们将能够为围绕网站优化的对话提供很多价值,但是了解特定网站的可行性也很重要。

例如,由于其设置,某些网站具有某些限制,这些限制将不允许它们以页面速度测试建议的某些方式针对速度进行优化。

与此同时,与开发人员一起检查是否可以实施 以用户为中心的策略(例如平稳降级和逐步增强)将有助于进一步的优化活动。

此外,执行速度分析不再是手动任务。

有几种工具可用于自动化这些测试,以提高效率并让您专注于确保网站尽可能地易于使用。

图片积分

后期图片:DeepCrawl
由作者拍摄的所有屏幕截图,2020年3月

相关文章