Прошлым летом я прочитал полную спецификацию HTML5 и все предыдущие спецификации HTML (даже заброшенные), а также все спецификации CSS, которые я смог найти, и множество спецификаций XML. Поскольку я люблю семантически насыщенные гипертекстовые документы, позвольте мне дать вам представление о соответствующей семантике HTML в HTML5.
До HTML5
До HTML5 iи bправда были не в моде. Причина заключалась в том, что они по существу работали как emи strong, соответственно, но с акцентом на представление, а не на семантику (что плохо).
Действительно, iозначало, что текст должен быть выделен курсивом (он говорил что-то о том, как текст должен отображаться на экране). С другой стороны, emозначало, что текст должен быть подчеркнут (что-то говорит о семантике текста).
Здесь есть важное теоретическое отличие. Если вы используете em, пользовательский агент (= браузер) знает, что текст должен быть выделен, поэтому он может отображать его курсивом, если документ отображается на экране (или все заглавные буквы, если форматирование невозможно, или, возможно, даже жирным шрифтом пользователь предпочитает это), он может произносить его по-разному, если документ говорит пользователю и т. д.
Обратите внимание, что акцент действительно делается на семантику. Например, фразы
- Кошка моя. (= не собака!)
- Кот мой . (= не твое!)
не имеют того же значения.
То же самое относится к b(жирный шрифт) и strong(сильный акцент).
Общий принцип цифрового письма в целом и создания гипертекста в частности заключается в том, что вы должны разделять контент и стиль. При создании гипертекста это означает, что содержимое должно быть в файле HTML, а стиль должен быть в файле CSS (или нескольких файлах CSS). Другой, но связанный принцип состоит в том, что документ должен быть богат семантикой (например, разметка верхних и нижних колонтитулов, списков, выделений, адресов, областей навигации и т. Д.). Это имеет ряд преимуществ:
- Для компьютерных программ гораздо проще интерпретировать документ. Эти программы включают в себя браузеры, приложения преобразования текста в речь, поисковые системы и цифровых помощников. (Например, браузер может позволить вам сохранить адрес в адресной книге, если только он может найти и интерпретировать его. Кроме того, вы можете знать, что Microsoft Word может создать и автоматически обновить оглавление для вас, если вы правильно разметите заголовки .)
- Гораздо проще изменить стиль позже. (Если вы хотите изменить цвет всех заголовков третьего уровня в документе на 860 страниц, вы можете изменить одну строку в таблице стилей. Если бы у вас было смешанное содержимое и презентация, вам пришлось бы просматривать весь документ вручную И, возможно, вы пропустите заголовок или два, что сделает документ непрофессиональным.)
- Вы можете использовать разные таблицы стилей в зависимости от обстоятельств (документ отображается на экране или печатается на бумаге?). Вы даже можете позволить конечному пользователю выбрать стиль самостоятельно. (Мой веб-сайт предлагает несколько альтернативных таблиц стилей. В IE и FF их можно изменить с помощью меню «Вид».)
Итак, короче говоря, iи bустарели, потому что это были HTML-теги, связанные с представлением , что совершенно неверно.
В HTML5
В HTML5 iи bбольше не рекомендуется. Вместо этого им дают семантическое значение . Так что теперь они на самом деле о семантике, а не о представлении.
Как и прежде, использовать emразмечать внимание: «Кошка на мой.» Но вы используете iпочти во всех других случаях, когда вы будете использовать курсив в печатной работе. Например:
- Вы используете
iдля обозначения таксономических обозначений: «Мне нравится R. norvegicus ».
- Вы используете
iдля разметки фразу на другом языке по сравнению с окружающим текстом: à la carte
- Вы используете
iразметку слова, когда говорите о самом слове: « напиток - это и существительное, и глагол»
Также полезно использовать classатрибут, чтобы указать точное использование (также Google «микроформат» и «микроданные»). И, конечно же, во втором случае вы должны действительно использовать langатрибут, чтобы указать правильный язык. (В противном случае, например , агент преобразования текста в речь может неправильно произносить текст.)
Примерно год назад в спецификации HTML5 также указывалось, что она citeдолжна использоваться для разметки названий книг, фильмов, опер, картин и т. Д .:
- Что вы думаете о нимфоманка ?
Наконец, давным-давно dfnиспользуется для разметки определяющего экземпляра фразы в тексте (например, математическое определение или определение термина):
- Группа представляет собой набор X оснащен одной бинарной операцией * такой , что ...
Таким образом, курсив в вашей печатной книге, который может означать много разных вещей, представлен четырьмя различными тегами HTML5, что действительно здорово, потому что семантика хороша, как я пытался убедить вас об этом ранее. (Например, вы можете попросить свой браузер составить список всех определений в тексте, чтобы убедиться, что вы знаете их все до экзамена.)
Обращаясь к strongи b, спецификация HTML5 говорит, что это strongследует использовать для разметки важной части текста, например, предупреждения или какого-либо очень важного слова в предложении. С другой стороны, bследует использовать для разметки то, что должно быть легко найти в тексте, например ключевые слова. Я также использую в bкачестве заголовков в элементах списка (LI).
<b>и<i>не осуждаю.