<em>: Элемент выделения

Элемент <em> HTML отмечает текст, на котором нужно сделать акцент. Элемент <em> может быть вложен, причем каждый уровень вложенности указывает на более сильный акцент.

Этот элемент содержит только глобальные атрибуты.

Элемент <em> предназначен для слов, которые необходимо выделить, подчеркнуть по сравнению с окружающим текстом, часто ограничивается словом или словами в предложении и влияет на значение самого предложения.

Обычно этот элемент отображается курсивом. Однако его не следует использовать для применения курсивного стиля; для этой цели используйте свойство CSS font-style. Для выделения заголовка произведения (книги, пьесы, песни и т. д.) используйте элемент <cite>. Используйте элемент <i> для выделения текста в другом тоне или настроении, что охватывает многие распространенные ситуации для курсива, такие как научные названия или слова на других языках. Используйте элемент <strong> для выделения текста, который имеет большее значение, чем окружающий текст.

Некоторых разработчиков может сбивать с толку, как несколько элементов, по-видимому, дают похожие визуальные результаты. <em> и <i> — типичный пример, поскольку оба они делают текст курсивом. В чем разница? Какой из них следует использовать?

По умолчанию визуальный результат одинаковый. Однако семантическое значение различается. Элемент <em> представляет собой акцент на содержании, а элемент <i> представляет текст, отделенный от обычного текста, например, иностранное слово, мысли вымышленного персонажа или когда текст ссылается на определение слова вместо представления его семантического значения. (Для заголовка произведения, например, названия книги или фильма, следует использовать <cite>.)

Это означает, что выбор правильного элемента зависит от ситуации. Ни один из них не предназначен только для декоративных целей, для этого предназначен CSS-стиль.

Примеры для <em> могут быть такими:

<p>Just <em>do</em> it already!</p>
<p>We <em>had</em> to do something about it.</p>

Человек или программа, читающая текст, произносили бы слова курсивом с ударением, используя словесное ударение.

Примеры для <i> могут быть такими:

<p>The word <i>the</i> is an article.</p>
<p>The <i>Queen Mary</i> sailed last night.</p>

Здесь нет дополнительного ударения или важности слова «Королева Мария». Это просто указание на то, что объект, о котором идет речь, не является королевой по имени Мария, а судном по имени «Королева Мария».

В этом примере элемент <em> используется для выделения явного или неявного контраста между двумя списками ингредиентов:

<p>
  Ice cream is made with milk, sweetener, and cream. Frozen custard, on the
  other hand, is made of milk, cream, sweetener, and <em>egg yolks</em>.
</p>

• <i>