Тег <html>: каркас документа
Из каких частей состоит минимальная страница и зачем указывать язык документа.
Зачем нужен этот элемент
html — корневой элемент страницы. Внутри находятся head с метаданными и body с видимым содержимым. Перед корнем ставится doctype, который включает стандартный режим обработки документа в браузере.
Атрибут lang у корня указывает основной язык. Он помогает произношению текста и другим языковым функциям. title называет вкладку браузера, а h1 — видимый заголовок страницы: эти элементы связаны по смыслу, но выполняют разные задачи.
Синтаксис и пример
<!doctype html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Мой первый сайт</title>
</head>
<body>
<main><h1>Привет, веб!</h1><p>Моя первая страница.</p></main>
</body>
</html>Что важно в разметке
| Параметр | Как использовать |
|---|---|
| <!doctype html> | Объявление стандартного режима. |
| lang="ru" | Основной язык документа. |
| head | Кодировка, title, подключения и метаданные. |
| body | Содержимое, которое видит пользователь. |
Частая ошибка
Не создавайте несколько body или head при объединении готовых фрагментов. Браузер попытается исправить документ, но результат может отличаться от ожиданий.
Небольшая практика
Сохраните пример как index.html. Измените title и h1 по отдельности и посмотрите, где проявляется каждое изменение.
Разберите также <meta>, <main>: эти элементы пригодятся в том же интерфейсе.
Попробуйте сами
РЕЗУЛЬТАТ · ИЗОЛИРОВАННЫЙ ПРЕДПРОСМОТР
Измените код и нажмите «Запустить». JavaScript и внешние запросы отключены.
Самостоятельный учебный материал. Техническая документация: первоисточник по теме ↗. Если результат отличается, проверьте код и версию браузера.