Image Speed Test 分析你的网页内容,提供加速及图片最佳化建议

青衣

温馨提示:这篇文章已超过544天没有更新,请注意相关的内容是否还可用!

Image Speed Test 分析你的网页内容,提供加速及图片最佳化建议

最近在研究免费资源网络社群的网站成效表现,才发现图片容量太大、对于网页载入速度造成一定程度的影响,事实上对一般内容网站来说可能不会非常要求图片品质,例如文章里搭配文字说明所使用的画面撷图也不用过度清晰,利用图片压缩工具先处理一下,即使是无损压缩(Lossless)也能让容量降低不少。若你是使用 WordPress 架站,官方提供的 Jetpack 外挂就有内建免费的图片 CDN(Photon CDN)功能,开启后就能自动压缩图片,以内容传递网络技术让载入速度更快,也更节省主机流量。

本文要介绍的「Image Speed Test」刚好是我在研究图片压缩过程中遇到的一个新推出的在线工具,背后是一家专门提供图片压缩技术的服务 Piio,输入网址就能在线检测你的网站速度快不快,图片部分有没有任何最佳化的空间,和之前推荐过的 16 个免费网站测速工具功能差不多,只不过 Image Speed Test 更侧重于图片项目。

Image Speed Test

当然 Image Speed Test 主要目的还是要行销宣传 Piio 本身的图片压缩、最佳化业务,如同之前介绍过的「imgix Page Weight Tool 找出网页里过于肥大的图片资源」就是 imgix 提供的类似工具(imgix 和 Piio 是同类型服务),但还好这样的网页检测工具并不会强制使用者必须使用它推荐的图片压缩服务,因此还是可以扫描一下自己的网站图片是不是过于庞大、有没有任何压缩、调整或是变换格式的必要。

Image Speed Test
https://imagespeedtest.piio.co/

使用教程

STEP 1

开启 Piio 的 Image Speed Test 服务后,填入要检测的网站网址,按下 Analyze 产生分析结果。如果是内容网站简易可以直接检测首页,或是随意挑一篇具有图片的内文。

Image Speed Test

STEP 2

Image Speed Test 需要一段时间撷取网站,同时分析桌面端和行动端的速度,最后才会产生结果,这里有一些数据提醒使用者网站速度的重要。值得注意的是 Image Speed Test 提供 Email 订阅功能除了会在网站分析后发送通知,也会每个月定期将新的网站报告寄到你的信箱。

Image Speed Test

STEP 3

检测后就能看到目前的网站效能评分、页面大小和页面载入时间,上方也会有几个建议的调整项目,例如可以降低页面大小来提升载入速度、有几张能使用 WebP 格式来让容量变小的图片等等。

Image Speed Test

从顶端按钮切换桌面或是行动装置的检测结果,通常都是桌面端的成效较佳,如果你的网站流量主要来源是手机用户记得要针对行动版网页进行最佳化,例如降低图片大小、或是减少页面载入的程序,尽可能让请求数减少会是最立竿见影的作法。

Image Speed Test

STEP 4

底下的 Image Optimization Comparison 也是很值得参考的项目,网站会将目前图片和最佳化图片列出比较,包括在图片大小的变化、可节省流量,提示项目也很有参考价值,像是目前图片的尺寸过大建议可以缩小、当前使用的格式建议转换为 WebP 等等。

总归一句话就是尽量让图片尺寸符合一般桌面装置适合的尺寸大小,将格式转为可以使图片容量更小的 WebP(如果浏览器支持的话)。

Image Speed Test

还有一个项目是列出在桌面端、行动装置使用相同浏览器所得到的图片差异,可以看到透过 Piio 可以让每张图片容量变得更小,提升整体的网页载入速度(当然只要把图片尺寸变小、格式换成 WebP 就能获得类似效果),这部份仅供参考,因为也不可能把图片的尺寸变得这么小,不过可以看出就是任何网页的图片都有最佳化空间。

Image Speed Test

值得一试的三个理由:

  1. 填入网址在线检测网页载入速度,更偏重于图片最佳化处理

  2. 可以分析桌面版和行动版网页的载入效能、时间和页面大小

  3. 针对图片进行比较,找出能够调整和最佳化图片建议

声明:Themecho严格遵守国家法律法规,对恶意造谣抹黑国家的违法违规行为零容忍。资料整理自网络,文章不代表本站立场。

发表评论

快捷回复: 表情:
评论列表 (暂无评论,2370人围观)

还没有评论,来说两句吧...