- 001入门网页是什么：浏览器画出来的文本文件以「你在浏览器里看到的每一个页面，骨子里都是一个文本文件」建立网页心智模型：HTML/CSS/JavaScript 三件套分工、右键源代码与 F12 Elements 的区别、URL 与 HTTP 一句话预告，并现场写出第一个双击就能打开的 HTML 页面。
- 002入门HTML5 概述与核心特性：不是更难的 HTML，是更明确的 HTML以「HTML 从 1991 年的 18 个标签长成今天，HTML5 是分水岭」开场：语义标签、原生音视频、表单增强、Canvas 与本地能力四个用户可感知的变化，DOCTYPE 与标准模式用 document.compatMode 现场验证，并澄清「HTML5 之后没有 HTML6」。
- 003入门环境准备与第一个页面：浏览器加编辑器就够了网页开发没有「装环境」这回事：一个浏览器加一个编辑器就是全部。建立 first-page 项目并跑通「改、存、刷、看」的即时反馈循环，对照双击打开与 Live Server 两种工作方式，用 DevTools 把 HTML/CSS/JS 三层连起来检查，并掌握页面白屏的排查三步。
- 004入门文档类型声明DOCTYPE与HTML Living Standard
- 005入门注释与特殊字符：给代码写便利贴零基础第一道坎：HTML 注释怎么写、为什么连续空格会被压缩成一个、五个必须背的实体字符，以及 © 这类符号怎么打出来。
- 006入门元数据与字符编码meta、title、link、UTF-8
- 007入门块级元素与行内元素：建立"盒子"世界观为什么 h1 独占一行而 span 不换行：块级、行内、空元素三组概念，含 F12 验证方法、p 嵌套陷阱与嵌套铁律。
- 008入门div 与 span：两大通用容器实战最常用的搭积木工具：div 做布局分组、span 修饰局部文字，附"全 div 反例"与"语义 + 容器正解"对比。
- 009入门id、 class、 style：打通 HTML 到 CSS/JS 的通道全局属性速通：id 是身份证号、class 是可复用标签、style 是紧急临时样式，附 title/hidden/contenteditable 等其余全局属性速查与终极对比表。
- 010入门HTML5 基础内容标签零基础第一套标签：标题、段落、强调、换行、列表（ul/ol）、链接与图片，目标是写出带图文和列表的简单页面。
- 011入门文本语义h1-h6、p、strong、em、mark、time、address
- 012入门列表HTML 三类列表（ul/ol/dl）的语义、属性、嵌套规则、无障碍要求与 CSS 样式化技巧。
- 013入门链接与锚点HTML 超链接与锚点完整指南：href 协议、target/rel 属性、路径系统、安全与可访问性。
- 014中级图像与响应式图片img、srcset、sizes、picture元素
- 015入门HTML5 表格与复杂结构表格语义结构、合并单元格、表格使用原则与全局属性大表、details/dialog/popover 速览。
- 016入门progress 与 meter两个原生数值显示元素：progress 表示任务进度（下载/上传），meter 表示数值状态（磁盘用量、评分、密码强度），含区间颜色规则、自定义样式与 JS 更新示例。
- 017入门语义化标签：给网页装上"路牌系统"从"接手一份全 div 的页面"这个真实场景出发：亲手把 div 汤改造成 header/nav/main/article/aside/footer 地标结构，用 DevTools 无障碍树验证效果，讲清 article 与 section 的辨析口诀与三类常见翻车点。
- 018中级无障碍访问：拔掉鼠标，你的页面还能用吗以"只用 Tab 键走完一个页面"的真实测试切入：亲手体验焦点流转、用读屏视角理解可访问名，掌握 label/alt/aria-label/aria-expanded 最小 ARIA 集，会修 div 当按钮、模态焦点丢失、placeholder 冒充 label 三类高频翻车。
- 019中级HTML5 表单与验证表单控件、输入类型、内建验证与自定义校验。
- 020中级音频与视频audio、video、source、track字幕
- 021中级SVG基本形状、viewBox、路径、文本、滤镜
- 022中级嵌入式内容iframe、embed、object
- 023入门HTML5 多媒体导览音视频、SVG 与 Canvas 三条绘图/媒体路线的总览导引。
- 024入门Canvas 2D 绘图与动画画布坐标系、路径与变换、图像与离屏画布、requestAnimationFrame 动画循环、Canvas 与 SVG 选型。
- 025入门Web StoragelocalStorage/sessionStorage 边界、JSON 序列化陷阱、storage 事件跨标签页同步与存储方案决策指南。
- 026入门Fetch API 与网络请求页面级 fetch 的错误处理入门：response.ok 检查、POST 与请求选项、AbortController 取消与超时、表单与文件上传场景。
- 027入门File/Blob 与对象 URLFile/Blob/FileList 数据结构、FileReader 与 file.text()、URL.createObjectURL 的 revoke 时机、a[download] 触发下载。
- 028中级拖拽 API用原生 Drag and Drop 从零做出一个文件拖入上传区与可排序列表：七事件的握手协议、dataTransfer 的读写规则、移动端为何失效与 Pointer Events 替代。
- 029入门专项：剪贴板、系统分享与全屏——手势驱动的浏览器交互 API复制按钮、调起系统分享面板、视频全屏这三件高频交互背后的标准 API：Async Clipboard 的读写与权限模型、Web Share API 及其降级链、Fullscreen API 的手势要求与事件同步，配 execCommand 时代回退与 iOS 差异说明；核心心智模型是「用户激活」——这三个 API 都要求在手势上下文中调用。
- 030中级地理位置定位用 Geolocation API 做一个"附近活动"入口：单次定位与持续追踪、权限状态查询与被拒兜底、Haversine 距离与地理围栏，以及定位隐私的正确姿势。
- 031中级History API用 pushState 与 popstate 从零写一个迷你 SPA 路由：历史栈与 state 恢复、刷新 404 的服务端配置、hash 与 history 两种模式取舍，以及切换动画的 View Transitions 配合。
- 032中级跨文档通信用 postMessage 打通 iframe、弹窗与多标签页：同源策略为何存在、targetOrigin 的安全语义、四道校验防线、MessageChannel 私有管道与 BroadcastChannel 广播，附真实案例（YouTube/Stripe/OAuth）。
- 033进阶专项：postMessage 生产级封装把 postMessage 从"裸消息"升级为生产级通信：Promise 化 RPC（超时/请求 ID）、跨域 localStorage 代理（MessageChannel + iframe）、多标签页登录同步器（BroadcastChannel + 心跳），附调试技巧。
- 034入门Observer 家族与页面生命周期IntersectionObserver 懒加载与曝光统计、ResizeObserver 组件自适应、MutationObserver、Page Visibility 切页暂停与 View Transitions 速览。
- 035进阶Web Workers用 Web Worker 把卡死页面的重活搬进后台线程：最小可用示例、结构化克隆与 Transferable、Worker 能用与不能用什么，以及 Comlink 等现代封装。
- 036进阶专项：Worker 通信与家族全景Web Worker 的进阶通信模式与家族全景：SharedWorker 跨标签页共享、MessageChannel 让两个 Worker 直连、classic 与 module 两种模式、可转移对象全表，以及 Service Worker / Audio Worklet / OffscreenCanvas 的选型对照。
- 037进阶Service Worker 与 PWAService Worker 全生命周期（注册/安装/激活/fetch 拦截）、Cache Storage 缓存策略、Web App Manifest 完整字段、推送通知与后台同步、安装体验与 PWA 最佳实践的完整专项。
- 038中级Web Components 与 PWA 开发Web Components 组件体系：Custom Elements、Shadow DOM、HTML Templates、slot 插槽、样式隔离与生命周期。
- 039中级WebSocketWebSocket
- 040进阶WebRTCWebRTC（getUserMedia）
- 041入门自定义数据属性data-*
- 042中级微数据与 JSON-LDMicrodata与JSON-LD
- 043入门视口配置与移动优先viewport、移动优先设计
- 044中级HTML5 项目示例：交互式表单应用综合运用表单验证、Canvas 与本地存储的交互式应用。
- 045中级关键渲染路径与资源加载从 HTML 解析到首屏像素，讲清关键渲染路径的每一步，以及 async、defer、preload、prefetch 的正确用法。
- 046入门专项： HTML 内容模型与嵌套规则从"块级/行内"升级到正式分类：元数据、流、章节、标题、措辞、嵌入、交互七类内容，附"谁是谁的父级"速查矩阵。
- 047入门专项：已废弃标签考古老网页和旧代码里必遇的废弃标签清单：font、center、frameset、marquee 等，附现代替代方案、废弃原因分类与遇到老项目时的处理思路。
- 048入门专项：东亚文字与国际化标签ruby 注音、bdi/bdo 双向文本隔离、lang/dir 属性深化：处理日文注音、中文拼音、阿拉伯文 RTL 排版的最后一公里。
- 049入门专项：图像热区 map 与 area在图片上划分可点击区域：map 与 area 的 shape/coords 坐标系统（rect/circle/poly），含坐标计算、hit-testing 原理与可视化示例。
- 050中级专项： dialog 与 popover 深度指南免 JavaScript 弹窗双雄：dialog 的 showModal/returnValue/::backdrop、popover 的触发与分层机制，含 Invoker Commands（command/commandfor）声明式控制、popover="hint" 与 interest invokers 前瞻，附选型对比与可访问性要点。
- 051入门details 与交互元素：原生折叠面板与手风琴details/summary 语义折叠、name 手风琴模式、与 popover/dialog 的选型对比、hidden=until-found 查找联动。
- 052中级专项：2023-2025 新元素与新能力近年落地的新 HTML 能力速成：search 搜索语义元素、可定制 select（appearance base-select 与 selectedcontent）、hidden until-found 与 beforematch、Speculation Rules 预渲染，附兼容性判断策略与降级写法。