测试｜一个轻量内容站的页面结构

这是公开的前台测试文章。插图使用主题中已有的原创 SVG，内容仅用于展示页面效果。

从首页进入内容

首页不只是文章列表。它需要让第一次访问的人知道这里有什么，也需要让常来的读者迅速找到最近更新。测试文章有不同的标题、摘要和封面，可以一起观察卡片之间的信息层级。

这张图用来测试正文图片的宽度和比例。点击图片可以查看放大效果，再试试关闭按钮和键盘 Escape。图片加载完成之后，正文上下的位置应当稳定，手机上也不应出现整页横向滚动。

卡片里放什么

每张卡片都有自己的分工。图片提供视觉线索，标题说明文章主题，摘要补充一两句话，分类和日期帮助读者找到上下文。信息足够之后，卡片就可以把读者带到文章里。

让阅读顺着往下走

打开一篇文章之后，页面应该让读者很容易分清标题、摘要和正文。封面可以放在标题之后，但不能抢走全部注意力。图片下方继续接着真实的段落，才更适合判断页面的整体节奏。

用真实内容检查下一步

这批文章共享“前台测试”标签，也保留各自的主题标签。点击标签可以查看原生标签页；点击默认分类可以回到分类列表。文章之间的关系由实际发布的内容产生，不会额外生成不存在的链接。

你可以从这一页继续打开代码示例，看看同一套排版如何容纳另一种内容。也可以回到首页，切换深色模式，再比较封面、标题和摘要在不同背景下的显示。