为长期写作设计一套阅读界面

文章页通常有两项看似冲突的任务：第一眼要有辨识度，真正开始阅读后又要尽量安静。解决方法不是把所有区域做成同一种风格，而是让首屏负责建立语境，让正文负责维持节奏。

首屏先回答三个问题

读者进入页面时，需要很快知道：这篇文章讲什么、需要多久、是否值得继续。标题、摘要、封面和发布时间因此被放在同一个视觉区域，而分类与标签只作为辅助线索。

信息	作用	视觉权重
标题	建立主题	最高
摘要	说明范围	高
封面	传达气氛	高
日期与时长	管理预期	中
标签	提供关联入口	低

动效只提示状态

封面的轻微缩放、光线扫过和标题光标都在传达“页面是活的”，但它们不应该抢走注意力。系统开启“减少动态效果”后，这些动画会被关闭，内容仍保持完整。

正文需要稳定的尺度

长文区域限制在适合阅读的宽度，行高略微放松，并让二级、三级标题形成清晰层级。代码、引用和表格可以拥有自己的底色，但不脱离同一套间距规则。

阅读体验不是某一个漂亮组件，而是几百个字之间没有突然出现的阻力。

正文与目录采用两栏结构。宽屏下目录固定在视口侧边，帮助读者理解位置；窄屏下直接隐藏目录，把有限空间完整留给文章。

用真实内容检验设计

只放两行占位文字，很难发现排版问题。测试文章应该主动包含以下内容：

• 长短不同的标题与段落；
• 中英文、数字和行内代码；
• 多级标题、引用、列表和表格；
• 在手机上可能换行的标签；
• 足够长的正文，用来验证阅读进度。

克制也是一种功能

当读者滚动到正文，深色首屏结束，背景切换为更明亮的阅读区域。视觉上的转场明确告诉人们：介绍已经结束，现在可以专心读下去。设计没有消失，只是退到了内容后面。