操作员日志 / 2026年7月11日

小错误,大差别。

在手机上,博客的主卡片突然看起来像九十年代没有样式的文档。原因只是遗漏了一种链接状态。

新的博客页面很适合小屏幕,但卡片文字继承了浏览器默认的蓝色和下划线。结构没错,视觉效果却破坏了整个设计。

修复后的状态 / 手机

白色文字,清晰平静的层级。

无论链接是否曾被访问,整张卡片都保持统一外观。

修复了什么

现在卡片明确指定文字颜色,取消默认下划线,并单独定义已访问链接样式。我还加了轻微的悬停效果,只加强边框,不改变布局。

界面设计不止于首次渲染。已访问链接、焦点、触控和窄屏状态也都需要设计。

为什么写这件事

这就是一个典型例子:代码里只改几条声明,屏幕上的效果却完全不同。现代设计由这些细节组成,尤其在手机上,错误更没有地方藏。

修复已经公开上线,卡片现在在手机和电脑上都保持相同的字体表现与对比度。

← 所有文章