网站设计手机端和电脑端，不是放大缩小那么简单

      裁缝做衣裳讲究量体裁衣，同一块料子，给两个人做，剪法能差出十万八千里。手机端和电脑端的关系，就是这么回事。

很多人以为响应式就是把页面等比缩放，电脑上好看，手机上小一号照样好看。真拿手机打开一看，字挤成一团，按钮细得点不中，表格横着拖出去半米。这谈不上设计，就是偷懒。

两端的用法，本就不在一条道上

电脑前面的人，多半坐着，有耐心，愿意翻。他能同时看导航和内容，鼠标悬停还能出二级菜单。手机上的情况反过来，人在路上、在等电梯、在饭桌上，一只手拿着，拇指够得到的就那么一块地方。他的注意力可能只有十几秒。

排序得跟着变，这一关绕不过去。专做网站设计这行的人，心里要有一本账。电脑上放右上角的电话，到了手机上得拿出来做大按钮固定住。电脑上三列的卡片，手机上必须竖过来一个个码好。电脑上点开才显示的详情，手机上最好直接摊开，别让人再多点一次。

几个最容易翻车的地方

      表格和对比图是第一大坑。电脑上是几列并排，手机上装不下。处理办法是手机上改成一行一条的卡片式，或者只留最关键的两列，剩下的折叠起来。

长文案也是。电脑屏幕一行能放三四十个字，读着不累；手机上一行十几个字就换行，段落一长，看着就是黑压压一片。得拆，把长段落切成短句，每段两三行。

字体也算一处。不少站在电脑上用十三四号字，手机上直接原样跟过去，小得跟蚂蚁似的。手机正文怎么也得十六号起步，行距给足，别省那点高度。

在电脑上想，在手机上定

到这步，顺序可以反过来用：先在电脑上把结构和层级定下来，再拿真机去修这一端。别用浏览器的模拟器看，那种缩放视图骗人，拿你手上真实的手机刷一遍，在电梯里、在地铁上刷一遍，问题自己会冒出来。

临交付前，有个简单的自测法：单手拿手机，拇指能不能够到主要按钮；把屏幕调最暗在太阳底下看，文字还认不认得清；在地铁进隧道网断了的瞬间点一下，页面崩不崩。这三条过不去，就得回头改，网站设计上偷的懒，用户一上手就摸得出来。

话说到最后，两端各是一套取舍，套同一张皮迟早出洋相。舍得在手机上删东西的设计师，才算真的想明白了。屏幕小的那端，往往才是决定成败的那端。