W3C验证器仅检查静态HTML语法合规性，不执行JS、不解析动态DOM、不校验CSS或可访问性；其报错需区分硬性标准违规（如缺alt、非法嵌套）与框架扩展误报（如v-bind:src），关键看是否真实违反HTML标准。
W3C验证器只检查静态HTML语法是否合规，不运行JS、不解析动态DOM、也不管CSS或可访问性——它报的“错误”里，有些必须改，有些可以忽略，关键看是不是真违反HTML标准。
验证前必须确保 dist/index.html 是最终构建产物
本地开发时的 src/index.html 含有 {{ title }}、v-if、x-model 等模板语法，验证器直接报 character "{" is not allowed；Webpack/Vite 注入的变量、HTMLWebpackPlugin 的占位符，也都会触发误报。验证对象只能是构建后的真实 HTML 文件。
- 用
npx serve dist起本地服务，再填http://localhost:5000/提交 URL - 或直接打开
dist/index.html，全选复制源码（含<!DOCTYPE html>），粘贴到Validate by Direct Input栏 - 别拖拽文件、别用
file://路径——验证器压根不读本地文件系统
<img> 缺 alt 是硬错，v-bind:src 报错可忽略
验证器把规范强制项和框架扩展项混在一起报，得自己分辨哪些影响语义与可访问性，哪些只是它不认识。
-
Element “img” is missing required attribute “alt”：必须补，空图写alt=""，描述图写有意义文本 -
Attribute “v-bind:src” not allowed on element “img”：Vue 指令不是 HTML 属性，构建后会消失，无需处理 -
Bad value “preload” for attribute “rel”：其实是<link rel="preload" as="image">写成了as="picture"，验证器没报这行，但浏览器会忽略 preload——这种隐性失效它根本发现不了
<p> 里不能嵌 <div>，<script> 放 <head> 要加 defer 或 type
这类报错不是浏览器兼容问题，而是 HTML 内容模型本身禁止的结构，浏览器虽能自动修复（比如把 <p><div></div></p> 拆成两个段落），但语义已损坏，屏幕阅读器、SEO、旧版 IE 都可能出问题。
立即学习“前端免费学习笔记（深入）”；
-
<p>是短语内容模型，只允许内联元素；要包块级内容，改用<div>或<section> -
<script>在<head>中必须带defer、async或type="module"，否则验证器认为它会阻塞解析 -
<meta charset="UTF-8">必须在<head>前三行内，且不能写成<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">（HTML5 已废弃）
中文引号、全角空格、未转义 & 会让验证器直接失败
浏览器对这些字符宽容，验证器却极其敏感——它按 Unicode 规范逐字符校验，一个隐藏的 BOM 头或复制来的中文破折号（——）就能让整页报错。
- 删掉所有中文引号
“”、省略号…、破折号——，换成英文" "、...、-- - URL 中的
&必须写成&，哪怕https://a.com?x=1&y=2在浏览器里能正常跳转 - 检查文件编码是否为 UTF-8 无 BOM；VS Code 右下角点编码 → “Save with Encoding” → 选
UTF-8
真正难的不是跑通验证，而是判断哪条红字该修、哪条可关掉提醒、哪条背后藏着浏览器实际不执行的 bug。比如 <link rel="preload" as="image"> 写错 as 值，验证器不报，但资源根本不会预加载——这种事，只靠验证器发现不了。
