[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"question-osnovy-html-dlya-chego-prednaznachen-teg-head":3},{"id":4,"slug":5,"topicId":6,"topicSlug":7,"topicName":8,"topicEmoji":9,"question":10,"answer":11,"codeLang":12,"codeSrc":12,"important":12,"commonMistakes":12,"modernUsage":12,"difficulty":13,"tags":14,"related":18,"progress":19,"seo":20},1238,"dlya-chego-prednaznachen-teg-head",39,"osnovy-html","Основы HTML","📄","Для чего предназначен тег head","Тег `\u003Chead>` — это контейнер для метаданных HTML-документа, которые не отображаются на странице, но управляют поведением браузера, поисковых систем и внешних сервисов.\n\n> Аналогия из жизни: `\u003Chead>` — это как обложка и выходные данные книги. Читатель видит только содержание (body), но издатель, библиотекарь и поисковик используют информацию с обложки — название, автора, ISBN.\n\n### Допустимые элементы внутри head\n\n| Тег | Назначение | Пример |\n|-----|-----------|--------|\n| `\u003Ctitle>` | Заголовок вкладки браузера и результатов поиска | `\u003Ctitle>Главная\u003C\u002Ftitle>` |\n| `\u003Cmeta>` | Метаданные: кодировка, описание, viewport | `\u003Cmeta charset=\"UTF-8\">` |\n| `\u003Clink>` | Подключение внешних ресурсов (CSS, фавикон) | `\u003Clink rel=\"stylesheet\" href=\"style.css\">` |\n| `\u003Cstyle>` | Встроенные CSS-стили | `\u003Cstyle>body { margin: 0; }\u003C\u002Fstyle>` |\n| `\u003Cscript>` | JavaScript-код или подключение скриптов | `\u003Cscript src=\"app.js\">\u003C\u002Fscript>` |\n| `\u003Cbase>` | Базовый URL для всех относительных ссылок | `\u003Cbase href=\"https:\u002F\u002Fexample.com\u002F\">` |\n\n### Пример типичного head\n\n```html\n\u003Chead>\n    \u003Cmeta charset=\"UTF-8\">\n    \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    \u003Cmeta name=\"description\" content=\"Описание страницы для SEO\">\n    \u003Ctitle>Название страницы\u003C\u002Ftitle>\n    \u003Clink rel=\"stylesheet\" href=\"styles.css\">\n    \u003Clink rel=\"icon\" href=\"favicon.ico\">\n    \u003Cscript src=\"app.js\" defer>\u003C\u002Fscript>\n\u003C\u002Fhead>\n```\n\n### Порядок элементов\n\nРекомендуемый порядок: `\u003Cmeta charset>` первым (должен быть в первых 1024 байтах документа), затем `\u003Cmeta viewport>`, `\u003Ctitle>`, остальные `\u003Cmeta>`, `\u003Clink>`, `\u003Cscript>`.\n\n> **На собеседовании:** объясните, что `\u003Chead>` содержит метаданные (кодировка, заголовок, стили, скрипты), которые не отображаются на странице. Единственное исключение — `\u003Ctitle>`, который виден во вкладке браузера. Упомяните, что `\u003Cmeta charset=\"UTF-8\">` должен стоять в начале.","","junior",[15,16,17],"основы","html","frontend",[],null,{"title":21,"description":22,"ogTitle":21,"ogDescription":23,"keywords":24,"schemaAnswer":34,"featuredSnippetReady":35},"Для чего предназначен тег head — Gymterview","Тег head в HTML: контейнер метаданных документа. Допустимые элементы: title, meta, link, style, script, base. Порядок размещения и практические примеры.","Тег head — контейнер для метаданных HTML-документа: кодировка, заголовок, стили, скрипты. Что можно размещать внутри head.",[25,26,27,28,29,30,31,32,33],"head","тег head","метаданные HTML","title","meta","link","script","style","собеседование","Тег \u003Chead> — контейнер для метаданных HTML-документа, которые не отображаются на странице, но управляют поведением браузера, поисковых систем и внешних сервисов. Внутри размещают: \u003Ctitle>, \u003Cmeta>, \u003Clink>, \u003Cstyle>, \u003Cscript>, \u003Cbase>. Единственный видимый элемент — \u003Ctitle> (заголовок вкладки).",true]