断点不是越多越好
响应式UI的核心在断点，也就是界面在什么宽度下重新排列。常见做法是三个断点：大于992像素走桌面版，768到992走平板版，小于768走手机版。成都正经前端都这么切，没必要设七八个断点，那是给自己加戏。双流区一家做调味品批发的小罗，之前找的团队设了6个断点，结果平板横竖屏样式打架，返工花了两周。说白了，三个主流断点覆盖九成设备，多出来的都是维护负担。
手机端先想拇指够不够得着
手机屏上，底部和右上角是拇指友好区，关键按钮放这。导航在手机上别横排，叠成汉堡菜单最稳。我们测过武侯区一家做少儿英语的官网，报名按钮原在屏幕右上角，手机上误触率很高，移到页面底部固定栏后，手机报名提交量当月多了62%。别被忽悠了，PC端好看的交互搬到手机上经常反人类，得重新设计。
图片和字号要跟着变
同一张图，桌面端用大图，手机端换小图省流量。成都本地节点加响应式图片标签，手机流量能省将近一半。字号也有讲究，手机正文至少16像素，低于14像素老年人直接看瞎。成华区建设路一家做养老服务的刘总，官网手机版正文原是12像素，长辈根本读不动，调到17像素后，电话咨询量涨了28%。踩过坑的人都知道，响应式不是把东西缩小，是重新排兵布阵。
表格是最难搞的
产品参数表在手机上最容易崩。解决办法是把横向表格转成卡片式，每行变一张小卡。高新西区一家做电路板的老周，上百行的规格表在手机上原本要左右拖，改成卡片后，销售跑客户直接手机展示，都说比翻PDF方便。这个改造多花800元，但老周说比印宣传册省事多了。
验收拿三样东西试
电脑、平板、手机各开一遍你的官网，文字不挤、按钮点得中、图不变形，就算过关。郫都区一家数控设备厂，当初靠这招试出平板上一行字被截半截，当场要求返工，省了后面一堆麻烦。天府软件园有团队提供真机云测，几十款机型同时跑，老板花两三百块就能拿到适配报告，比自己瞎猜强。
真机测试别图省
都江堰一家做民宿的团队，官网在自家苹果机上挺顺，发到安卓千元机上首页大图错位，老板退改多花900元。说白了，真机测试和肉眼看两码事。成都本地有云测服务，花两百多块跑几十款机型，比上线后返工便宜十倍。别省这步。