网页布局的基础是对齐，它默默支撑着整个页面的秩序。就像阅读习惯那样，“左对齐”是最常用的方式。我们有90%的中文网页正文采用左对齐，因为这符合我们从左到右的阅读习惯。左对齐可以把视线引导得很顺畅，像翻书一样自然。左对齐留出空白给阅读，右侧也能留白供视线流动。 《写给大家看的设计书》里提到，任何元素都不该随意出现在页面上，“对齐”就是决定这个的核心。对比、重复、亲密性之外，“对齐”是让页面先整齐再好看的第四大支柱。配色虽然炫目，但是“对齐”能在0.3秒内决定用户是留下来还是离开。 居中对齐在HTML5时代重新受到青睐。比如苹果官网用这种方式提升层次感。但请注意，如果字数超过两行就容易降低可读性，需要搭配行距和色块来改善。 右对齐通常用于小面积的区域，比如登录框和底部导航。登录提示文案和输入框形成右-左流向时，整体感会更强。但大面积右对齐会让内容显得漂在页面上，除非有特别戏剧化的字体或颜色处理。 ZUI主页的设计就是一个很好的例子，搜索图标和分类图标全部居左对齐排列得整整齐齐。元素散落就会导致界面从简洁变得杂乱无章。 当当网图书页是处理图片和文字混合布局的好范例。当产品以列表形式展示时，图片左对齐而文字右对齐；而大图模式下，图片居中而文字环绕。这种灵活运用三种对齐方式的方式能让视觉更有节奏。 产品展示页容易出现混乱是因为按钮错位或卡片错位。使用栅格系统能让每个元素都按规则排列好。在栅格系统中每一列和每一行都有参考线引导视觉流程。 视觉流程就像坐电梯一样：第一眼看到居中焦点，第二眼顺着右对齐提示滑到下方按钮，第三眼回到左对齐完成闭环。这种层次感可以让信息架构一目了然。 设计要先注重内容再考虑美观，“对齐”是给信息排座位的一种方式。记住这三句话：内容为主，对齐为辅；小元素靠重复，大区块靠栅格；层次靠对比，节奏靠对齐。熟练掌握基本对齐技巧并结合不同场景就能在0.3秒内赢得用户好感，并降低他们在后续浏览中的认知负荷——这才是设计真正的省力化。