设计与产品jdan.github.io
98.css：忠实复刻 Windows 98 界面的设计系统
98.css – design system for building faithful recreations of Windows 98 UIs
2020 — 2024，它一次次回到首页
黑点是上首页（≥ 50 分）的那次投稿，空心点是没冲上去的投稿，点越大分数越高。
导读
98.css 是一个 CSS 组件库，用无依赖的纯 CSS 复刻 Windows 98 的界面控件（按钮、输入框、窗口、进度条等），方便开发者把网页做成 Win98 的怀旧风格。项目由 Jordan Scales 在 2020 年作为恢复职业倦怠的业余项目创建，多年来持续维护并多次登上 HN 首页。
为什么经久不衰：它既是好用的 CSS 库，又承载了人们对 Win98 时代清晰、直白 UI 设计的怀念，每次出现都能引发关于现代界面可用性的讨论。
HN 评论精选
Win98 的 UI 以清晰、低认知负担著称，反衬出现代界面设计的含糊问题
难以置信 Win95/98 的 UI 设计如此强调功能性——尽管我整体上很讨厌 Windows，但该夸就得夸。只有现在回头用才明白他们把歧义和认知负担降到了多低，一切都显而易见。相比之下，现代沉迷美学的 UI 充满歧义，空间边界和控件状态缺乏清晰区分，用户永远在猜交互的结果，带来的是不安而非专注。
tomxor查看英文原文
I can't believe how intensely functional the UI design of windows 95/98 was when looking back, and I say this as someone who intensely hates windows overall - but credit where it's due. Only when using it now is it clear how well they minimized ambiguity and cognitive load... everything is so frickin obvious. Contrast that with modern aesthetically obsessed UIs, ever ambiguous, lack of clear distinctions not in both spatial boundaries and UI states - it's a constant guessing game for the user, never certain about the outcome of an interaction, giving you this distracting sense of unease rather than just focusing on whats behind the UI.
作者分享项目起源，以及直接给贡献者 commit 权限的独特维护方式
作者来了。这是 2020 年 4 月我恢复职业倦怠的项目，纯粹出于热爱，也让我意外发现自己仍然喜欢编程。我维护它的方式也很特别：收到 PR 时不直接合并，而是快速确认提交者不是垃圾账号后，直接授予其 commit 权限并请他自己合并自己的 PR，效果非常好。
prezjordan查看英文原文
Hey HN - author here. This was my burnout recovery project in April of 2020. Very much a labor of love and a surprising way to realize I still liked programming. I wrote some scattered thoughts here [0] I also "run" this project quite differently than I usually do - when I receive a pull request instead of merging it I do a quick glance through the user's github to make sure they're not a spammer before giving them _commit access_ and asking them to merge their own PR [1]. It has worked wonders. [0]: https://notes.jordanscales.com/ffa53b57 [1]: https://twitter.com/jdan/status/1528026508564078593
浏览器与 Windows 焦点机制的差异导致像素级复刻存在根本限制
我之前为 Windows 95 做过类似的尝试，努力做到像素级精确。过程中学到不少东西，最大的一个是：浏览器只有一种焦点，而 Windows 有两种——内部虚线框（受空格键影响）和黑色外框（受回车键影响）。所以不加 JS 模拟第二种焦点，就无法在浏览器里做出完全一致的 UI。
TazeTSchnitzel查看英文原文
I've previously attempted this for Windows 95. I tried very hard to be pixel-accurate. https://hikari.noyu.me/demos/ shows off a bit of what I achieved, but alas it lacks most of the UI elements. I learned some interesting things from the process. The biggest one for me is that web browsers have only one kind of focus, but Windows has two, a dotted line on the inside (element affected by space bar) and a black outline (element affected by return key). You therefore can't get exactly the same UI in a browser without adding some JS to simulate this second type of focus.
指出库中按钮按下态与真实 Win98 表现不符的细节
小瑕疵：在 Windows 98（以及任何版本的 Windows）里，按钮按下时并不是这个样子。只有开始菜单按钮和任务栏按钮按下时才是这种外观。另外，按钮获得焦点时除了虚线框外还应有黑色边框。
nielssp查看英文原文
Tiny nitpick – buttons don't look like that when pressed in Windows 98 (or any version of Windows for that matter). This is what they're supposed to look like: https://imgur.com/a/iFMJCER (98.css on top, Windows 98 below) As far as I'm aware, the only buttons that look like that when pressed are the Start menu button and taskbar buttons. Similarly, buttons are supposed to have a black border in addition to the dotted outline when they're focused.
历次讨论
同类还值得读
贝塞尔曲线入门
A Primer on Bézier Curves
Pomax 编写的贝塞尔曲线在线教程，从基础概念一路讲到曲线求交、投影、曲率等进阶内容，并配有可交互的示例和配套的 bezier.js 库。
设计与产品上首页 7 次 · 2014–2022pomax.github.io编辑精选WebGL 水面模拟
WebGL Water
Evan Wallace 制作的 WebGL Water 演示：在浏览器里实时渲染一片水面，展示折射、反射和焦散等 GPU 图形效果。
设计与产品上首页 6 次 · 2011–2025madebyevan.com设计建议：永远不要使用黑色
Design Tip: Never Use Black
设计随笔提出“永远不要用纯黑”的建议，主张在界面和绘画中改用深灰或带色相的暗色，并借阴影与色彩关系来论证。
设计与产品上首页 5 次 · 2012–2021ianstormtaylor.com用于思考不可想象之物的媒介
Media for Thinking the Unthinkable
Bret Victor 的这个页面围绕《Media for Thinking the Unthinkable》展开，探讨我们用来思考和表达复杂问题的媒介，以及以文字/符号为主的传…
设计与产品上首页 5 次 · 2013–2020worrydream.com编辑精选页面重量很重要
Page Weight Matters
博文讲 YouTube 工程师 Chris Zacharias 的一次页面瘦身实验：团队做了一个更轻量的页面版本，起初从整体平均加载时间看反而更慢；按地理区域分层后才发现，轻量版…
设计与产品上首页 4 次 · 2012–2022blog.chriszacharias.com