很多老板以为，网站手机上能打开就算响应式了啦。差得远。

响应式网站，说白了就是同一套代码，在电脑、平板、手机上都能正常看、正常用。不是缩放一下、挤一挤就完事。下面几点，做的时候得盯住。

一、先想清楚用户主要用什么看

别上来就做。先看数据：你的客户是电脑多还是手机多？如果是卖货的，手机大概率占大头。那就先把手机端想明白，再往大屏扩展。反过来做，手机端往往被挤得没法看。

二、别让元素“硬挤”

固定宽度是大忌。写死一个800像素的图，手机屏幕才375像素，要么溢出，要么缩成一条线。图片、表格、视频，都得能跟着屏幕变化。表格尤其麻烦，手机上最好改成纵向排列，别让人左右划。

三、手指不是鼠标

电脑上点一个小叉没问题。手机上手指头粗，按钮太小根本点不准。可点击的东西至少要有指甲盖那么大，间距也得拉开。链接挨太近，用户点错一次就烦了。

四、加载速度是命门

手机网络不比电脑，地铁里、电梯里都可能断。图片别传原图，压一压。视频能不用自动播放就别用。字体文件也别贪多。慢一秒，用户就跑一批。响应式不是光看布局，速度跟不上照样白搭。

五、测试别只在电脑上模拟

浏览器的手机模拟器看着挺像，真机上一用就露馅。不同手机屏幕比例不一样，刘海屏、折叠屏、老款小屏，都得真机过一遍。尤其安卓机型杂，多试几台不吃亏。

六、导航要简单

电脑上横着一排菜单挺清爽。手机上塞不下，就得收起来。汉堡菜单可以，但里面层级别太深。点开再点开再点开，用户早迷路了。常用入口尽量放在第一层。

七、弹窗别乱弹

手机上屏幕本来就小，一个弹窗糊上来，全挡住，关掉按钮还找不到。非必要不弹。真要弹，关闭按钮做大点，别跟用户捉迷藏。

八、文字别太小

电脑上12号字勉强能看，手机上就是折磨。正文至少16像素起。行距也得松一点，密密麻麻一坨没人愿意读。

响应式不是做完就完事，是做完之后还得反复试。拿自己的手机试，拿同事的手机试，拿家里老人的手机试。能顺顺当当看完、点完，才算过关。