做网站，先别管花哨设计。第一件事：让手机用户能正常看。现在一半以上流量来自手机，页面在手机上错位、字小得看不清，用户三秒就关。

怎么开始？写HTML时加一行viewport标签。这行代码告诉手机浏览器：按屏幕宽度来渲染，别缩成一个迷你版网页。不加这行，后面全白搭。

布局别用固定宽度。以前流行960像素定死，手机上直接溢出。现在用百分比或弹性盒子。更省事的是CSS Grid，几行代码搞定自适应。比如三栏布局，大屏并排，小屏自动堆叠。写一次，各种尺寸都稳。

图片是重灾区。一张两兆的大图，手机加载半天。用srcset属性给不同屏幕准备不同尺寸的图。小屏加载小图，大屏加载大图。再配上懒加载，滚到哪加载到哪，首屏速度立马上去。

字体别写死像素。用rem单位，根字号随屏幕变。手机上16像素正文够用，平板18像素，别让人眯眼。按钮和链接的点击区域至少44像素见方，手指点得准。

媒体查询是核心工具。但别写太多断点。三个够用：手机、平板、桌面。先写手机样式，再逐步加宽。这叫移动优先。反过来做，你会花大量时间覆盖旧样式，越写越乱。

测试别只在电脑上缩窗口。真机上手滑一遍。安卓和苹果各试一台。重点看导航菜单、表单输入、横向滚动条。这三个地方最容易翻车。

导航在手机上别硬塞。汉堡菜单是标配，点开全屏显示。表单输入框字体至少16像素，不然苹果手机会自动放大页面，用户体验极差。

还有，别追求完美适配所有设备。抓住主流尺寸，留点余量。网站是用的，不是拿来炫技的。