Главная страница   /   8. Разметка текста (Руководство по HTML5

Руководство по HTML5

Руководство по HTML5

Адам Фриман

8. Разметка текста

Мы собираемся переключиться с больших структурных элементов документа на нечто гораздо более специфичное: элементы текстового уровня (текстовые элементы, для краткости). При применении этих элементов к тексту вы добавляете структуру и смысл. Это станет очевидным, когда вы проработаете примеры, приведенные в этой главе.

Спецификация HTML5 четко указывает на то, что вы должны использовать элементы только для их семантического значения. Однако чтобы сделать жизнь проще, спецификация также указывает, что традиционный стиль, связанный с этими элементами, является частью семантического значения для некоторых элементов. Это немного надуманно, но полезно для поддержки совместимости со старыми версиями HTML.

Некоторые из этих элементов имеют очень конкретный смысл. Например, элемент cite используется только для цитирования названия другого произведения, такого как книга или фильм. Однако, многие другие элементы более неоднозначны и, несмотря на все усилия стандарта HTML5, по существу, связаны с презентацией.

Мой совет заключается в том, что тут нужен прагматический подход. Во-первых, нужно использовать элементы, предназначенные для решения конкретных задач, если таковые имеются в наличии. Во-вторых, стоит избегать тех элементов, которые раньше имели только презентационный смысл и смысловое значение которых сейчас применяется ретроспективно, например, элемент b, а вместо этого стоит управлять презентацией при помощи CSS. Наконец, независимо от того, какие элементы вы решите использовать, применять их последовательно по всему вашему HTML. В таблице 8-1 приведено краткое содержание этой главы.

Таблица 8-1: Краткое содержание главы
Задача Решение Листинг
Создать гиперссылку на другой документ Использовать элемент a, в качестве значения его атрибута href может быть абсолютный или относительный URL 8-1, 8-2
Создать гиперссылку на элемент в том же документе Использовать элемент a, с id селектором CSS стиля для целевого элемента 8-3
Выделить текст без придания дополнительной важности или значимости Использовать элементы b или u 8-4, 8-9
Обозначить экспрессивно-эмоциональное выделение Использовать элемент em 8-5
Обозначить научные термины или иностранные слова Использовать элемент i 8-6
Обозначить неточное или неправильное содержание Использовать элемент s 8-7
Обозначить важность Использовать элемент strong 8-8
Обозначить мелкий шрифт Использовать элемент small 8-10
Обозначить верхний или нижний индекс Использовать элементы sup или sub 8-11
Обозначить разрыв строки или возможность для разрыва строки Использовать элементы br или wbr 8-12, 8-13
Представить компьютерный код, результат выполнения программы или переменную или данные, введенные пользователем Использовать элементы code, var, samp или kbd 8-14
Обозначить аббревиатуру Использовать элемент abbr 8-15
Обозначить определение термина Использовать элемент dfn 8-16
Обозначить цитируемое содержание Использовать элемент q 8-17
Цитировать название другой работы Использовать элемент cite 8-18
Обозначить аннотацию ruby для восточноазиатских языков Использовать элементы ruby, rt и rp 8-19
Указать направление для отрывка текста Использовать элемент bdo 8-20
Изолировать отрывок текста, чтобы задать направление Использовать элемент bdi 8-21, 8-22
Применить к содержанию глобальный атрибут Использовать элемент span 8-23
Обозначить содержание, которое имеет значение в другом контексте Использовать элемент mark 8-24
Обозначить текст, который был добавлен или удален из документа Использовать элементы ins и del 8-25
Обозначить время или дату Использовать элемент time 8-26

8.1. Создание гиперссылок

8.2. Добавление акцента

8.3. Разрыв строки

8.4. Представление ввода/вывода

8.5. Создание цитат, определений и аббревиатур

8.6. Работа с языковыми элементами

8.7. Заключение: другие текстовые элементы

8.8. Резюме