# 早期网页（Web 1.0）

镜语 · 版式与界面 / 年代风格

- 别名：90 年代网页、个人主页时代、GeoCities 风、复古网页
- 口语：「像 90 年代那种老网页」「蓝色带下划线的链接、灰色背景」「页面上还有“欢迎光临”跑马灯」
- 一句话：灰底蓝链接、表格排版、跑马灯和访客计数器的 1990 年代个人主页
- 是什么：Web 1.0 指 1990 年代以静态页面为主的早期网页。当时浏览器样式能力有限，作者用 HTML 表格排版、默认字体、蓝色下划线链接、平铺背景、GIF 动图和访客计数器拼出个人主页；读者主要是浏览，很少参与内容
- 缺了就不像：浏览器默认衬线字；蓝色下划线链接；表格切分的版面；灰色凸起按钮
- 加了更像：跑马灯；访客计数器；施工中横条；GIF 动图；平铺背景图案
- 适合用在：怀旧主题的活动页、个人主页彩蛋或 404 页面，制造「穿越回 1998」的反差；视频里讲互联网历史、早期论坛和个人站时的界面道具；与 Y2K 网页、Web 2.0 高光放在一起，讲网页审美怎样从「能显示」走到「有质感」
- 看哪里：看演示里的默认衬线字体、带下划线的蓝色链接和凸起的灰色按钮：样式几乎都来自浏览器默认值。表格线把页面切成格子，跑马灯、闪烁的「NEW」和访客计数器是那个年代个人主页的标准配件。点「签名留言」计数会增加，点链接会变成访问过的紫色
- 注意：不要把早期网页等同于「丑」：它的特征是浏览器默认样式加有限的装饰，而不是随便乱放元素；正式产品页大面积使用会让信息难读；常见做法是只取蓝链接、表格线、计数器等几个符号
- 描述示例：做一个 1990 年代 Web 1.0 风格的个人主页：浅灰 #c0c0c0 背景或平铺小图案背景，Times New Roman／宋体等浏览器默认衬线字，蓝色 #0000EE 下划线链接、访问过变紫色；用带 1px 立体边框的 HTML 表格分出左侧导航和正文，标题居中加水平分隔线 <hr>；加一条横向滚动的「欢迎光临」跑马灯、闪烁的 NEW 标签、黄黑斜纹「施工中」横条和数字访客计数器；按钮是浏览器默认的灰色凸起按钮，没有圆角和阴影
- 易混：
  - [Y2K 网页](https://idea.ameng.dev/terms/y2k-web.md)：早期网页靠浏览器默认样式，Y2K 网页刻意做出镀铬、虹彩和未来感图形
  - [新粗野](https://idea.ameng.dev/terms/neo-brutalism.md)：新粗野借用了直白的边框和原色，但是有意设计的粗描边与硬阴影，不是默认样式
- 相关：[Web 2.0 高光](https://idea.ameng.dev/terms/web-2-0-gloss.md)、[像素艺术](https://idea.ameng.dev/terms/pixel-art.md)、[极简界面](https://idea.ameng.dev/terms/minimal-ui.md)

## 来源与延伸阅读

- [Web Design Museum · 90 年代网页设计展](https://www.webdesignmuseum.org/exhibitions/web-design-in-the-90s)
- [Web Design Museum · Space Jam 1996](https://www.webdesignmuseum.org/gallery/space-jam-1996)
- [Web Design Museum · Yahoo! 1994](https://www.webdesignmuseum.org/gallery/yahoo-1994)
- [Web Design Museum · GeoCities 1999](https://www.webdesignmuseum.org/gallery/geocities-1999)
- [Space Jam 1996 官网（仍在线的原站）](https://www.spacejam.com/1996/)

网页版（含演示）：https://idea.ameng.dev/terms/web-1-0