SEO技术篇之：网页秒开，留住用户快人一步、白皮书 4.0 专题解读

　　网页几秒钟就能打开，比留住用户早了一步。解读手机白皮书4.0。通过研究发现，大部分网页加载缓慢是由于其他网页资源耗时过多，图片尺寸过大造成的。首屏加载时间要在1.5秒内完成，会导致用户流失。

　　据百度搜索用户大数据了解，用户对于网页打开速度的要求越来越高，主屏幕的加载时间最好能在1.5秒内完成，加载时间过长会导致用户流失。

　　通过研究发现，大部分网页加载慢是由于网页其它资源耗时过多及图片体积过大造成，下面总结了部分网页速度优化方法给大家参考。

　　福利环节

　　如果你想要学习更多的SEO优化技巧，可以从我的专栏中找到更多的干货文章，想免费领取资料的朋友请看下文

　　获取资料方式：

　　渠道1：微信seobst

　　渠道2：公众号爱学SEO

　　现如今很多网页都包含一些无用的文件资源，不但影响网页加载速度，而且还不能给用户带去价值，因此建议定期清除网页中一些无用的资源，避免给网页加载速度带去影响。

　　将首屏中必要的JS代码先拆分出来，便于提前加载，达到缩减首屏加载时间的目的，其它的JS代码则按照按需加载或置后加载的方式，建议将首屏JS代码放在首屏渲染之后，body标签关闭之前。

　　JS文件在允许修改的同时，也会阻止DOM构建，阻塞页面渲染，可考虑使用defer方式或async方式让JS文件可以异步执行加载，删除关键渲染路径中一些不必要的JS文件。

　　默认情况下，JS文件会阻塞网页解析时间，延长网页首屏加载时间，异步JS资源执行方式不会阻塞网页解析时间，可考虑选择在首屏渲染后异步加载脚本。

　　网页CSS资源会阻塞网页内核渲染，大兵建议精简网页CSS资源，让网页首屏可在最短时间完成CSS加载，把重要的CSS资源放在网页head标签内，达到缩短首屏渲染时间的目的。

　　CSS资源是渲染网页的必备文件，在渲染网页时，应确保将非必要CSS资源都标记为非关键资源，并尽可能减少网页网页CSS资源的数量。

　　本地图片体积过大会导致小程序包体积过，延长首屏加载时间，因此建议尽可能将图片体积缩小：

　　（1）对于不需要透明背景的图片，建议用jpeg格式来代替png格式；

　　（2）安卓移动端图片格式建议选择webp格式，webp格式在有损压缩的情况下，不会察觉图片压缩前后有变化，但图片体积却大大缩小了；

　　（3）确保小程序包中没有无用的图片资源；

　　（4）设置延迟加载不重要的图片文件，在小程序必要图片加载完成后再加载不重要的图片；

　　（5）使用第三方工具对图片进行有损压缩。

　　（1）对于部署cdn加速服务器上的图片，也建议压缩；

　　（2）通过cdn服务器获取的图片资源，建议添加图片压缩规则;

　　（3）使用第三方压缩工具对于压缩后，再上传至cdn服务器。

　　图片image组件的mode属性向开发者提供了13种模式，widthFix模式就属于其中一种，由于widthFix模式需要动态计算图片宽度，导致网页尺寸重绘，因此建议大家谨慎使用mode属性的widthFix模式。

　　JPEG图片格式先展示图片模糊轮廓，随着加载扫描次数的增加，图片越来越清晰，对于拥堵的网络环境作用比较大，也在一定程度上提升了用户体验。

　　为了保障良好的用户体验，给予优质站点更多的展现机会，百度搜索于2017年上线了“闪电算法”。

　　要求移动端网页可在2秒时间内完成加载，在此时间内完成加载的站点将会获得流量倾斜，同时网页首屏加载时间超过3秒钟，将会被惩罚。

　　首屏是用户打网页的第一屏，重要性肯定是不言而喻的，根据《百度移动搜索白皮书4.0》提出，要求首屏要在1.5秒内完成加载，百度搜索“闪电算法”可参考拓展阅读第2条。

　　在移动互联网时代，用户越来越没有耐心，对于网页加载速度也是越来越高，根据相关数据表明，页面放弃率和页面加载时间关系如下图所示：

　　总结，网页加载打开速度对于用户体验有着很大的影响，提高网页加载速度才是开发者要追求的目标，例如可以使用加速方案如MIP、AMP），对于整体网页进行加速。

　　拓展阅读：

　　1、wordpress加载速度很慢,wordpress优化速度教程

　　2、解读百度闪电算法打击了什么网站