CHAPTERS
课程章节目录
八个章节带你从栅格到响应式，系统掌握官网排版的底层逻辑与实战技巧。
01
排版的本质：信息层级与阅读动线
排版不是摆元素，而是规划用户的阅读路径。理解 F 型、Z 型动线，用层级引导视线自然流动到关键信息。
02
栅格系统深入：12 栏与自定义栅格
栅格是排版的骨架。掌握列、槽、安全边距的设定，学会根据内容密度自定义栅格，让多页面保持统一节奏。
03
首屏设计：三秒抓住用户注意力
首屏决定留存。拆解主标、副标、主视觉、行动按钮的排布逻辑，用视觉焦点在三秒内传递核心价值。
04
留白节奏：用空间塑造高级感
留白不是浪费，而是呼吸。学习模块间距、元素内距的层级递进，用空间关系暗示信息分组与重要性。
05
文字层级：标题正文与引用的阶梯
从 H1 到正文、辅助文字，建立清晰的字号字重阶梯，让信息主次一目了然，长内容也耐读不累。
06
图文混排：图片尺寸与对齐策略
图文关系的处理直接影响质感。掌握图片比例统一、左右图文布局、网格画廊的对齐与裁切原则。
07
多栏与分栏布局实战
企业官网常见的服务列表、案例矩阵、数据看板如何分栏排布，兼顾信息密度与可读性的平衡。
08
响应式排版：从桌面到移动的适配
断点选择与版式重排策略，让同一套内容在桌面、平板、手机上都保持良好的层级与可读性。