课时01：HTML 简介与发展史¶
学习目标：理解 HTML 的本质定位，掌握 Web 技术标准化的演进脉络，建立对 HTML5 时代技术选型的正确认知。
一、HTML 的本质定义¶
1.1 什么是 HTML¶
HTML（HyperText Markup Language，超文本标记语言） 是构建网页文档的基础标记语言，而非编程语言。其核心特征包括：
- 标记性：通过尖括号包裹的标签（如
<tag>）对文本内容进行语义化标注 - 结构性：定义网页内容的层级关系与组织方式
- 超文本特性：文本中嵌入可跳转的链接节点，实现跨页面、跨站点的资源互联，构成万维网（World Wide Web）的基本形态
1.2 与编程语言的区别¶
| 维度 | HTML | 编程语言（如 JavaScript） |
|---|---|---|
| 执行逻辑 | 声明式结构描述 | 命令式逻辑控制 |
| 运算能力 | 无数据处理能力 | 支持算法与数据运算 |
| 交互能力 | 静态内容展示 | 动态行为控制 |
二、HTML 发展历史里程碑¶
2.1 关键演进节点¶
| 时间节点 | 版本/事件 | 核心意义 |
|---|---|---|
| 1989年 | 概念萌芽 | 蒂姆·伯纳斯-李（Tim Berners-Lee）提出基于互联网的超文本系统构想 |
| 1991年12月 | HTML 1.0 | 首份公开标签文档，定义 18 个初始元素，标志 HTML 正式诞生 |
| 1995年11月 | HTML 2.0 | 首次正式标准化拓展，确立常见网页结构规范 |
| 1997年前后 | 浏览器大战 | 网景（Netscape）与 IE 各自扩展标准，兼容性危机催生统一规范需求 |
| 1997年12月 | W3C 成立 | 万维网联盟（World Wide Web Consortium）成立，蒂姆·伯纳斯-李担任主席，主导 Web 技术标准化 |
| 1999年12月 | HTML 4.01 | 提供 Strict、Transitional、Frameset 三种变体，满足不同迁移需求 |
| 2001年1月 | XHTML 1.0 | HTML 与 XML 语法结合，强调标签闭合、属性引号等严格语法规则 |
| 2014年10月 | HTML5 | 正式成为 W3C 推荐标准，取代 HTML 4.01 和 XHTML 1.0，定义现代 Web 标准 |
2.2 版本变体解析¶
HTML 4.01 的三种变体：
- 严格版（Strict）：完全遵循标准，摒弃表现层标签（如
<font>），要求结构与表现分离 - 过渡版（Transitional）：允许兼容旧式表现属性，便于从早期版本平滑迁移
- 框架集版（Frameset）：支持框架布局（已废弃，现代开发使用
<iframe>替代）
XHTML 的定位： XHTML 并非 HTML 的升级版本，而是融合了 XML 严格语法规则的平行规范。其核心要求： - 所有标签必须闭合 - 属性值必须加引号包裹 - 标签名必须小写
这种严格性为后续 HTML5 的规范化奠定了基础。
2.3 HTML5 的战略意义¶
HTML5 的发布标志着 Web 标准化的重大转折点：
- 语义化增强：新增
<header>、<nav>、<article>、<section>、<footer>等结构性语义标签 - 多媒体原生支持：内置
<audio>、<video>标签，无需依赖第三方插件 - 统一碎片化标准：终结浏览器各自为政的局面，建立统一的解析与渲染基准
- 现代开发基石：当前所有现代浏览器已全面支持 HTML5，是前端开发的唯一必要入门标准
三、学习建议与技术选型¶
3.1 为什么直接学习 HTML5¶
- 全面兼容性：现代浏览器（Chrome、Firefox、Edge、Safari）均已实现 HTML5 完整支持
- 行业统一性：HTML5 是当前唯一活跃的 Web 标准，旧版本已进入维护终止阶段
- 技术前瞻性：HTML5 的语义化标签和 API 是响应式布局、渐进式 Web 应用（PWA）的技术基础
3.2 旧版本认知的必要性¶
尽管学习重心应放在 HTML5，但在以下场景中仍需具备识别旧版本代码的能力：
- ** legacy 系统维护**：审计或维护 2010 年以前构建的遗留系统
- 兼容性测试：理解浏览器对非标准代码的解析差异
- 安全评估：识别旧版标签（如
<frameset>）可能引入的点击劫持等安全风险