到底什么是「网页体验」? 是怎么衡量的? 我要怎么检查我自己的网站上网页体验的结果以及如何提高并优化SEO等诸如此类的问题,将在这边一次做解答。

什么是「网页体验」?

这应该是第一个会出现在所有正在看本文章的读者们首先想到的问题,「使用者体验」一直是一张包着谜团的糖果纸,不把这个名词仔细剥开检视一番的话,我们很难了解我们到底该怎么改善、或者至少不要改坏我们的网站。或许不少人很直观地把「网页体验」跟以前的「网页载入速度」链接在一起,很可惜的这观念还不足以涵盖Google本次的「网页体验」的内容,让我们引用官方网站的说明:

https://developers.google.com/search/docs/guides/page-experience#signals

google 网站使用体验核心指标报告

google认为网页提供良好的使用者体验,着重于载入、互动性和视觉稳定性等面向:

最大内容绘制(LCP):评估载入效能。为了提供良好的使用者体验,网站应力求在开始载入网页的2.5 秒内完成LCP。

首次输入延迟时间(FID):评估互动性。为了提供良好的使用者体验,网站应力求让FID 低于100 毫秒。

累计版面配置位移(CLS):评估视觉稳定性。为了提供良好的使用者体验,网站应力求让CLS 分数低于0.1。

适合行动装置浏览( Mobile First )

网页适合透过行动装置浏览。您可以使用行动装置相容性测试,检查网页是否适合透过行动装置浏览。

安全浏览
网页不含恶意内容(例如恶意软体) 或不实内容(例如社交工程)。

HTTPS
网页为透过HTTPS 提供。

没有会造成干扰的插页式广告
使用者可以轻松存取网页内容,不受干扰。

2022最新Google演算法更新|网页体验将为SEO带来什么影响与应对-国外网赚博客

「网页体验」的重点

就Google官方提供的说明来看,适合行动装置浏览这个项目就是之前力推的Accelerated Mobile Pages,而安全浏览、HTTPS与插页式广告也都是Google过往强调过的项目,这边就先避免老生常谈,我们把焦点放在第一个的「网站使用体验核心指标报告」上。

众所皆知的网页载入速度其实就跟LCP相关,前者是整个网页载完所需要的时间,而LCP是挑出其中最花时间的部分做测试与评分;FID则是网页中需要与使用者互动的部分,例如表单的「送出」按钮,或者一些「折叠/展开」等,评估当真人与该网页互动时,是否有互动迟缓或者看起来没反应的情况;最后则是人类视觉舒适度的指标CLS。

综合来说,Google对于网页在生成的时候,网页体验的标准是有一个固定的版面排列,里头的媒体档案跟Javascript是经过压缩且大小适中以提升载入速度,最后要能跟真人互动时,有快速回应的结果。

善用Google 工具找出网页体验的问题

Google Search Console

进入我们的Google Search Console,左边的选单现在会多了一个明显提示,告诉我们体验的部分,多了「网站使用体验核心指标」。这个项目

虽然有个提示是很贴心的设计,但是检验的结果、特别是关于结果的说明部分就没有让人很好懂了。下面是一个试跑的结果,只有告诉我们状态是不良,是哪个指标有问题,但是这样子其实也仅能理解一小部分的原因。不过网页体验的LCP、FID与CLS三项指标都会给我们初步的验证结果。

Lighthouse网页分析工具

Lighthouse是内建在Chrome里头的开发者工具,可以从开发者工具中启用它。详细的说明可以参阅https://developers.google.com/web/tools/lighthouse

接着以PChome 24小时购物网站为例,选择「Generate Report」就会针对目前的网址进行检验,最终会直接在Lighthouse呈现网站的检查结果。

像笔者测试的时候,LCP就是属于中等,而CLS就是表现不好的地方。

另外因为是使用Chrome 直接测试的关系,所以CLS会受到测试电脑的Chrome的快取所影响,要重复测试的话记得使用无痕模式,或者清除快取跟图片档案再进行,以获得正确的测试结果。

GTMetrix 网页分析工具

https://gtmetrix.com/同样是采用Lighthouse技术所建置的衡量网站,比Lighthouse做了更多的说明。

另外有了帐号后,也有测试的自动录影可供网站主检查一下是测试中间的网页实际渲染状况跟自己的想象差了多少。

Web Vitals的区块就说明了网页体验的三大指标状况如何,而Top Issues区块则是针对目前的网站里头,最需要解决的前五项问题,若都是Medium-Low的话代表网站的最佳化做得相当不错。

使用架站平台的网站会受到这次Google更新的影响吗?

笔者想这应该也是很多网站主心里头的疑问,毕竟架设网站跟自己是否为一个网站开发者其实并不相同,而这个问题的答案可能会让很多网站主失望,答案是通常会。而且根据笔者长期做网站最佳化的经验,通常使用套装软体如Wix、Weebly等,在Google的SEO标准改变后,都会因为不符合标准而被降低一些排名。这点其实很难避免,毕竟这些套装软体在被开发的时候,新版本的SEO标准也尚未问世,因此采用套装软体架设网站时,最好也把将来维护的问题考量进去。

多方以及多次尝试– 网站的最佳化工程往往需要多方的调整测试,不会是一次就完成收工的开发工作,建议在做改善时,要记得多尝试几次。

注重内容– 虽然本文章介绍的内容较为偏向技术性地介绍关键指标与检修工具,不过网站的内容还是Google搜索引擎与网站使用者们最关心的事情,本站SEO营销最佳化与工具是值得一读的。

验证结果– 当一切的修改都确定完成后,记得要于两周左右后去Google Search Console检查一下网站成效是否真如自己的所预期的有所提升。如果看到有新的问题,也要记得持续改善。