HTML5网页发布前须检查路径、meta标签、资源上传、MIME类型：用站点根相对路径（如/images/logo.png）；必写<meta charset="UTF-8">和<meta name="viewport" content="width=device-width, initial-scale=1.0">；确认所有CSS/JS/字体文件已上传且大小写正确；验证服务器返回正确的Content-Type。
HTML5 网页写完不能直接丢进浏览器就完事——本地能打开，不等于发布后能正常访问。很多新手在上传到服务器后才发现图片炸了、链接 404、CSS 不生效，甚至整个页面白屏，问题往往出在发布前那几项没检查清楚。
相对路径 vs 绝对路径：img、link、script 的引用是否全用对了？
本地双击 index.html 能显示，是因为浏览器以文件系统为根（file:// 协议），但上线后走的是 HTTP/HTTPS 协议，服务器根目录才是真正的“/”。路径一错，资源全挂。
- 避免用
../images/logo.png这类深度相对路径，尤其当未来可能调整文件夹结构时；更稳妥是统一用站点根相对路径，比如/images/logo.png（前面带/） -
link引入 CSS、script加载 JS 时，同样要确认路径基准：如果 HTML 在/blog/post.html，而 CSS 放在/css/style.css，就必须写/css/style.css，而非../css/style.css - 检查控制台（F12 → Console / Network 标签页）里有没有 404 请求——这是最直接的路径错误信号
charset 和 viewport 元标签是否漏写或写错？
中文乱码、手机页面缩放异常，90% 出在这两个 meta 上。它们不是可选装饰，而是 HTML5 页面的基础声明。
-
<meta charset="UTF-8">必须放在<head>最靠前位置（最好第二行），且值必须是"UTF-8"（注意英文引号和大小写），写成utf8或UTF8在部分服务器上会失效 -
<meta name="viewport" content="width=device-width, initial-scale=1.0">缺失会导致移动端强制缩放，文字小得看不清；content 值里不要加空格或多余符号，比如width = device-width就会失效
静态资源是否已全部上传？有没有漏掉 .css、.js 或字体文件？
本地开发常用 Live Server 或 VS Code 插件自动刷新，容易误以为“看到效果 = 所有文件都在”，其实只是编辑器帮你临时托管了缺失资源。真传到服务器，少一个文件，就断一条链。
立即学习“前端免费学习笔记（深入）”；
- 对照 HTML 源码，逐个检查
href、src属性指向的每个路径，确认对应文件真实存在于服务器目录中（注意大小写：Linux 服务器区分Style.css和style.css） - 字体文件（如
@font-face中的.woff2）、图标字体（fonts/文件夹）、SVG 雪碧图等容易被忽略，建议上传前用文本搜索全项目里的url(或src= - 如果用了第三方 CDN（如 Bootstrap、jQuery），确认网络是否允许访问该域名——内网环境或某些地区可能被拦截，建议关键 JS/CSS 备份本地
服务器 MIME 类型是否正确识别 .html、.css、.js？
哪怕所有文件都传齐、路径全对，如果服务器把 style.css 当作 text/plain 发送，浏览器就不会当样式表解析，直接白屏或无样式。
- 上传后直接访问 CSS 文件 URL（如
https://yoursite.com/css/style.css），看浏览器是否显示源码（说明类型正确），还是弹下载或报错（说明 MIME 错了） - 常见错误配置：
.html被设成application/octet-stream，.js被当成text/plain；解决方式取决于服务器类型：Apache 需检查.htaccess或主配置，Nginx 查mime.types，GitHub Pages / Vercel 等平台通常自动处理，但自建服务务必验证 - 顺手检查响应头中的
Content-Type字段，F12 → Network → 点开某个资源 → Headers → Response Headers 下找它
发布不是终点，而是第一次真实环境的压力测试。最容易被跳过的，其实是打开浏览器开发者工具，挨个看 Network 面板里每条请求的状态码和 MIME 类型——这比反复刷新页面更早暴露问题。
