静态页面稳定性取决于路径解析、资源引用、缓存策略、注入时机四点全对齐；相对路径必须严格匹配部署结构，以当前html所在目录为基准，/开头路径在子路径部署下必然404。
静态页面一旦要支持复杂路由，HTML 本身不处理路由逻辑，靠的是外部机制（Nginx、构建工具、前端框架）协同；代码质量稳定性不是“写得规范就行”，而是路径解析、资源引用、缓存策略、注入时机这四点全对齐才能稳住。
静态 HTML 中的相对路径必须严格匹配部署结构
浏览器解析 src 和 href 时，永远以当前 HTML 文件所在目录为基准。比如 detail_12345.html 放在 /products/ 目录下，它里面写 <img src="images/pic.jpg">，就真去请求 /products/images/pic.jpg——而不是你想象中的根目录下的 /images/。
- 绝对路径（
/images/logo.png）在子路径部署（如https://example.com/shop/）下必然 404 -
./前缀冗余且易错，logo.png和./logo.png行为一致，但多敲字符增加出错概率 - 所有路径禁止含空格或中文；URL 编码后行为不可控，调试困难
- 构建阶段若用 Hugo/Astro 等 SSG，确保
baseURL配置与实际部署路径一致，否则生成的<a href="/about"></a>会跳错
Nginx try_files + 动态兜底不能替代语义化路由判断
try_files $uri $uri/ /index.html 是 SPA 的常见兜底写法，但它对含用户态内容的页面（如带 {{ current_user.name }} 或 document.cookie 逻辑的页面）完全无效——这些页面根本不能静态化，强行塞进 try_files 只会让首屏渲染变慢、调试链路变长。
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 含登录态、购物车数量、实时评论的页面，必须保留动态路由，由后端模板或 SSR 渲染
-
try_files只负责文件存在性 fallback，不解决“该不该走静态”这个业务判断问题 - 正确做法是在 Nginx 层加条件判断：
if ($uri ~ ^/user/|/cart) { proxy_pass http://backend; }，把敏感路径显式剥离 - 别依赖
sub_filter在响应体里硬插用户信息——它不识别 HTML 结构，注释嵌套或 gzip 后大概率错位
静态导出动态路由时 getStaticPaths 的参数必须可枚举
Next.js 的 getStaticPaths 要求返回的路径列表在构建时完全确定。如果你试图用 fallback: true 或 getServerSideProps 混入静态导出流程，构建会直接失败——这不是配置问题，是模型冲突。
-
getStaticPaths返回的params必须是有限、可穷举的值，比如商品 ID 列表从数据库查出后硬编码进数组 - 不能调用异步 API 或读取运行时环境变量来生成路径；CI/CD 流水线里执行构建前，数据源必须已就绪
- 路径命名建议按业务主键，如
detail_12345.html，而非page-20260702-001.html——后者导致 CDN 缓存击穿，且无法精准刷新单页 - 若 ID 来源不稳定（如第三方 API 不保证幂等），应在构建前加一层校验脚本，过滤掉非法或重复 ID
HTMLHint 检查必须覆盖路径引用和结构完整性
静态页面规模上来后，<a href="contact.html"></a> 指向一个不存在的文件，或 <img src="missing.jpg"> 这类错误不会报错，但会 silently 降级——直到上线后用户反馈图片不显示、链接 404，才暴露问题。
- 在 CI 流程中加入
htmlhint --config .htmlhintrc **/*.html，重点启用attr-accesskey、attr-req-alt、attr-no-duplication和head-script-disabled规则 - 自定义规则检查路径有效性：用 Node.js 脚本遍历所有
href/src属性，验证对应文件是否存在于输出目录 - 禁用
doctype-first类宽松规则——它们掩盖结构性隐患，比如缺失根节点在某些旧浏览器中触发怪异模式 - 不要把 HTMLHint 当成“格式检查工具”，它真正价值在于提前拦截那些“能跑但不稳”的结构性缺陷
最常被忽略的一点：静态页面的“稳定性”不取决于单个文件是否合法，而取决于整套路径映射关系在构建、部署、CDN 缓存、网关路由四个环节是否完全一致。差一个斜杠、少一次重定向、漏配一种 MIME type，都可能让某类设备加载失败——这种问题往往只在灰度发布时才浮出水面。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
