Элемент head и метаданные веб-страницы
Последнее обновление: 08.04.2016
Основная часть документа html, фактически все, что мы увидим в своем браузере при загрузке веб-страницы, располагается между тегами <body> и </body>. Здесь размещаются большинство элементов html.
Хотя большинство элементов в HTML5 остаются теми же, что и в ранних версиях, но несколько изменился способ их использования. Рассмотрим базовые элементы HTML5, их предназначение и использование.
Как правило, одним из первых элементов html-документа является элемент head, задача которого состоит в установке метаданных страницы и ряда сопроводительной информации. Метаданные содержат информацию о html-документе.
Заголовок
Для установки заголовка документа, который отображается на вкладке браузера, используется элемент title
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Элемент title</title> </head> <body> <p>Содержание документа HTML5</p> </body> </html>
Элемент base
Элемент base
позволяет указать базовый адрес, относительно которого устанавливаются другие адреса, используемые в документе:
<!DOCTYPE html> <html> <head> <base href="content/"> <meta charset="utf-8"> <title>Элемент base</title> </head> <body> <a href="newpage. html">Перейти</a> </body> </html>
Хотя для ссылки в качестве адреса указана страница newpage.html, но фактически ее адресом будет content/newpage.html. То есть в одной папке с текущей страницей должна быть подпапка content, в которой должен находится файл newpage.html
Можно также указывать полный адрес:
<base href="http://www.microsoft.com/">
В это случае ссылка будет вести по адресу http://www.microsoft.com/newpage.html
Элемент meta
Элемент meta определяет метаданные документа.
Чтобы документ корректно отображал текст, необходимо задать кодировку с помощью атрибута charset. Рекомендуемой кодировкой является utf-8:
<meta charset="utf-8">
При этом надо помнить, что указанная элементе meta
кодировка должна совпадать с кодировкой самого документа. Как правило, текстовый редактор позволяет
указать кодировку документа. Если мы хотим ориентироваться на utf-8, то в настройках текстового редактора надо выбирать UTF-8 w/o BOM.
Например, выбор кодировки в Notepad++:
Элемент meta
также имеет два атрибута: name
и content. Атрибут name
содержит имя метаданных, а content
— их значение.
По умолчанию в HTML определены пять типов метаданных:
application name: название веб-приложения, частью которого является данный документ
author: автор документа
description: краткое описание документа
generator: название программы, которая сгенерировала данный документ
keywords: ключевые слова документа
Надо отметить, что наиболее актуальным является тип description
. Его значение поисковики часто используют в качестве аннотации к документу
в поисковой выдаче.
Добавим в документ ряд элементов meta:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <base href="content/"> <title>Элемент title</title> <meta name="description" content="Первый документ HTML5"> <meta name="author" content="Bill Gates"> </head> <body> <a href="newpage. html">Содержание документа HTML5</a> </body> </html>
НазадСодержаниеВперед
: Элемент метаданных документа (заголовок) — HTML: язык гипертекстовой разметки
HTML-элемент
содержит машиночитаемую информацию (метаданные) о документе, такую как его заголовок, сценарии и таблицы стилей.
Примечание:
в первую очередь содержит информацию для машинной обработки, а не для чтения человеком. Для информации, видимой человеку, такой как заголовки верхнего уровня и список авторов, см.
Этот элемент включает глобальные атрибуты.
-
профиль
Устаревший Нестандартный URI одного или нескольких профилей метаданных, разделенные пробелом.
<голова> <метакодировка="UTF-8" />Название документа голова>
Категории контента | Нет. |
---|---|
Разрешенный контент | Если документ В противном случае один или несколько элементов содержимого метаданных, где ровно один
это |
Отсутствие тега | Начальный тег может быть опущен, если первое, что находится внутри element — это элемент. Конечный тег может быть опускается, если первое, что следует за Элемент не является пробелом или комментарием. |
Разрешенные родители | Ан элемент, как его первый дочерний элемент. |
Неявная роль ARIA | Нет соответствующей роли |
Разрешенные роли ARIA | Нет роль разрешено |
Интерфейс DOM | HTMLHeadElement |
Спецификация |
---|
Стандарт HTML # the-head-element |
Таблицы BCD загружаются только в браузере с включенным JavaScript. Включите JavaScript для просмотра данных.
- Элементы, которые можно использовать внутри
-
<название>
-
<база>
-
<ссылка>
-
<стиль>
-
<мета>
-
<сценарий>
-
-
<шаблон>
-
Обнаружили проблему с содержанием этой страницы?
- Отредактируйте страницу на GitHub.
- Сообщить о проблеме с содержимым.
- Посмотреть исходный код на GitHub.
Хотите принять участие?
Узнайте, как внести свой вклад.
Последний раз эта страница была изменена участниками MDN.
Работа с элементами заголовка HTML
Рекламные объявления
В этом уроке вы узнаете о важности элементов головы.
Элемент заголовка HTML
Элемент
в основном является контейнером для всех элементов заголовка, которые предоставляют дополнительную информацию о документе (метаданные) или ссылки на другие ресурсы, необходимые для отображения документа или правильно вести себя в веб-браузере.
Элементы head собирательно описывают свойства документа, такие как заголовок, предоставляют метаинформацию, такую как набор символов, указывают браузеру, где найти таблицы стилей или скрипты, которые позволяют расширять HTML-документ активными и интерактивными способами.
Внутри элемента
можно использовать следующие элементы HTML:
,
,
, ,
4,
и элемент.
Элемент заголовка HTML
Элемент
определяет заголовок документа.
Элемент title требуется во всех документах HTML/XHTML для создания действительного документа.В документе допускается только один элемент заголовка,и он должен быть помещен в пределах
элемент. Элемент title содержит простой текст и объекты;он не может содержать другие теги разметки.
Название документа может использоваться для различных целей. Например:
- Для отображения заголовка в строке заголовка браузера и на панели задач.
- Для указания заголовка страницы,когда она добавляется в избранное или добавляется в закладки.
- Для отображения заголовка страницы в результатах поиска.
В следующем примере показано,как разместить заголовок в HTML-документе.
Пример
Попробуйте этот код »<голова>Простой HTML-документ голова><тело>Привет,мир!
тело>
Базовый элемент HTML
Элемент HTML
используется для определения базового URL-адреса для всех относительных ссылок,содержащихся в документе,например. вы можете установить базовый URL-адрес один раз в верхней части страницы,а затем все последующие относительные ссылки будут использовать этот URL-адрес в качестве отправной точки. Вот пример:
Пример
Попробуйте этот код »<голова>Определение базового URL <база href="https://www. tutorialrepublic.com/">голова><тело>тело>
Гиперссылка в приведенном выше примере фактически преобразуется в https://www.tutorialrepublic.com/html-tutorial/html-head.php
независимо от URL-адреса текущей страницы. Это связано с тем,что относительный URL,указанный в ссылке:html-tutorial/html-head.php
,добавляется в конец базового URL:https://www.tutorialrepublic.com/
.
Предупреждение:Элемент HTML
должен стоять перед любым элементом,ссылающимся на внешний ресурс. HTML допускает только один базовый элемент для каждого документа.
Элемент ссылки HTML
Элемент определяет связь между текущим документом и внешними документами или ресурсами. Обычно элемент link используется для ссылки на внешние таблицы стилей.
Пример
Попробуйте этот код »Связывание таблиц стилей css">
Пожалуйста,ознакомьтесь с разделом руководства по CSS,чтобы узнать подробнее о таблицах стилей.
Примечание:Элемент HTML-документа может содержать любое количество
элементов
. Элемент имеет атрибуты,но не имеет содержимого.
Элемент стиля HTML
Элемент используется для определения встроенной информации о стиле для документа HTML. Правила стиля внутри элемента
определяют,как элементы HTML отображаются в браузере.
Пример
Попробуйте этот код »Внедрение таблиц стилей <стиль>body{цвет фона:#9acd32}h2{цвет:красный}р{цвет:зеленый}стиль>
Примечание:Встроенная таблица стилей должна использоваться,когда отдельный документ имеет уникальный стиль. Если одна и та же таблица стилей используется в нескольких документах,более подходящей будет внешняя таблица стилей.