CSS / HTML: Как правильно сделать текст курсивом?

Что этоверный способ сделать текст курсивом? Я видел следующие четыре подхода:

<i>Italic Text</i>

<em>Italic Text</em>

<span class="italic">Italic Text</span>

<span class="footnote">Italic Text</span>


<i>

Это «старый способ».<i> не имеет смыслового значения и передает только презентационный эффект выделения текста курсивом. Насколько я вижу, это явно неправильно, потому что это не семантическое.


<em>

Это использует семантическую разметку для чисто презентационных целей. Бывает так, что<em> по умолчанию текст отображается курсивом, поэтому его часто используют те, кто знает, что<i> следует избегать, но кто не знает о его семантическом значении. Не весь курсив является курсивом, потому что он выделен. Иногда, это может быть полная противоположность, как примечание стороны или шепот.


<span class="italic">

Это использует класс CSS для размещения презентации. Это часто рекламируется как правильный путь, но опять же, это кажется мне неправильным. Похоже, это не передает больше семантического значения,<i>, Но, как утверждают его сторонники, гораздо легче изменить весь текст, выделенный курсивом, позже, если, скажем, вы хотите, чтобы он был жирным. Но это не так, потому что тогда я остался бы с классом «курсив», который делал текст жирным. Кроме того, неясно, почему я бы хотел изменить весь курсивный текст на моем веб-сайте или, по крайней мере, мы можем подумать о случаях, когда это было бы нежелательно или необходимо.


<span class="footnote">

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

Не весь текст имеет достаточное значение, чтобы гарантировать семантическую разметку. Например, действительно ли выделенный курсивом текст внизу страницы является сноской? Или это в сторону? Или что-то еще полностью. Возможно, он не имеет особого значения и должен быть выделен только курсивом, чтобы отделить его от текста, предшествующего ему.

Семантическое значение может измениться, когда оно не присутствует в достаточной силе. Допустим, я согласился с «сноской», основанной только на тексте, который находится внизу страницы. Что происходит, когда через несколько месяцев я хочу добавить больше текста внизу? Это больше не сноска. Как мы можем выбрать семантический класс, который менее универсален, чем<em> но избегает этих проблем?


Резюме

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

Кроме того, желание отделить стиль от структуры привело к рекламе CSS как замены<i> когда есть случаи, когда это будет на самом деле менее полезно. Так что это оставляет меня обратно со скромным<i> Интересно, является ли этот ход мыслей причиной, по которой он остался в спецификации HTML5?

Есть ли хорошие посты в блоге или статьи на эту тему? Возможно, теми, кто участвует в решении сохранить / создать<i> тег?

Ответы на вопрос(12)

Ваш ответ на вопрос