HTMLHTML

先认出这张活动页，再决定用什么标签

下面就是浏览器里的活动页：默认已用语义标签，读屏能跳到标题，报名和地图都能 Tab。点「报名」看按钮变「已报名」；再试「全换成 div」，失败也写在同一页上。

知识点：标签即含义

页上的章已经演示了核心关系，这里只给可复用的命名。

• 结构靠标签：h1、header、button、a 让工具认出这块是什么；外观相近的 div 堆读不到。
• 标题层级：一个 h1 写主题，章节用 h2，不要为了字号跳级。
• 可操作元素：触发动作用 button，跳转用 a[href]；div 冒充的链接不可 Tab。
• 图片要 alt：信息图写描述；装饰图可空 alt，但别漏掉属性。

什么时候用、怎么用

页面看起来正常，但读屏或键盘出问题时，先回头查结构。

• 信号：Tab 跳不到按钮、读屏读不清层级、搜索引擎抓不到主旨。
• 适用：搭页面骨架、写地标、给图片补文字。
• 不适用：没有合适语义时包一层用 div——它是最后手段，不是默认。
• 最短路径：问「这块是什么」→ 选标签 → 用键盘走一遍关键操作。

正反例：同一条「查看地图」

目标都是打开地图，只改标签。