404.html 必须严格置于根目录、全小写命名且无BOM，服务器返回真实404状态码，HTML需硬编码“404”文字、内联CSS、禁用JS，并用根相对路径确保任意路径下稳定生效。
404.html 文件名和位置必须严格匹配平台规则
GitHub Pages、Vercel、Netlify、Cloudflare Pages 这些静态托管服务，只识别根目录下名为 404.html 的文件——全小写、无空格、无扩展名变体（如 404.htm 或 not-found.html）。放错位置（比如 /pages/404.html）或命名带大写（404.HTML），服务器根本不会接管 404 请求。
常见错误现象：git status 显示已提交，但访问不存在路径仍看到平台默认灰页。原因可能是：
- Windows 记事本保存时悄悄加了 BOM 头，用
git ls-files | grep 404确认是否真被 Git 跟踪 - Jekyll 用户没在
404.html开头加---\npermalink: /404.html\npublished: false\n---，导致被当作普通文章渲染 - macOS 本地测试不区分大小写，但部署到 Linux 服务器后
404.HTML就失效
服务器必须返回真实 404 状态码，前端无法补救
HTML 再漂亮，如果响应头里不是 HTTP/1.1 404 Not Found，对 SEO 和用户体验就是负向影响：搜索引擎会把它当正常页面收录，用户刷新也得不到重试提示。
验证方式只有两种可靠：
立即学习“前端免费学习笔记（深入）”；
- 浏览器 DevTools → Network → 访问一个肯定不存在的路径（如
/xyz123）→ 查看该请求的Status字段是否为404 - 命令行执行
curl -I https://yoursite.com/xyz123，第一行必须是HTTP/1.1 404 Not Found
本地双击打开 404.html 是 file:// 协议，压根没有 HTTP 状态码，完全无效。必须用 npx serve -s 或 python3 -m http.server 8000 启服务测试。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
HTML 结构要语义化且“404”文字必须硬编码在 <h1></h1>
<h1></h1> 标签里必须直接包含 “404” 或 “404 Not Found” 字样，不能靠 CSS 伪元素、SVG 文本、JS 动态插入，否则屏幕阅读器读不到，搜索引擎也识别不了意图。
结构建议精简但完整：
-
<title></title>写成<title>404 - 页面未找到</title>，方便搜索结果识别 - 主体用
<main></main>包裹，或加role="main"，让辅助技术跳过导航直读错误信息 - 提供明确出口：
<a href="/" rel="nofollow">← 返回首页</a>，不用<button></button>或 JS 跳转 - 加
<meta name="robots" content="noindex">，避免被搜索引擎误收录
CSS 必须内联，禁用外部资源和 JavaScript
404 页面加载失败的最常见原因，是依赖的外部 CSS、JS 或图片路径出错。深层 URL（如 /blog/post/xxx）下相对路径会失效，CDN 挂掉或安全策略拦截也会导致白屏。
实操底线：
- CSS 全部写进
<style></style>标签，控制在 1KB 以内；禁用<link rel="stylesheet"> - 所有资源用根相对路径：
/css/style.css、/img/404-icon.svg，别用./img/或../img/ - 禁用
<script></script>标签，包括分析脚本、灯光开关交互逻辑、document.referrer判断等——用户平均停留不到 8 秒，JS 加载失败就卡死 - 字体栈用
-apple-system, sans-serif，不引入 Web Font；单位优先用rem，避免高 DPI 屏显示异常
真正难的不是写 HTML，而是确保它在任意路径、任意网络条件下，都能以 404 状态码稳定呈现——每个环节都可能断链，得一个个堵住。
