Для чего предназначен тег head
Тег <head> — это контейнер для метаданных HTML-документа, которые не отображаются на странице, но управляют поведением браузера, поисковых систем и внешних сервисов.
Аналогия из жизни:
<head>— это как обложка и выходные данные книги. Читатель видит только содержание (body), но издатель, библиотекарь и поисковик используют информацию с обложки — название, автора, ISBN.
Допустимые элементы внутри head
| Тег | Назначение | Пример |
|---|---|---|
<title> |
Заголовок вкладки браузера и результатов поиска | <title>Главная</title> |
<meta> |
Метаданные: кодировка, описание, viewport | <meta charset="UTF-8"> |
<link> |
Подключение внешних ресурсов (CSS, фавикон) | <link rel="stylesheet" href="style.css"> |
<style> |
Встроенные CSS-стили | <style>body { margin: 0; }</style> |
<script> |
JavaScript-код или подключение скриптов | <script src="app.js"></script> |
<base> |
Базовый URL для всех относительных ссылок | <base href="https://example.com/"> |
Пример типичного head
Пример
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Описание страницы для SEO">
<title>Название страницы</title>
<link rel="stylesheet" href="styles.css">
<link rel="icon" href="favicon.ico">
<script src="app.js" defer></script>
</head>
Порядок элементов
Рекомендуемый порядок: <meta charset> первым (должен быть в первых 1024 байтах документа), затем <meta viewport>, <title>, остальные <meta>, <link>, <script>.
На собеседовании: объясните, что
<head>содержит метаданные (кодировка, заголовок, стили, скрипты), которые не отображаются на странице. Единственное исключение —<title>, который виден во вкладке браузера. Упомяните, что<meta charset="UTF-8">должен стоять в начале.