Теги верхнего уровня
Обновлено
23.08.2023Просмотров
363Время прочтения
10 мин.Сложность
К таким тегам можно отнести три тега: <html>, <body>, <head>. О каждом из них мы уже немного рассказывали, но теперь коснёмся подробно каждого.
<html>
— это основной контейнер для содержимого веб страницы. Его ещё называют корневым (root) элементом. С некоторой точки зрения этот тег и является самим html-документом. Кроме него на том же уровне могут располагаться лишь комментарии, обозначенные конструкцией <!— —>, и определяющий версию языка <!DOCTYPE>, который, в общем-то, тегом не является. Внутри <html> могут находиться только теги <head> и <body>, причём обязательно в этом же порядке.
К тегу применимы только глобальные атрибуты.
Всегда указывайте для тега <html> атрибут lang с соответствующим значением! Если основной контент вашего сайта на русском языке, укажите lang="
ru"
. Если английский или итальянский, значит lang="
en"
или lang="
it"
. Это поможет поисковым роботам, системам автоматического перевода, а также скринридерам (программа чтения с экрана — браузер для слепых и слабовидящих людей) правильно распознать контент веб страницы.
Совершенно обычной практикой также считается добавлять к корневому тегу классы, обозначая так те или иные состояния, возможности (например, поддержку определённых типов изображений). Пока что вам может быть не совсем понятно, о чём идёт речь и для чего это нужно, но в ходе последующих уроков вы разберётесь в этих вопросах.
<head>
— (с англ. head — голова) содержит главным образом машиночитаемую информацию (за исключением заголовка <title>) о документе, например описание страницы и ключевые слова для поисковых роботов, стили CSS, шрифты и пр. Вся иная информация, предназначенная для пользователя, как тексты, изображения, таблицы и т.п., находящаяся внутри этого тега, будет автоматически браузером перемещена в тег <body>.
К тегу применимы только глобальные атрибуты.
<body>
— (с англ. body — тело) основной контейнер для отображаемого на веб странице содержимого, но не обязательно только для него. То есть всё, что видит пользователь, мы размещаем внутри <body>, но также можем поместить там стили и скрипты, которые не видны пользователю. Такая практика со стилями и скриптами абсолютно нормальна, хотя столкнётесь с подобным примером вы, вероятно, не скоро.
К тегу применимы глобальные атрибуты. Все прочие атрибуты, которые могут к нему применяться, заменены JavaScript, стилями CSS или устарели, а потому не должны использоваться.
Подобно практике с атрибутом class для <html>, для схожих целей можно добавлять классы и для <body>.
Примеры кода с этими тегами мы уже приводили ранее в уроке «Структура HTML документа», поэтому здесь их повторять не будем, работа с ними довольна проста.