HTML5: семантика тегов <strong>, <b>, <em>, <i>

Появление стандарта HTML5 повлекло за собой необходимость выработки семантических правил в составлении разметки и семантического различия в использовании некоторых тегов. В частности, речь идет о тегах, отвечающих за полужирное и курсивное начертание текста.

Изначально использовались два вида тегов:  <b> (от англ. bold – полужирный) и <i> (от англ. italics – курсивный). Однако позднее в XHTML их частично заменяли тегами <strong> и <em>, что привело к некоторой путанице.

В этой связи разработчики HTML5 предлагают различать эти теги следующим образом:  

• <strong> - используется для выделения текста, имеющего первостепенное значение. Например, заголовок текста, сообщения;
• <b> - текст выделяется полужирным начертание, но его используют для привлечения внимания к какой-то части основного текста. Например, вы выделяете ключевые слова, название товара, чье-то имя и т.д.;
• <em> - курсивом выделяется та часть текста, на которую падает смысловое ударение. В устной речи такие предложения  мы произносим с особой интонацией;  
• <i> - преобразованию подвергается текст, который по каким-либо причинам отличается от основного: иностранные слова, технический текст и пр.

Пример разметки, где используются все четыре тега:

<strong>Важное объявление!</strong>
<em>Только сегодня</em> в клубе <b>ALEX FITNESS</b> вы сможете купить <i>абонемент на год</i> со скидкой 50%.