必须真实返回HTTP 404状态码，否则搜索引擎误收录为普通页面；需用curl -I或DevTools验证响应头，GitHub Pages等平台仅识别根目录小写404.html，HTML须语义化、内联CSS、禁用JS跳转与外部资源。
必须返回真实 404 Not Found 状态码，否则搜索引擎会把它当普通页面收录——这是所有 SEO 前提，其余全是补救。
服务器必须返回真实 404 状态码，不能是 200 或 302
本地双击打开 404.html 永远是 200，毫无意义。验证必须走真实 HTTP 请求：
- 用
curl -I https://yoursite.com/xxx，第一行必须是HTTP/1.1 404 Not Found - 在浏览器 DevTools → Network 中看该请求的 Status 列，不是“已加载”，而是明确显示
404 - GitHub Pages、Vercel、Netlify 默认支持，但只认根目录下严格小写的
404.html；写成404.htm、pages/404.html或带 BOM 的文件都会失效 - Apache 用户需在
.htaccess中加ErrorDocument 404 /404.html；Nginx 需在server块中配error_page 404 /404.html;，并确保location = /404.html未被 rewrite 覆盖
搜索引擎靠标签结构识别错误意图，不解析图片或 JS 渲染内容：
-
404 - 页面未找到 Oops! -
必须是纯文本404 Not Found
- 主内容必须包裹在
里，或加role="main"，让屏幕阅读器跳过导航直接读错误信息 - 加
，防止 Google 把它当有效页面抓取
链接和搜索框要真实可用，且不依赖 JavaScript
用户平均停留不到 8 秒，任何 JS 失效都会导致卡死或降级失败：
- “返回首页”必须是
@#@#@#@#@#@#@#@#@#@0，不是 - 搜索框用标准表单：
；后端需真实支持/search?q=xxx路由 - 避免
或setTimeout自动跳转——干扰后退、损害无障碍体验 - 不要加“返回上一页”按钮：外链进来的
document.referrer可能为空或跨域，history.back()会白屏
CSS 必须内联，路径必须用根相对路径
外部资源加载失败时，404 页面会变白屏或只剩文字：
- CSS 全部写进
标签，控制在 1KB 以内；禁用 - 所有资源（如图标、字体）用根相对路径：
/img/404.svg，不是./img/404.svg—— 因为 404 可能发生在/blog/post/xxx这类深层路径下 - 字体栈写
font-family: -apple-system, sans-serif;，不引入 Web Font；字号用rem或clamp()保证高 DPI 屏可读 - 别加背景图、
@import、阴影或动效——它们会触发额外请求，增加失败概率
最容易被忽略的是日志联动：即使页面再友好，如果服务端没记录原始 Referer 和 request.path，你就永远不知道是内部链接写错、还是爬虫在扫废弃路径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
