网站的载入速度,除了直接对网站用户体验有很大的影响,对于SEO也会有影响。网页的载入速度是google作为搜寻排序的一个指标,换句话说,网页的载入速度快慢,会影响到我们的网站排名。正因为网站速度的优化如此的重要,我们更不该忽视网站速度的优化。

说到网站速度的测试与优化,很多首先会想到的是GOOGLE所提供的网页测速工具(Page Speed Insights) ,但常在使用的人,就会注意到网页测速工具在最近一次的更新后,整合了新的数据进去,也就是我们本次文章的主角-灯塔工具(Lighthouse)的分析数据,灯塔工具的重要性可见一般。

看到这边,你可能会在想,究竟灯塔工具有多么厉害,会让Google认为它重要到应该整合进自己的工具当中?

今天就要来跟大家分享,连Google都不敢忽视的强大灯塔工具!

灯塔工具(Lighthouse)是什么?有什么用途?要如何使用?

灯塔工具(Lighthouse)是Google Chrome的扩充应用程式,是一个网络开发者(Web developer)工具,它的主要功能是针对网页的性能(包含网页载入速度)做分析,并产生分析报表,报表上会有该页面各项数据、指标的表现,以及如何优化改善的建议。

对于要如何安装灯塔工具,或是有任何使用上的疑问,您可以参考Google的这篇文章:使用Lighthouse审查网络应用。

简单来说,只要安装Chrome浏览器后,点击Lighthouse - Chrome线上应用程式商店- Google Chrome连结,就可以进到安装的页面。安装完后您就可以在浏览器的右上方看到,灯塔工具的图示(一个小灯塔)。

接着只要开启我们想要分析的网页,然后点击那个图示,并按下Generate Report,工具就会开始进行网页的分析,并于分析完后,会跳出一个呈现分析报表的视图,如下图:

如何解读报表,并根据分析结果的指标(数据)与建议改善网站速度与用户体验?

当产生完分析报表后,接下来我们要来解读这份报表,并针对报表中网站的缺点,进行优化。

首先在解读报表上,在最上方可以看到五个综合评分指标,显示该网页在各个层面的分数表现,而下方后续的报表内容,则主要是针对各个指标做细部的说明,并提供改善的方向和建议。

而我们今天以网站速度优化为主,所以会优先来看与载入速度有关的表现(Performance)

从上图,我们可以看到它展示了网站载入速度的各项指标表现。

而接着如下图的Opportunities和Diagnostics区块,则是针对如何优化提出建议方向和说明,以及显示改善后预估能够减少多少的载入时间

例如第三点有提到可以使用合适的图片大小,并预估能降低4.69秒的载入时间。进一步点开,就会显示详细的资讯,像是有哪些图片大小是可以缩减的。

其实从上图的分析当中,可以看到仍有许多可以优化的地方,能去改善网站的速度。

那接下来在那么多的优化项目中,可以先针对能带来较大改善,或操作起来较简单的项目先执行,慢慢按部就班的改善网站速度,让用户有更好体验。

另外,如果看英文的描述较不清楚的话,正如前面所述,Google已经将灯塔工具的上述效能、表现(Performance)的区块,整合进它的网页测速工具(Page Speed Insights)当中,测速工具有提供中文的介面,所以能够协助我们掌握Lighthouse资料。要使用测速工具,只要点选上面的连结,在搜索栏位输入要分析的网站,就可以看到分析报告了。

最后,随着Google将Lighthouse纳入它的工具当中,我们可以推测Google对于Lighthouse中显示的指标特别重视,所以了解Lighthouse,并针对它建议的方向进行优化,改善网站的速度,才能让网站更受Google bAIdu 搜索引擎和用户喜爱,同时带动我们的网站排名蒸蒸日上。