钻牛角尖： 和 有什么区别？

相比起城会玩的JavaScript和花样多的CSS，HTML可以用来出面试题的考点并不多。有些无事生非的面试官就提出这个的问题： 和 有什么区别？

定义

The HTML Bring Attention To element () is used to draw the reader's
attention to the element's contents, which are not otherwise granted special importance.

翻译：元素表表示相对于普通文本字体上的区别，但不表示任何特殊的强调或者关联，通常以粗体显示。

HTML标准中的：

The HTML Strong Importance Element () indicates that its contents have strong importance, seriousness,
or urgency. Browsers typically render the contents in bold type.

翻译：Strong 元素 ()表示文本十分重要，一般用粗体显示。

从定义上看：表示加粗但未必是重点，只是我们的阅读习惯觉得加粗的内容比较重要；表示强调，只是浏览器为了符合我们的阅读习惯而给它加了粗。

语义化

是一个被追捧的语义化标签，而是一个被唾弃的风格化标签。需要强调的内容，推荐使用；需要加粗的内容，推荐抛弃，而是使用CSS来实现。标准中有提及以下内容：

The element is for content that is of greater importance, while the element is used to draw
attention to text without indicating that it's more important.It may help to realize that both are valid and
semantic elements in HTML5 and that it's a coincidence that they both have the same default styling (boldface) in
most browsers (although some older browsers actually underline ). Each element is meant to be used in
certain types of scenarios, and if you want to bold text simply for decoration, you should instead actually use the
CSS font-weight property.

翻译：strong是一个逻辑状态，而bold是一个物理状态。逻辑状态分离内容和表现形式，使用逻辑状态允许你用各种不同的方式来表达。比如你想把文字渲染成红色，使用其它大小的字体、带有下划线或其他样式，而不是加粗的样式。必须要理解使用strong呈现出的表现形式不同于单纯的加粗。

因为bold是一个物理状态，他没有区分表现形式和内容。如果让bold做了加粗文本外的其它任何事情，都将会令人困惑而且也不符合逻辑。

SEO

从规范来说，应该具有比普通内容更高的权重，而和内容权重一样。即便如此，它们也属于内容的一部分，还是会比<h1><h2>、<title>等标签要低。

各家搜索引擎是持续变化的一个黑箱。标签是否能提高关键词权重，过度使用是否可能导致搜索引擎处罚，有待进一步的验证。

无障碍

有些资料说，盲文阅读器会对标签朗读重音，对标签不做特殊处理。于是咱们对最常用的设备进行测试，在一个网页中分别使用和标签，并开启无障碍选项，分别朗读两个标签。

Windows（测试环境：Windows10 讲述人）：和都没有重音
ios（测试环境：ios11 旁白）：和都没有重音
Android（测试环境：talkback 5.1）：和都没有重音

很遗憾，目前主流的设备都没有对这两个标签做任何差异处理。

总结

和 在浏览器中的表现形式一致，日常使用场景没有差别，可以认为他们的作用是等价的。强迫症请按照标准操作，懒人全部都用也没有问题。

类似的问题还有：<del>和<s>有什么区别？答案也是：没有任何区别。

本文未经许可禁止转载，如需转载关注微信公众号【工程师加一】并留言。

钻牛角尖：<b> 和 <strong> 有什么区别？

定义

语义化

SEO

无障碍