在可访问的内部创建带有强标记的h2标记

Question

所以这可能看起来像一个非常简单的问题，但我无法理解它。我有以下HTML：

<h2>word 1 - <strong> word 2 </strong></h2>

我知道这在语义上并不正确，我不应该在标题内有strong，但由于设计要求，我需要加粗第二个单词而不是第一个单词。

我正在努力确保此文本仍可访问，但是当我使用屏幕阅读器时，它会给我带来奇怪的读数。我猜这是因为<strong>标记内的<h2>标记。

有谁知道更好的方法吗？我错过了什么吗？

编辑：对不起，你是对的“奇怪的读物”并没有多说。当我在标题处悬停时，它显示单词1，我必须将鼠标悬停在单词2上以在阅读器中显示，其中所需的行为将是：悬停标题并阅读单词1和2.

编辑2：使用<span>和<b>标记会产生相同的行为

Answer 1

我不确定＆＃34;奇怪的读数＆＃34; 是什么意思。

<span>代码怎么样？

<h2>One <span>Two</span></h2>

h2 {
  font-family: sans-serif;
  font-weight: normal;
}
h2 span {
  font-weight: bold;
}

演示JSFiddle

Answer 2

您可以在标题中完美地放置strong元素。它在语义上是正确的。

https://www.w3.org/TR/html5/text-level-semantics.html#the-strong-element

  

重要性：可以在标题，标题或段落中使用强元素，以区分真正重要的部分与其他可能更详细，更快速或仅仅是样板的部分

您的“奇怪阅读”问题反映了屏幕阅读器的使用或行为中的问题，而不是您的语法。

Answer 3

在strong中拥有h2可能非常好。但如果strong合适，则取决于实际内容。如果您只需要它来使文本变为粗体，则不是合适的。

看看all of the text-level semantic elements。使用span element（因为它毫无意义）if no other element is suitable。

屏幕阅读器阅读此标题的方式很可能与strong无关，但它只是某些屏幕阅读器遇到元素时的行为方式（可能是strong，{ {1}}，或其他）。你不必担心这个。屏幕阅读器用户知道并期望这一点，并且他们有办法在需要时更改此内容。