上周帮一个做外贸的客户看手机站，版式其实挺工整，可首页在流量环境下要等七八秒才出全内容。一查，首屏那张背景图压缩前有两兆多，是直接原图传上去的。很多人把移动端适配理解成排版的事，其实加载速度同样属于适配，手机网络再快也有波动，图片不减负，版式做得再漂亮也是白搭，访客根本等不到看。尤其是外贸行业，海外客户很多还挂着不快的网络，慢一秒就多流失一成。
图片是手机端最大的拖累
网页里让手机变慢的东西，图片通常占大头。同一张图在电脑大屏上看着清晰，手机屏幕物理尺寸就那么大，两兆的原图和三百 KB 的压缩图在视觉上差别很小，加载时间却差出好几倍。手机上访客的耐心以秒计算，多等一秒，走掉一批。还有格式问题，新一代的图片格式比传统 JPG 小三成左右，建站时用了哪种格式，直接决定手机端的打开速度。这些在选择系统的时候就要问清楚，事后想换格式，等于把全站图片重做一遍。
响应式图片是怎么回事
- 手机只加载裁切过的小图，桌面端再用大图，各取所需，互不拖累。
- 背景大图换成视频前先掂量掂量，视频的体积是图片的十倍起步。
- 首屏之外的图片等滚动到附近再加载，打开时省下大量流量和时间。
- 列表页缩略图和详情页大图分开出图，别用一张图包打天下。
这三招在建站行业里叫响应式图片加懒加载，成本低、收益明显。可惜不少低价模板站为了赶工期，图一传上去就是原尺寸，手机端的打开速度可想而知。这两种做法不挑系统，老站也能补装，属于性价比极高的一类优化。
该关掉的都关掉
除了图片，手机端还应该少开特效。大面积的视差滚动、自动播放的背景视频，电脑上看着炫，手机上全是负担，流量、电量、性能三头吃亏。真要做动效，挑轻量的，加载完再动，别让首屏背着特效跑。
给两条实在建议
第一，验收时用手机流量而不是无线网打开新站，截图页面测速结果，首屏超过五秒就要求优化。第二，网站上线后自己运营，传图前先压一遍，把图片压缩当成移动端适配的标配动作，养成习惯。顺手再定一条规矩：超过五百 KB 的图不许直接上传，谁传谁压缩。比格网络交付项目时会把压缩和懒加载做成默认配置，你也可以把这条写进自己的验收要求里，一并卡住。速度这东西没有一劳永逸，图片多了就回头查一遍，几秒钟的事。
