最近接了个电商网站的活儿，甲方非要我亲自操刀产品展示页。本来想着不就几张图配几行字嘛结果干起来才发现全是坑。今儿就跟大伙唠唠我踩雷的五个细节，你们可别学我憨憨地闷头就干。

一、图片懒加载没整好

打开PS闷头干了三天，堆了二十多张产品高清大图。测试时候电脑跑得呼呼响，还挺美。结果甲方用手机打开直接白屏五分钟！气得客户在群里骂街："加载个锤子！"赶紧把图全扔进tinypng压到200K以内，给每个图加上loading="lazy"。现在滑到哪张加载哪张，老手机也不卡了。

二、颜色搭配翻车现场

想着要高大上，主色调选了深蓝配亮金，产品图背景整成纯黑。发给朋友预览，人直接回我："你这页面是卖骨灰盒的？"连夜重搞，产品图全换成白底，按钮从土豪金改成蒂芙尼蓝。改完甲方才"之前黑背景看得我密恐犯了。"

三、字体大小抽风

14px正文字体在27寸屏幕上挺美，拿自己手机一看——好家伙！得拿放大镜瞅！吭哧吭哧给所有文字加了相对单位rem，正文调到1.2rem。现在平板竖着看也不挤，电脑全屏也不虚。改完发现老花眼的会计大姐能看清参数表了，追着要给我发红包。

四、按钮藏得比地雷深

"立即购买"按钮做成幽灵按钮，就一圈线框飘在角落。运营经理打了三分钟电话咆哮："客户说找不到下单入口！"赶紧加粗按钮到48px，塞进亮橙色底色。改完第二天数据涨了30%，运营小哥蹲我工位前剥了根香蕉递我。

五、响应式变痴呆式

以为媒体查询写全了，结果用折叠屏手机打开——产品图挤成面条，价格标签叠罗汉。连夜对着十台设备调试，发现华为折叠屏展开时，图片横着溢出屏幕两公里！硬是写了六个断点才搞定。现在从手表屏到投影仪都能看，甲方老板拿着折叠屏划拉半天，终于露出姨母笑。

这单干完最大的教训就是：千万别信甲方说的"简单弄弄就行"。每个细节都得往死里抠，抠到手机没电还得借充电宝接着抠！