那天晚上十一点，我盯着监控后台，心里咯噔一下。
有个客户在后台留言，说界面乱得一塌糊。
我以为是服务器崩了，赶紧重启，没用。
后来我拿自己手机扫了二维码一看，好家伙。
本来整整齐齐的导航栏，全挤在屏幕左下角。
图片被切了一半，字小得像蚂蚁爬。
我就问那客户，您用啥设备访问？
他回了个语音，背景音还挺吵，说是地铁上看的。
我当时就无语了，这要是放现在，早就打人了。
但这事儿也让我明白，建设网站怎么判断是电脑还是手机，真不是加两行代码那么简单。
以前我觉得，做个网页只要电脑看着顺眼就行。
直到后来发现，百分之八十的人都是用手机逛。
这时候你再不搞清楚，建设网站怎么判断是电脑还是手机，那就等着哭吧。
其实方法挺多的，但我推荐最简单的，就是看设备宽度。
但这还不够，你得懂响应式。
就是让网站像水一样，装进哪个杯子就变啥形状。
而不是死死地固定在一块屏幕上。
我当年用的那种老式方法，是写两套代码。
一套给电脑，一套给手机。
听着挺高大上，实际上维护起来真要命。
每次改版，两边都得改，改错一个就是Bug。
后来我学了用CSS媒体查询。
这个玩意儿就是专门干这个的。
它能识别你当前屏幕是多宽。
宽了，就显示大图，侧边栏展开。
窄了，图片压缩，导航藏进汉堡菜单里。
这样既省事，体验也好。
当然，现在更先进的做法是直接上响应式框架。
比如Bootstrap之类的。
但这也不是万能药，你得自己调样式。
不然出来的东西，千网一面，没个性。
这里有个小细节，很多人忽略。
那就是手指点击区域的大小。
电脑上用鼠标，指针细，点哪儿都行。
手机上全是肉手，手指头粗。
你非把按钮做得那么小，让用户戳半天戳不准。
这体验简直灾难。
所以，建设网站怎么判断是电脑还是手机，其实是在判断用户的操作习惯。
电脑用户喜欢精确，手机用户追求速度。
你不能把一个给程序员用的后台，原封不动搬到手机上。
得做折叠，做简化。
还有图片加载也是个坑。
电脑上几张高清大图没感觉。
手机上要是几M的图，加载半分钟。
用户早跑了，连你网站长啥样都没看见。
所以判断设备后，还得动态加载不同质量的图。
手机用压缩版，电脑用原图。
这就叫因地制宜。
我还遇到过一种情况，有些平板用户。
他们既不像手机那么小，也不像电脑那么大。
这时候就得搞三套方案。
或者用百分比布局，让它自动适应。
总之，别死磕一种写法。
得多测，真得多测。
我自己现在每次改完代码，都要拿不同尺寸的手机试。
有老的iPhone，有各种安卓神机。
有的屏幕是圆角，有的是挖孔。
别小看这点像素差异。
有时候文字稍微溢出，体验就差了十万八千里。
记得有次，我在地铁上测试。
信号忽好忽坏，页面加载特别慢。
要是这时候网站还转圈圈，没个进度提示。
用户心态直接爆炸。
所以还得加个加载中的动画。
这虽然小，但显得很贴心。
说到底，技术是冷的，但人心是热的。
你考虑到了用户的不便，他们能感觉到。
建设网站怎么判断是电脑还是手机，这个问题看似技术，实则是服务。
别只顾着自己写得爽，得让客户看得爽。
现在我也养成了一个习惯。
下班回家，先拿老婆的手机试试自家网站。
她要是皱眉，那肯定有毛病。
她要是觉得挺流畅，那才敢上线。
这就叫最真实的用户体验测试。
比那些专业的跑分软件都管用。
毕竟，他们才是真金白银买单的人。
我也踩过不少雷，花了冤枉钱请外包。
结果对方完全不懂手机适配，交上来的东西根本没法用。
后来我自己琢磨透了，发现也没多难。
核心就是那句话，用户在哪，你就在哪。
别高高在上教用户适应你。
得让你去适应用户。
这大概是我这几年做网站，最大的感悟。
不多说了，我得去修个Bug。
刚才发现iPad上看，那个视频播放器有点偏。
得赶紧调调，不然又得挨骂。
生活嘛，就是在不断找错，改错中度过的。
只要你用心，用户是能感受到的。
别嫌麻烦，细节才是魔鬼。
也是天使。
希望这篇文章能帮你避避雷。
要是你还不懂建设网站怎么判断是电脑还是手机。
那就先去多逛逛那些做得好的网站。
看看人家是怎么处理细节的。
模仿，也是学习的开始。
加油吧，各位站长。
