使用HTML的<math>标签编写化学方程式是否符合语义规范？

用<math>元素写化学分子式（比如你例子里的MnSO₄）不算语义上的合规方案。<math>是W3C专门为数学公式设计的语义化标签，它的语义逻辑服务于数学符号运算，而化学分子式里的下标代表原子数量，和数学中下标的语义（比如变量的索引）完全不同。用<math>的话，屏幕阅读器等辅助技术会按照数学公式的逻辑来朗读，比如把O₄读成“O下标4”而非化学语境里的“4个氧原子”，会造成理解偏差。

推荐替代方案 #

• 纯HTML语义化写法（首选）
  直接用<sub>元素表示下标，这完全契合化学分子式的语义，兼容性好，辅助技术也能正确识别：

MnSO<sub>4</sub>

• 带语义类的<span>写法（兼顾样式与语义）
  如果需要自定义样式，同时保留清晰语义，可以给元素添加明确的类名，方便后续样式和脚本处理：

<span class="chemical-formula">
  MnSO<sub>4</sub>
</span>
<!-- 或者更细分的结构 -->
<span class="chemical-formula">
  <span class="element">Mn</span>
  <span class="element">S</span>
  <span class="element">O<span class="subscript">4</span></span>
</span>

还可以配合aria-label属性补充完整化学名称，提升无障碍访问性：

<span class="chemical-formula" aria-label="硫酸锰">
  MnSO<sub>4</sub>
</span>

• 自定义<chem>元素（小众场景）
  部分第三方库提供了<chem>自定义元素，专门用于渲染化学方程式和分子式，不过这不是标准HTML元素，需要依赖外部脚本支持，适合有特殊渲染需求的场景。

内容的提问来源于stack exchange，提问作者Daniel McCarthy