• 和 不再是“有样式的 div”，而是明确表示文档/区块的头部与尾部；
• 专用于导航链接集合，被辅助技术识别为“跳转入口区”；
• 表示独立可分发内容（如一篇博客），
  表示逻辑分组（如“评论区”“相关推荐”），二者嵌套关系有语义约束，不能随便互换；
• 今天 让机器能准确提取时间值，而不用靠正则匹配文本。

关键点：语义标签 ≠ 视觉样式替代品。它们默认无样式，仍需 CSS 控制外观；但一旦用了，就得按语义逻辑组织，否则反而降低可访问性。

表单和多媒体不再靠 JS 或 Flash 打补丁

HTML4 表单只能靠 + 大量 JavaScript 验证邮箱、日期、数字范围，既冗余又易被绕过；视频音频必须塞进 或 Flash 插件，移动端基本失效。

HTML5 把这些能力“下沉”到原生标签：

• 在支持浏览器中自动校验格式，required、pattern、min/max 属性直接触发 UI 提示；
• 一行就能播放，无需插件，且支持 添加字幕；
• 配合 JS 绘图，替代 Flash 图表，但注意：Canvas 是位图，缩放会模糊，SVG 才适合图标类矢量图形。

兼容性提醒：IE9 及以下完全不支持 和新 input 类型，必须用 polyfill（如 Modernizr + fallback）或降级方案（如 poster 图 + 链接下载）。

localStorage 和 Web Workers 这些 API 不是“锦上添花”，而是架构级升级

HTML4 时代，持久化数据只能靠 Cookie（4KB 限制、每次请求携带、无加密），复杂交互只能阻塞主线程跑 JS —— 页面卡顿、滚动掉帧是常态。

HTML5 提供真正可用的底层能力：

• localStorage.setItem('theme', 'dark') 存储 5–10MB 数据，不随请求发送，且跨会话保留；
• new Worker('task.js') 把耗时计算（如图片压缩、JSON 解析）扔进后台线程，UI 完全不卡；
• navigator.geolocation.getCurrentPosition() 获取经纬度，配合地图 API 实现 LBS 功能，无需第三方 SDK。

容易被忽略的坑：localStorage 是同步阻塞操作，高频读写（如每秒多次）会影响性能；Web Worker 无法直接操作 DOM，所有通信必须走 postMessage，数据要序列化 —— 大对象传参反而更慢。

真正决定是否升级 HTML5 的，不是“能不能用新标签”，而是你是否需要语义化结构支撑 SEO 与无障碍、是否依赖本地存储或后台任务、是否放弃对 IE8 及以下的支持。很多项目把 一加就叫“已用 HTML5”，其实只摸到了门槛；真正的升级，是从 DOM 组织方式、表单验证逻辑、资源加载策略开始重写。