学习网站颜色 Color & Learning
编辑精选 · 每周更新

把学习放进对的颜色里,注意力自然会回来。

我们不太相信「效率工具能救你」这句话。但我们的确相信,一处偏暖的米白、一盏低饱和的台灯色、一个不刺眼的强调色,能让一个人多坐十分钟。学习网站颜色,就是把这些细碎的观察收集起来的地方。

暖色调书桌与摊开的笔记本,窗外光线柔和
一张偏暖的桌面,往往比一套复杂的计划表更容易让人坐下来。
Featured

三篇我们反复推荐给新读者的内容

不是最热的三篇,是我们自己会回头再读的三篇。它们分别关于界面底色、笔记留白,和灯光。

笔记本与咖啡杯置于木质桌面,光线温和
界面底色

为什么米白比纯白更适合长时间阅读

纯白会放大屏幕亮度与文字边缘的对比。把底色调到 #fbf7ef 这一档,眼睛的紧绷感通常会在二十分钟内缓解。

展开这条线索 →
钢笔在纸上书写,桌面有散落的纸张
笔记留白

留白不是浪费,是给回想留的位置

我们整理了一批笔记排版样本,结论很朴素:页边距越宽,复习时写批注的意愿越高。颜色只是把这件事说清楚。

看排版建议 →
图书馆书架与暖色灯光
环境光线

色温比亮度更影响你坐多久

把灯调到 3000K 左右,人更容易进入「能待住」的状态。这条经验来自很多次深夜书桌前的小实验。

五期龙 · 相关记录 →
Six Moods

六种情绪,六组配色,挑一个你今晚用得上的

我们按「此刻想做什么」来分类,而不是按色号分类。先找到情绪,颜色会自己跟上。

01

想安静下来读长文

低饱和的米白底、深棕正文,强调色只出现在小面积。信息密度可以高,但对比度要收着。

02

要在两小时内做完一件事

适度提高强调色的占比,让「当前任务」在视野里始终有一块亮色。但别超过页面面积的十分之一。

03

复习旧笔记,想找回记忆

用偏暖的黄褐做区块分隔,让「上次写过什么」在翻页时自然跳出来。颜色在这里充当书签。

04

深夜写作,不想被屏幕刺到

整体压暗,只用一点暖黄做层级。文字不要纯白,留一点灰度,眼睛会感谢你。

05

整理资料,需要清晰的分类感

同一色系做明度阶梯,而不是用五种不同的颜色。分类靠深浅,不靠红绿蓝。

06

给自己做一页学习仪表盘

留出大块空白,数字用重色,趋势线用点缀色。仪表盘的第一要务是让人一眼看到「现在」,而不是看到全部。

How to Use

三条使用指南,两条小贴士

我们尽量把话说短。下面这些方法都不需要额外工具,今晚就能试。

先定一个主色,再谈其他

打开任何一个学习页面或笔记模板,先只问自己一件事:主色是什么。定了主色,其余颜色都只做深浅变化。大多数「看起来乱」的界面,问题不在于颜色太多,而在于没有一个能站住的主色。

让强调色只承担一个任务

点缀色最容易被滥用。约定它只负责「当前要做的事」:一个按钮、一条下划线、一个编号。如果同一个页面里它出现了五次以上,就说明该收回去了。

用对比度检查,而不是用眼睛猜

正文与底色的对比度尽量保持在 7:1 以上,辅助文字也不要低于 4.5:1。这不是审美问题,是能不能连续读四十分钟的问题。统计局的公开可读性资料里也有类似的说法。

Editor's Note

编辑手记:我们花了很久,才承认颜色是内容的一部分

最初做这个站,只是想把散落在各处的配色笔记收一收。后来发现,读者来的理由并不是「想学配色」,而是「最近坐不下来」。这两件事看起来无关,但在很多来信里,它们是同一句话。

所以我们调整了写法。不再列色号清单,而是先描述一种处境:晚上十点,桌上摊着三份资料,你想继续但眼睛已经开始发酸。然后再说,这种情况下,底色应该往哪个方向调。观点是有的,但我们尽量把它放在观察后面。

关于内容的选择,我们有一个不太效率的标准:如果一篇文章我们自己不会在周末重读,就不放上来。这也是为什么这里的更新不快。有些题材看起来更「热门」,比如某些连载与站点入口的整理——小夫妻被邻居大叔盯上、漂亮玩偶拍卖会by深海熔岩——我们只做必要的索引说明,不替读者做判断。

编辑这件事,说到底是在替别人先读一遍。颜色也一样:我们替你先看一遍,告诉你哪一档不刺眼,然后你自己决定要不要用。

— 学习网站颜色 编辑部 · 写于一个把台灯调暗的下午

靠窗的书桌,暖色台灯与笔记本,窗外是傍晚的天色
编辑部常用的那张参考图:暖光、木色、大留白。没有一样是「学习工具」,但每一样都在帮人坐下来。

写信给我们:说说你的书桌是什么颜色

我们每周会挑几封来信,回一封长一点的。不用写得工整,讲讲你现在用的底色、灯光的色温,或者只是最近读不进去的那件事。

本页为静态演示,表单不会真正提交;我们不会保存你的地址。