html标签用得标准，关键在语义准确、嵌套合法、属性合规；section需有标题且具独立主题，img的alt须满足可访问性，button原生支持键盘操作与语义，优于div模拟。
直接说结论：HTML 标签用得“标准”，关键不是背全所有标签，而是守住三件事——语义准确、嵌套合法、属性合规。 其他炫技式写法、过时属性、自造标签，哪怕能渲染出来，也不算标准。
怎么判断一个标签是否该用 <section></section> 而不是 <div>
<p>核心看它有没有独立主题和可被大纲识别的结构意义。</p>
<ul>
<li>
<code><section></section> 必须有标题（<h1></h1>–<h6></h6>），比如“产品特性”“用户评价”“技术参数”，浏览器大纲工具能把它列为一个逻辑节；
<div> 是纯容器，没语义，只用于样式分组或 JS 操作，比如给一组按钮加个统一 class 便于控制显示/隐藏；
<li>常见错误：把导航栏、页脚、侧边栏全塞进 <code><section></section> —— 它们该用 <nav></nav>、<footer></footer>、<aside></aside>；<section></section>，但现代项目基本不用考虑，只要确保 CSS 里写了 section { display: block; } 就能兜底。
<img> 的 alt 属性到底怎么写才合规
不是“随便填点文字”，而是要满足可访问性（a11y）和 SEO 基础要求。
- 空字符串
alt=""仅适用于纯装饰图（比如背景花纹、分隔线），告诉屏幕阅读器“跳过”； - 功能性图片（如按钮图标、链接缩略图）必须描述其作用，例如
<img src="search.svg" alt="搜索">，不是“放大镜图标”； - 信息图、数据图表类图片，
alt应概括核心结论，细节放<figure><figcaption></figcaption></figure>或单独页面； - 绝对不要写
alt="图片"、alt="logo"这类无意义内容，它等于没写； - 注意：没有
alt属性的<img>会被部分屏幕阅读器读作“image”，属于 WCAG 2.1 A 级失败项。
为什么 <button></button> 比 <div onclick> 更标准
<p>表面都能点，但底层行为、默认可访问性和语义完全不同。</p>
<ul>
<li>
<code><button></button> 原生支持键盘操作：Tab 可聚焦、Enter/Space 可触发，无需额外 JS；
<div onclick="..."> 默认不可聚焦，屏幕阅读器不会识别为控件，需手动加 <code>tabindex="0" 和 role="button" 才勉强达标；
<button></button> 自带表单提交行为（type="submit"）、禁用状态（disabled）和语义，而 <div> 全要自己模拟；
<li>容易踩的坑：在表单内写 <code><button></button> 却没设 type，结果点击直接提交整个表单（浏览器默认是 type="submit"）；<button></button> 渲染开销远低于监听事件 + 手动管理状态的 <div> 方案。
<p>真正难的不是记住每个标签怎么拼，而是每次写之前多问一句：这个元素在文档大纲里该不该被看见？它对键盘用户是否可操作？它在没有样式的纯文本环境里还能传达意思吗？这些地方一松懈，标准就塌了一半。</p>
</div>
