跳到主内容
笔记 Article

为什么极简设计更难做

删掉一个元素比加上它难十倍。极简不是「少做」,而是把每个保留的元素都逼到无法再删。这篇记录我在做视觉主题时反复回炉的几次判断。

2 分钟阅读 0 次浏览

极简的难,在于没有东西可以藏

加法设计有一个天然优势:出问题的地方总能被新元素盖住。留白不够?加个分割线。层级不清?加个底色块。信息太空?加点装饰纹理。

减法设计把这些退路全部堵死了。当页面上只剩标题、正文和一条细线时,任何一处间距错了 4px,读者都能立刻感觉到「哪里不对劲」,却说不出是什么。

三个反复回炉的判断

一、这条分割线到底在解决什么问题

我曾在每个区块之间都放一条 1px 细线。看起来整齐,但问题是:它只是在掩盖间距不当。

后来我把所有分割线删掉,只靠 padding 建立节奏——相邻区块 48px,父子区块 24px。删完之后页面反而更清楚了。现在保留下来的分割线只有一个用途:标识语义上的断裂(比如正文结束、进入相关推荐)。

二、圆角 14px 还是 10px

这看起来是个无关紧要的选择。但当成百个卡片、按钮、输入框共享同一个半径时,它决定了整站的气质:

  • 6px — 偏工具、偏文档,像一份报表
  • 14px — 温和,适合内容站
  • 18px+ — 偏消费级产品,视觉上更「软」

我最后定在 14px,因为这套系统的正文阅读占比很高,太硬会让人紧张。

三、动效要不要做

我的结论是:默认不做,除非它承担信息。

上浮(translateY(-2px))能告诉用户「这个卡片可点」,这是信息。整页淡入只是让人多等 300ms,这是噪音。所以现在全站动效只保留了两类:hover 反馈、以及主题里站长显式开启的入场动画(且遵守 prefers-reduced-motion)。

一个可操作的检验方法

做完一版设计后,把页面缩到 30% 看。如果这时还能一眼看出主标题、正文块、操作按钮三者的层级,说明结构是成立的;如果糊成一团均匀的灰,说明你在用装饰代替结构。

极简的终点不是「看起来干净」,而是「每个像素都在工作」。

落地到这套系统

这也是为什么主题引擎里,所有视觉参数都做成了可回退的默认值:

  1. 默认主题下,背景不生成任何 background-image;
  2. 毛玻璃关闭时,卡片连 data-theme-glass 属性都不渲染,避免多余合成层;
  3. 入场动效默认 none,零性能开销。

「不做」必须是默认状态,这样站长想加的时候,加上的每一样都是主动选择。

雄

雄哥

独立开发者 · 长期写作者

关于