先建立视觉层级，再谈风格

有些网站的字体、颜色和图片单独看都不错，组合起来却依然像未完成的半成品。问题往往不在风格，而在于页面让太多元素拥有了相同的视觉重要性。

视觉层级回答的是一个简单问题：视线下一步应该去哪里？

先画出注意力地图

针对每一屏，明确用户最先注意到的三个内容。一个典型首屏可能是：

1. 产品承诺
2. 支撑承诺的证据
3. 主要行动按钮

如果导航、装饰图、标签、次要按钮和功能名称都在争夺注意力，那么无论配色多精致，页面都会显得嘈杂。

用少数可靠工具建立层级

大小决定主次。与其使用许多略有差异的标题尺寸，不如设定一个明确的主标题尺度。

对比区分主要信息和辅助信息。对比可以来自颜色、字重、尺寸，也可以来自周围留白。

间距负责分组。更大的间距应该代表更大的概念分隔。

宽度影响阅读重点。较窄的文案区域更集中，过宽的文案容易退化成背景纹理。

密度决定节奏。紧密的信息组带来能量，开放的区块则提供专注和停顿。

暂时移除装饰再测试

先去掉渐变、阴影、动画和大图。如果页面在灰度状态下仍然能够清楚表达结构，说明视觉层级基本成立。

还可以做一个五秒测试：移开视线，再看页面五秒，然后写下记住的内容。如果这些内容与页面真正的业务重点不一致，就应该先调整层级，而不是继续增加润色。

在提示词里明确谁应该胜出

不要只写“做一个现代 SaaS 首屏”，可以直接规定注意力顺序：

标题是第一视觉焦点。
产品预览负责支撑核心承诺，但不能与标题竞争。
只保留一个主要按钮，让次要导航保持安静。
把证明信息放在主要行动之后，形成独立节奏。

这样写相当于给开发者一个决策框架。后续的风格可以强化结构，而不是承担创造结构的任务。

真正有说服力的页面，并不是效果最多的页面，而是让重要信息显得顺理成章的页面。