必须包含DOCTYPE声明、UTF-8编码和title标签，用相对路径组织文件，本地测试需HTTP服务而非双击，上线前检查文件名小写、资源可直访、字体MIME类型正确。
直接上手建一个能访问的 HTML 网站，不需要框架、不依赖托管平台，核心就三件事：写对 index.html、放对文件结构、用对方式打开或部署。其他“教程”常把简单事绕成迷宫，这里只说你真会卡住的地方。
怎么写一个浏览器能正确解析的 index.html
不是所有 HTML 都能被当成网页加载——尤其本地双击打开时，缺关键标签会触发怪异行为（比如中文乱码、样式失效、JS 不执行）。
- 必须包含
声明，否则 IE/旧 Edge 进入怪异模式，flex或grid可能完全失效 -
里必须有，否则本地打开时中文显示为方块或问号 -
- 避免在
外写内容（比如把直接丢在后面），部分浏览器静默忽略，但 Chrome DevTools 会标红警告
<meta charset="UTF-8"><title>我的第一个页面</title><h1>你好</h1>
静态文件怎么组织才不会 404
本地双击 index.html 和部署到服务器，路径解析规则不同——这是 90% 的图片/样式/脚本加载失败的根源。
- 本地双击打开时，浏览器以
file://协议运行，./css/style.css会被解析为当前文件所在目录下的相对路径，但跨目录引用（如../images/logo.png）容易因误点子目录文件而断链 - 部署到服务器（如 Nginx/Apache）后，所有路径按 URL 解析：
/css/style.css指网站根目录下的css/文件夹，和物理文件位置无关 - 推荐统一用**相对路径**起步：
css/style.css（无开头斜杠）、images/icon.svg；等确定部署方式后再决定是否加/转绝对路径 - 图片路径写错常见现象：
img（大小写敏感！Linux 服务器上必 404）
本地测试别用双击，改用简易 HTTP 服务
双击打开 index.html 看似快，但会禁用 fetch、阻止跨域请求、无法读取本地 JSON，连 localStorage 都可能受限——这不是你的代码问题，是浏览器安全策略。
- Python 3 用户：终端进入项目根目录，运行
python3 -m http.server 8000，然后访问http://localhost:8000 - Node.js 用户：全局安装
serve（npm install -g serve），运行serve -s . - VS Code 用户：装插件
Live Server，右键index.html→ “Open with Live Server”，自动启动并监听文件变化 - 切记：只要用了
fetch、XMLHttpRequest、或引入了外部字体（如 Google Fonts），就必须走http://协议，否则控制台报net::ERR_FILE_NOT_FOUND或CORS错误
上线前必须检查的三个硬性条件
很多“建好了”的网站传到服务器后打不开，往往卡在这三点，且错误不报在页面上，只藏在浏览器控制台或服务器日志里。
-
index.html文件名必须全小写、无空格、无中文——某些 Linux 主机（尤其是共享虚拟主机）对大小写敏感，Index.html≠index.html - 所有资源路径（CSS/JS/图片）必须能在浏览器地址栏直接粘贴访问，例如打开
http://yoursite.com/css/main.css应返回 CSS 内容，而不是 404 页面或下载弹窗 - 如果用了自定义字体或图标字体（如 Font Awesome），确认
@font-face中的url()路径正确，且服务器允许该 MIME 类型（.woff2需配置application/font-woff2）
真正麻烦的从来不是写 HTML，而是路径、协议、大小写这三样东西在不同环境里反复咬人。先跑通本地 http://localhost，再上传，比一边双击一边猜错因高效得多。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
