规范保存html文件的核心是确保离线可打开、路径无报错、后续可维护；必须用utf-8编码（记事本选“另存为”并手动设utf-8，vs code确认右下角显示utf-8），补全所有相对路径资源，合理配置.gitignore，并通过拔网线双击验证渲染完整性。
直接保存为 index.html 并用 UTF-8 编码，只是第一步；真正“规范”的保存，核心是让文件能离线打开、路径不报错、后续可维护——这三件事没做到，就不是规范保存。
保存时必须选 UTF-8 编码，否则中文变乱码
记事本默认用 ANSI（Windows-1252），粘贴含中文的 HTML 后一保存，<h1>你好</h1> 可能变成 <h1>浣濂</h1>。VS Code 默认是 UTF-8，但也要确认右下角状态栏显示的是 UTF-8，不是 GBK 或 ISO-8859-1。
实操建议：
- 在记事本中：点「另存为」→「编码」下拉框里手动选
UTF-8（不是UTF-8-BOM，除非你明确需要 BOM） - 在 VS Code 中：右下角点击编码名 → 选
Save with Encoding→ 选UTF-8 - 用命令行生成文件时，
curl和wget默认不处理编码，若源站声明了charset=gbk，就得加转码步骤，比如用iconv：curl https://example.com | iconv -f gbk -t utf-8 > index.html
HTML 文件不能单独存在，得配齐引用资源路径
只保存 index.html，但里面写着 <link rel="stylesheet" href="css/style.css">，而 css/ 文件夹根本没建——双击打开就是白屏或样式错乱。这不是代码问题，是结构缺失。
检查要点：
- 逐行扫
<link href="...">、<script src="..."></script>、<img src="...">，把所有路径都按实际目录补全 - 路径优先用相对路径（如
./images/logo.png），避免http://或/images/logo.png（后者在file://协议下会 404） - 如果原网页用了构建工具（Vite/Webpack），注意
public/下的静态资源（如favicon.ico）是否被漏掉
用 Git 备份前，先确认哪些该进仓库、哪些该忽略
git add . 看似省事，但可能把 node_modules/、dist/、.DS_Store 全塞进去，既拖慢提交，又污染历史。HTML 项目虽轻，Git 配置不对照样翻车。
关键动作：
- 新建
.gitignore，至少写上：node_modules/、dist/、build/、.DS_Store、Thumbs.db - 运行
git status --ignored，看有没有本该纳入却因忽略规则被跳过的资源（比如public/favicon.ico被误加进了.gitignore） - 首次提交务必执行
git add -A && git commit -m "init: html + assets"，别只靠git push——本地没提交，远程空了也白搭
离线验证才是最终验收标准
所谓“规范保存”，不是文件存进硬盘就完了。真正闭环是：拔掉网线 → 双击 index.html → 浏览器完整渲染 → 控制台无 404 报错 → 图片/字体/脚本全加载成功。
容易被忽略的点：
-
file://协议下，AJAX 请求、fetch()、Service Worker 全部被浏览器拦截，这类页面无法真正离线运行，得提前识别 - 某些 CSS 框架（如 Bootstrap CDN 版）依赖外链，必须替换成本地
bootstrap.min.css才算完整备份 - 如果用了 Web Components 或 Shadow DOM，开发者工具里复制的
outerHTML是渲染后结果，但原始<template></template>或<slot></slot>结构可能已丢失，此时得回 Network 面板找原始Doc请求再 Save as
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
