UTF-8 是唯一实际可行的选择，其他编码如 GBK、ISO-8859-1 或 utf8（缺连字符）都会在多语言场景下失效或引发乱码；meta charset 必须紧贴 <head> 开头，因浏览器仅扫描前 1024 字节识别编码，若此前含非 ASCII 字符（如中文注释、BOM、<title>），则 fallback 至系统默认编码（如 Windows 的 GBK），导致中文、emoji 等解析失败；文件须保存为 UTF-8 无 BOM，HTTP 响应头 Content-Type 中的 charset 也必须与 meta 一致，三者缺一不可。
UTF-8 是唯一实际可行的选择，其他编码如 GBK、ISO-8859-1 或 utf8（缺连字符）都会在多语言场景下失效或引发乱码。
meta charset 必须放在 head 最开头
浏览器只扫描 HTML 前 1024 字节来识别 charset，一旦开头混入非 ASCII 字符（比如中文注释、BOM、空格、<title>），就会 fallback 到系统默认编码（Windows 下常为 GBK），导致后续所有中文、emoji、阿拉伯文等直接解析失败。
-
<head><meta charset="UTF-8"><title>你好</title></head>✅ 正确 -
<head><title>你好</title><meta charset="UTF-8"></head>❌ 失效：title 已触发错误解码 -
<head><!-- 你好 --><meta charset="UTF-8"></head>❌ 失效：注释含中文，破坏前 1024 字节纯 ASCII 区域 -
<head><meta charset="UTF-8"/></head>❌ 部分旧浏览器不识别自闭合写法，应写成<meta charset="UTF-8">
文件保存编码必须是 UTF-8 无 BOM
编辑器里选 “UTF-8” 不等于安全 —— VS Code 默认可能存为 UTF-8 with BOM，Notepad++ 默认可能是 ANSI（即 GBK）。BOM（EF BB BF）会出现在文件最开头，破坏 <!DOCTYPE html> 声明，也可能让 JS 报 Uncaught SyntaxError: Invalid or unexpected token。
- 用命令行验证：
head -c 4 index.html | xxd，输出含ef bb bf就有 BOM - VS Code：右下角编码显示 → 点击 → “Save with Encoding” → 选 “UTF-8”（不是 “UTF-8 with BOM”）
- Notepad++：菜单 Encoding → Convert to UTF-8（不是 “UTF-8-BOM”）
HTTP 响应头 charset 必须和 meta 一致
当页面通过 file:// 打开时，没有 HTTP 响应头，全靠 <meta charset="UTF-8">；但走服务器（如 Nginx、Apache、本地开发服务器）时，如果响应头是 Content-Type: text/html; charset=GBK，浏览器会无视 meta，直接按 GBK 解析 —— 中文照样乱码。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
- 检查方式：浏览器 DevTools → Network → 点开 HTML 请求 → Headers → Response Headers → 查看
Content-Type - 常见配置：
- Nginx：
charset utf-8;（加在 server 或 location 块） - Express：
res.set('Content-Type', 'text/html; charset=utf-8'); - Webpack dev server：默认已设好，但插件如
html-webpack-plugin若手动注入meta，需确认没覆盖或冲突
- Nginx：
form 和 AJAX 也要显式声明 UTF-8
<meta charset="UTF-8"> 只管页面自身解码，不控制表单提交或 AJAX 请求的编码。若用户输入中文后提交，服务端收到的是乱码字节，说明请求体没按 UTF-8 编码。
-
<form accept-charset="UTF-8">：强制表单以 UTF-8 编码提交（注意不是charset属性） - fetch 请求：
headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' }或发送 JSON 时确保字符串本身是 UTF-8 编码 - 避免依赖浏览器自动推断：某些老环境会按
ISO-8859-1编码表单数据，尤其当页面没正确声明meta charset时
真正决定多语言是否可用的，从来不是“写了 meta”，而是三件事是否同时成立：HTML 文件是 UTF-8 无 BOM、<meta charset="UTF-8"> 紧贴 <head> 开头、HTTP 响应头 Content-Type 明确带 charset=utf-8。漏掉任一环，中文、日文、emoji、阿拉伯数字都可能变成方块或问号。
