Small details, big calm
想做出 Apple 感,页面细节应该盯哪些地方
当页面足够克制时,任何一个过重的阴影和多余的按钮都会立刻破坏整体气质。
界面细节·2026.04.15·5 min read
TypographySpacingUI
先把字体和宽度关系调顺
一个页面高级与否,很多时候第一眼取决于文字。标题的字距、正文的行高、段落之间的间距、列表摘要的宽度,这些决定了页面是否像在认真说话。
博客比产品官网更依赖排版,因为用户停留时间更长。阅读宽度、节奏和页面呼吸感,比任何视觉特效都更重要。
边框应该像空气,不应该像格子纸
Apple 系网页面的边框通常只是为了帮助分层,而不是为了强调模块存在。它们轻、薄、透明,更多时候像一层秩序,而不是一道围墙。
如果边框太重、阴影太黑、卡片太密,页面会瞬间从克制走向拥挤。你会发现信息都在,但气质已经不见了。
高级感往往不是来自于你加了什么,而是来自于你忍住了什么。
交互反馈要轻到像呼吸
悬浮时轻微抬起、按钮颜色微调、导航背景轻轻模糊,这些已经足够传达精致。再复杂的动画如果没有服务信息层级,反而会显得刻意。
- Hover 位移建议在 2 到 4 像素之间。
- 阴影只要暗示层级,不要制造压迫感。
- 动效持续时间保持短促,避免拖泥带水。