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>
тег?