Design Vocabulary设计词汇 · 样本集 01

VOCABULARY / 词条

404 页面

404 Page

加入比较 +

请求的地址在站点上找不到对应内容时返回的页面:它用平实的话说明这一地址没有找到内容,保留站点的导航与识别,并给出站内搜索、首页或相关分区等继续前进的路径,同时以 404(或 410)状态码告诉浏览器与爬虫这里没有内容。

示意图 · 编辑插画,尚无可操作示例
一张名为 FIELDNOTES 的虚构网页示意:顶部保留站点导航栏,页面中央是一个大号的"404"字样和一条迷路小路的简笔图,下方是一个搜索框和三张指向不同分区的灰色占位链接卡片,底部是带占位条的页脚。
一张名为 FIELDNOTES 的虚构网页示意:顶部保留站点导航栏,页面中央是一个大号的"404"字样和一条迷路小路的简笔图,下方是一个搜索框和三张指向不同分区的灰色占位链接卡片,底部是带占位条的页脚。

识别特征

  • 用平实的语言说明这个地址没有找到内容,而不是只显示"404 Not Found"
  • 保留站点的页眉、导航与识别,用户知道自己仍在同一个站点
  • 给出站内搜索、首页与相关分区等可继续前进的路径
  • 响应状态码是 404 或 410,而不是 200

概念边界

本词条指"找不到"这一种错误的整页呈现,不泛指所有错误页:服务器出错(5xx)、没有权限(401/403)与找不到是不同的情况,用户能做的事也不同。它不是空状态:空状态是一个存在的容器暂时没有内容,404 是请求的地址本身没有对应的资源。判定标准还包括协议层:页面看起来是"找不到",但响应状态码却是 200,就成了所谓的"软 404",搜索引擎与工具会把它当作正常内容处理。页面的趣味插画或品牌口吻是可选的点缀,不是这个模式的核心。

什么时候考虑它

  • 用户可能通过过期链接、拼错的地址或已删除的内容到达
  • 站点有足够的内容与结构,值得引导用户回到正轨
  • 需要让搜索引擎知道某个地址已经没有内容

什么时候慎用

  • 错误其实是服务器故障、无权访问或需要登录,用"找不到"会误导用户
  • 内容只是暂时为空,应该用空状态而不是错误页
  • 地址已经永久迁移到新位置,此时应该重定向,而不是让用户自己去找

取舍

一张有导航、搜索与说明的 404 页能把死胡同变成岔路口,代价是需要维护:搜索建议、热门链接与说明都要跟着站点变化;为它加入太多推广内容,又会让用户在最需要方向的时候分心。

条件规则 · 编辑建议

当请求的地址在站点上没有对应内容必须以 404 状态码响应(确知永久删除时可用 410),不要以 200 返回一个写着"找不到"的页面,也不要把所有失效地址一律重定向到首页。
当设计 404 页的内容建议用平实的语言说明情况,提供站内搜索与回到首页或相关分区的链接,不把技术术语或错误代码作为唯一的说明。

相关词条

搜索与筛选 ↗可以配合 · 用户知道自己要找什么,但地址已经失效

站内搜索让用户从"猜地址"转为"找内容";把失效地址中的关键词预填进搜索框,可以再省一步。

空状态 ↗相关但不同 · 界面需要说明"这里没有内容"

两者都要说明原因并给出下一步,但空状态面对的是存在却为空的容器,404 页面对的是不存在的地址,说法与恢复路径都不同。

寻路 ↗提供解释 · 用户到达了站点上一个不存在的位置

寻路要求任一屏都能回答"我在哪、能去哪、怎么回去";保留站点导航与常用入口,正是 404 页对这三个问题的回答。

站点页脚 ↗相关但不同 · 404 页沿用站点的通用框架

保留页脚中的站点地图式链接,为用户多提供一组可继续前进的入口,而不必在 404 页上重新罗列。

来源与支持范围

IETF · RFC 9110 HTTP Semantics, §15.5.5 404 Not Found ↗

RFC 9110(2022 年 6 月)第 15.5.5 节规定,404 状态码表示源服务器没有找到目标资源的当前表示,或不愿透露其是否存在;404 不表明这一情况是暂时还是永久的,若服务器知道该情况很可能是永久的,应优先使用 410(Gone);404 响应默认可被启发式缓存。本词条的状态码要求据此转述。

检索日期:2026-10-20 · 快照待确认
NN/g · Improving the Dreaded 404 Error Message ↗

Jakob Nielsen 的这篇文章(1998 年 6 月 14 日)建议 404 页用非技术用户能懂的平实语言说明地址为何无法找到,以简短而略带歉意的说明开头,列出常见的地址错误,检查与请求地址相近的有效地址并以链接给出,并提供站内搜索框。本词条的页面内容建议据此转述;文章年代较早,具体做法由本词条按当前网站情况编辑整理。

检索日期:2026-10-20 · 快照待确认
Google Search Central · How HTTP Status Codes Affect Google's Crawlers ↗

该文档(页面显示 2026 年 2 月 4 日更新)说明 Google 不会索引返回 4xx 状态码的地址,已索引的此类地址会被移出索引;若返回 2xx 的页面内容看起来像错误信息或空页,Search Console 会将其报告为软 404。本词条据此说明"看起来找不到却返回 200"会造成的后果。

检索日期:2026-10-20 · 快照待确认

定义参考以上来源;数字界面示例、选择建议、条件关系及配方由本样例编辑,尚未经用户研究验证。

类型扩展与实现说明

本词条尚无可操作示例;插画为编辑示意,展示 404 页中说明、搜索与入口链接的关系,不代表已验证的实现。应用到产品前仍须用浏览器或命令行确认失效地址实际返回 404 或 410,而不是 200。

{
  "states": [
    "idle",
    "searching"
  ],
  "a11y": [
    "页面标题与主标题说明这是\"找不到页面\",读屏用户进入时即可得知",
    "搜索框有可见的标签,链接文字说明去向而不是\"点击这里\""
  ],
  "motion": "无必需的动效;装饰性动画在减弱动态偏好下停止"
}

打开本词条的 Agent JSON 文件这个文件原样收录本词条的全部字段,并附上来源、存档与编辑声明。