Для чего используется метаданные html

Элементы в HTML5

Основная часть документа html, фактически все, что мы увидим в своем браузере при загрузке веб-страницы, располагается между тегами и . Здесь размещаются большинство элементов html.

Хотя большинство элементов в HTML5 остаются теми же, что и в ранних версиях, но несколько изменился способ их использования. Рассмотрим базовые элементы HTML5, их предназначение и использование.

Элемент head и метаданные веб-страницы

Как правило, одним из первых элементов html-документа является элемент head , задача которого состоит в установке метаданных страницы и ряда сопроводительной информации. Метаданные содержат информацию о html-документе.

Заголовок

Для установки заголовка документа, который отображается на вкладке браузера, используется элемент title

      
Содержание документа HTML5
   

Элемент base

Элемент base позволяет указать базовый адрес, относительно которого устанавливаются другие адреса, используемые в документе:

       Перейти   

Хотя для ссылки в качестве адреса указана страница newpage.html, но фактически ее адресом будет content/newpage.html. То есть в одной папке с текущей страницей должна быть подпапка content, в которой должен находится файл newpage.html

Можно также указывать полный адрес:

В это случае ссылка будет вести по адресу http://www.microsoft.com/newpage.html

Элемент meta

Элемент 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:

       Содержание документа HTML5   

Для чего используется метаданные html

определяет метатеги, которые используются для хранения информации предназначенной для браузеров и поисковых систем. Например, механизмы поисковых систем обращаются к метатегам для получения описания сайта, ключевых слов и других данных. Разрешается использовать более чем один метатег, все они размещаются в контейнере . Как правило, атрибуты любого метатега сводятся к парам «имя=значение», которые определяются ключевыми словами content , name или http-equiv .

Синтаксис

Атрибуты

charset Задает кодировку документа. content Устанавливает значение атрибута, заданного с помощью name или http-equiv . http-equiv Предназначен для конвертирования метатега в заголовок HTTP. name Имя метатега, также косвенно устанавливает его предназначение.

Закрывающий тег

HTML5 IE Cr Op Sa Fx

      
.
  

Метаданные¶

В разделе «Структура документа» вы узнали о компонентах, которые (почти) всегда находятся в HTML-документа. Хотя все, что находится в , включая , , , и менее используемый , фактически является «метаданными», для метаданных, которые не могут быть представлены этими другими элементами, существует тег .

Спецификация включает в себя несколько метатипов, и существует много, много других метатипов, поддерживаемых приложениями и не включенных ни в одну официальную спецификацию. В этом разделе мы обсудим атрибуты и значения, включенные в спецификации, некоторые распространенные имена метаданных и значения содержимого, а также несколько метатипов, невероятно полезных для поисковой оптимизации, размещения в социальных сетях и удобства пользователей, которые официально не определены WHATWG или W3C.

Обязательные теги , повторное рассмотрение¶

Давайте вернемся к двум уже рассмотренным необходимым тегам — объявлению character set и метатегу viewport — и в процессе разберемся с тегом .

Атрибут charset элемента появился уникальным образом. Первоначально метаданные о наборе символов записывались в виде » /> , но многие разработчики ошибочно указывали атрибут content как content=»text/html» charset=»» , поэтому браузеры стали поддерживать charset как атрибут. В настоящее время он стандартизован в живом стандарте HTML как » /> , где для HTML — это нечувствительная к регистру строка «utf-8» .

Возможно, вы заметили, что в оригинальном объявлении мета-набора символов использовался атрибут http-equiv . Это сокращение от «http-эквивалент», поскольку метатег, по сути, повторяет то, что может быть задано в HTTP-заголовке. Кроме исключения charset , все остальные метатеги, определенные в спецификации WHATWG HTML, содержат либо атрибут http-equiv , либо name .

Официально определенные метатеги¶

Существует два основных типа метатегов: директивы pragma с атрибутом http-equiv , как это было в метатеге charset , и именованные метатеги, как метатег viewport с атрибутом name , о котором мы говорили в разделе Структура документа. Оба метатипа — name и http-equiv — должны включать атрибут content , определяющий содержание перечисленного типа метаданных.

Директивы Pragma¶

Атрибут http-equiv имеет в качестве своего значения директиву pragma . Эти директивы описывают, как должна быть разобрана страница. Поддерживаемые значения http-equiv позволяют задавать директивы, когда нет возможности задать HTTP-заголовки напрямую.

В спецификации определено семь директив pragma, большинство из которых имеют другие способы задания. Например, хотя вы можете включить директиву языка с помощью , мы уже обсуждали использование атрибута lang на элементе HTML, который и следует использовать вместо этого.

Наиболее распространенной директивой pragma является директива refresh .

1 2 3 4

meta http-equiv="refresh" content="60; https://machinelearningworkshop.com/regTimeout" /> 

Хотя вы можете установить директиву на обновление с интервалом в несколько секунд, заданным в атрибуте content , и даже перенаправить на другой URL, пожалуйста, не делайте этого. Обновление и перенаправление содержимого без явного запроса пользователя является плохим юзабилити и негативно влияет на доступность. Разве вам не неприятно, когда вы находитесь на середине абзаца, а страница сбрасывается? Представьте себе, что у вас проблемы с когнитивными способностями или зрением, а тут такое. Если вы собираетесь установить обновление с переадресацией, убедитесь, что у пользователя есть достаточно времени для прочтения страницы, ссылка для ускорения процесса и, если необходимо, кнопка для «остановки часов» и предотвращения переадресации.

Мы не будем включать эту директиву в наш сайт, поскольку нет никаких причин для тайм-аута пользовательской сессии, кроме раздражения наших посетителей.

Наиболее полезной директивой pragma является content-security-policy , которая позволяет определить политику содержимого для текущего документа. В основном в политиках содержимого указываются разрешенные источники сервера и конечные точки сценариев, что позволяет защититься от межсайтовых скриптовых атак.

1 2 3 4

meta http-equiv="content-security-policy" content="default-src https:" /> 

Если у вас нет доступа к изменению HTTP-заголовков (или если он есть), то вот список разделенных пробелами значений содержимого для директив content-security-policy .

Именованные метатеги¶

Чаще всего вы включаете именованные метаданные. Включите атрибут name , а значение атрибута — это имя метаданных. Как и в случае с директивами pragma , атрибут content является обязательным.

Атрибут name является именем метаданных. В дополнение к viewport вы, вероятно, захотите включить description и theme-color , но не keywords .

Ключевые слова¶

Продавцы «змеиного масла» поисковой оптимизации злоупотребляют метатегом keywords , заполняя его списками спамных слов, разделенных запятыми, вместо списков релевантных ключевых терминов, поэтому поисковые системы больше не считают эти метаданные полезными. Не стоит тратить время, силы и байты на его добавление.

Описание¶

Значение description , однако, очень важно для SEO: помимо того, что оно помогает сайтам ранжироваться на основе контента, значение description часто является тем, что поисковые системы отображают под заголовком страницы в результатах поиска. Некоторые браузеры, например Firefox и Opera, используют это значение в качестве описания по умолчанию для страниц, занесенных в закладки. Описание должно представлять собой краткое и точное изложение содержания страницы.

1 2 3 4

meta name="description" content="Register for a machine learning workshop at our school for machines who can't learn good and want to do other stuff good too" /> 

Если вторая половина нашего описания не имеет для вас смысла, то вы, вероятно, не смотрели фильм Zoolander.

Роботы¶

Если вы не хотите, чтобы ваш сайт индексировался поисковыми системами, вы можете сообщить им об этом. указывает ботам не индексировать сайт и не переходить по ссылкам. Боты должны прислушаться к этому запросу, но нет закона, требующего, чтобы они его выполняли. Не нужно включать для запроса индексации сайта и перехода по ссылкам, так как это делается по умолчанию, если в HTTP-заголовках не указано иное.

meta name="robots" content="index, follow" /> 

Цвет темы¶

Значение theme-color позволяет задать цвет для настройки интерфейса браузера. Значение color в атрибуте content будет использоваться поддерживающими браузерами и операционными системами, позволяя задать предлагаемый цвет для пользовательских агентов, поддерживающих окрашивание строки заголовка, панели вкладок или других компонентов Chrome. Этот метатег особенно полезен для прогрессивных веб-приложений. Но если вы включаете файл манифеста, который требуется для PWA, то можете включить цвет темы в него. Однако определение его в HTML гарантирует, что цвет будет найден сразу, до рендеринга, что может быть быстрее при первой загрузке, чем ожидание манифеста.

Чтобы задать цвет темы, соответствующий синему тону фона нашего сайта, включите:

meta name="theme-color" content="#226DAA" /> 

Метатег «Цвет темы» может включать атрибут media , позволяющий устанавливать различные цвета темы на основе медиазапросов. Атрибут media может быть включен только в этот метатег и игнорируется во всех остальных метатегах.

Существует несколько других мета-значений name , но рассмотренные нами являются наиболее распространенными. За исключением объявления разных значений theme-color для разных медиазапросов, включайте только по одному из каждого метатега. Если для поддержки старых браузеров необходимо включить несколько типов метатегов, то старые значения должны располагаться после новых, поскольку пользовательские агенты считывают последовательные правила, пока не найдут подходящее.

Open Graph¶

Open Graph и аналогичные протоколы метатегов могут использоваться для управления отображением ссылок на ваш контент в социальных сетях, таких как Twitter, LinkedIn и Facebook. Если протокол не включен, сайты социальных сетей будут правильно воспринимать заголовок вашей страницы и описание из метатега description — ту же информацию, что и поисковые системы, но вы можете намеренно задать то, что вы хотите, чтобы пользователи видели при размещении ссылки на ваш сайт.

При размещении ссылки на hcdev.ru в Facebook или Twitter появляется карточка с изображением, названием сайта и его описанием. Вся карточка представляет собой гиперссылку на указанный вами URL.

Метатеги Open Graph имеют по два атрибута: атрибут property вместо атрибута name и содержимое или значение этого свойства. Атрибут property не определен в официальных спецификациях, но широко поддерживается приложениями, поддерживающими протокол Open Graph. Создание «новых» атрибутов типа property гарантирует, что значения атрибутов, созданные для атрибута протокола, не будут конфликтовать с будущими значениями атрибутов name или http-equiv .

Давайте создадим медиакарту Facebook:

 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

meta property="og:title" content="Machine Learning Workshop" /> meta property="og:description" content="School for Machines Who Can't Learn Good and Want to Do Other Stuff Good Too" /> meta property="og:image" content="http://www.machinelearningworkshop.com/image/all.png" /> meta property="og:image:alt" content="Black and white line drawing of refrigerator, french door refrigerator, range, washer, fan, microwave, vaccuum, space heater and air conditioner" /> 

Включите заголовок поста для отображения. Заголовок обычно отображается под изображением и над описанием. Описание должно состоять не более чем из трех предложений, в которых кратко излагается суть вашего сообщения. Оно будет отображаться после заголовка, заданного в og:title . Укажите абсолютный URL-адрес изображения баннера, которое вы хотите отобразить, включая протокол https:// . При включении изображения в HTML всегда включайте альтернативное текстовое описание изображения, даже если оно будет отображаться в другом месте. Для карточек социальных сетей Open Graph определите alt в качестве значения содержимого для свойства og:image:alt . Вы также можете включить канонический URL с помощью свойства og:url .

Все эти метатеги определены в Open Graph protocol. Значения должны соответствовать содержимому, которое вы хотели бы отобразить в стороннем веб-приложении.

Другие социальные сети имеют свои собственные синтаксисы, например Twitter card markup. Это позволяет предоставлять различные возможности в зависимости от того, где появляется ссылка, или обеспечивать отслеживание ссылок путем добавления параметра в конце URL.

 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

meta name="twitter:title" content="Machine Learning Workshop" /> meta name="twitter:description" content="School for machines who can't learn good and want to do other stuff good too" /> meta name="twitter:url" content="https://www.machinelearningworkshop.com/?src=twitter" /> meta name="twitter:image:src" content="http://www.machinelearningworkshop.com/image/all.png" /> meta name="twitter:image:alt" content="27 different home appliances" /> meta name="twitter:creator" content="@estellevw" /> meta name="twitter:site" content="@perfmattersconf" /> 

В случае с Twitter, чтобы значение атрибута name не противоречило будущим спецификациям, вместо использования нового атрибута, такого как атрибут property в Open Graph, для данных карты Twitter все значения name имеют префикс twitter: .

Посмотреть, как будет выглядеть ваша карточка социальной сети, можно на сайтах Twitter и Facebook.

Для разных социальных сетей или для разных параметров ссылки можно использовать разные изображения, заголовки и описания карточки. Например, https://perfmattersconf.com устанавливает различные значения для og:image , og:title и og:description в зависимости от параметра URL.

Карточка с изображением докладчика конференции.

Та же карта с реквизитами для другого докладчика.

Если ввести https://perfmattersconf.com?name=erica и https://perfmattersconf.com?name=melanie в Twitter’s Card Validator, то вы увидите две разные карточки; мы предоставили разное содержание, хотя обе они ссылаются на одну и ту же главную страницу конференции.

Другая полезная метаинформация¶

Если кто-то добавляет ваш сайт в закладки, добавляя его на домашний экран, или если ваш сайт является прогрессивным веб-приложением или работает в автономном режиме или без отображения функций браузера chrome, вы можете предоставить иконки приложений для домашнего экрана мобильного устройства.

Для ссылки на используемые изображения запуска можно использовать тег . Вот пример включения нескольких изображений с помощью медиазапросов:

 1 2 3 4 5 6 7 8 9 10

link rel="apple-touch-startup-image" href="icons/ios-portrait.png" media="orientation: portrait" /> link rel="apple-touch-startup-image" href="icons/ios-landscape.png" media="orientation: landscape" /> 

Если ваш сайт или приложение поддерживает работу с веб-приложениями, то есть может работать самостоятельно с минимальным пользовательским интерфейсом, например, без кнопки «Назад», вы можете использовать метатеги, чтобы сообщить об этом браузеру:

meta name="apple-mobile-web-app-capable" content="yes" /> meta name="mobile-web-app-capable" content="yes" /> 

Включайте их только в том случае, если ваше приложение действительно поддерживает приложения. В противном случае вы подставите своих самых ярых сторонников, тех, кто добавил ваш сайт на домашний экран, под неприятные впечатления. Вы потеряете их любовь!

Если кто-то собирается сохранить ваш значок на домашнем экране своего миниатюрного устройства, необходимо предоставить операционной системе короткое имя, которое не займет много места на домашнем экране маленького устройства. Для этого можно включить метатег или использовать файл webmanifest. Ниже показан метод использования метатега:

meta name="apple-mobile-web-app-title" content="MLW" /> meta name="application-name" content="MLW" /> 

Вы рассмотрели несколько метатегов, каждый из которых сделает ваш заголовок длиннее. Если вы действительно создаете прогрессивное веб-приложение, способное работать в автономном режиме, то вместо включения этих двух дополнительных метатегов можно более просто и лаконично включить short_name: MLW в файл webmanifest.

Файл манифеста может предотвратить появление громоздкого заголовка, заполненного тегами и . Мы можем создать файл манифеста, обычно называемый manifest.webmanifest или manifest.json . Затем мы используем удобный тег с атрибутом rel , установленным на manifest , и атрибутом href , установленным на URL файла манифеста:

link rel="manifest" href="/mlw.webmanifest" /> 

Эта серия посвящена HTML, но вы можете ознакомиться с курсом по прогрессивным веб-приложениям или MDN’s web app manifest documentation.

Теперь ваш HTML выглядит примерно так:

 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80

 html lang="en"> head> meta charset="utf-8" /> title>Machine Learning Workshoptitle> meta name="viewport" content="width=device-width" /> meta name="description" content="Register for a machine learning workshop at our school for machines who can't learn good and want to do other stuff good too" /> meta property="og:title" content="Machine Learning Workshop" /> meta property="og:description" content="School for Machines Who Can't Learn Good and Want to Do Other Stuff Good Too" /> meta property="og:image" content="http://www.machinelearningworkshop.com/image/all.png" /> meta property="og:image:alt" content="Black and white line drawing of refrigerator, french door refrigerator, range, washer, fan, microwave, vaccuum, space heater and air conditioner" /> meta name="twitter:title" content="Machine Learning Workshop" /> meta name="twitter:description" content="School for machines who can't learn good and want to do other stuff good too" /> meta name="twitter:url" content="https://www.machinelearningworkshop.com/?src=twitter" /> meta name="twitter:image:src" content="http://www.machinelearningworkshop.com/image/all.png" /> meta name="twitter:image:alt" content="27 different home appliances" /> meta name="twitter:creator" content="@estellevw" /> meta name="twitter:site" content="@perfmattersconf" /> link rel="stylesheet" src="css/styles.css" /> link rel="icon" type="image/png" href="/images/favicon.png" /> link rel="alternate" href="https://www.machinelearningworkshop.com/fr/" hreflang="fr-FR" /> link rel="alternate" href="https://www.machinelearningworkshop.com/pt/" hreflang="pt-BR" /> link rel="canonical" href="https://www.machinelearning.com" /> link rel="manifest" href="/mlwmanifest.json" /> head> body> --> body> html> 

Получилось довольно длинно, но дело сделано. Он был бы гораздо длиннее, но вы обобщили все иконки, краткие названия и т.д. в файле manifest, что позволило вам опустить многие теги и ,

Теперь, когда ваш в основном готов, вы можете погрузиться в семантический HTML.

1.11.2. Метаданные документа

К метаданным относится содержимое, которое устанавливает представление или поведение остального содержимого, отношения документа с другими документами, или передает другую «внешнюю» информацию.

HTML-элементы, семантика которых связана с метаданными

• Содержание:
• 1. Элемент
• 2. Элемент
• 3. Элемент
• 4. Элемент
• 5. Элемент
• 6. Элемент

1. Элемент

Категории содержимого: нет.

Контекст, в котором этот элемент может быть использован: как первый элемент в элементе .

Пропуск тегов: начальный тег может быть пропущен, если элемент пуст, или если сразу после него идет другой HTML-элемент. Закрывающий тег может быть пропущен, если он не следует сразу за пробелом или за комментарием.

   
Тестовая страница
 

Раздел . содержит набор технической информации (метаданных) о текущей веб-странице: заголовок, описание, ключевые слова для поисковых машин, кодировку и т.д. Введенная в нем информация не отображается в окне браузера, однако содержит данные, которые указывают браузеру, как следует обрабатывать страницу.

Набор метаданных может быть как большим, так и маленьким:

     . 

      . 

2. Элемент

Категории содержимого: метаданные.

Контекст, в котором этот элемент может быть использован: в элементе , не содержащем других элементов .

Пропуск тегов: ни один из тегов не может быть пропущен.

Элемент представляет заголовок или название документа (веб-страницы). Авторы должны использовать заголовки, которые дают поисковой системе понять, что содержится на странице, даже если заголовки используются вне контекста, например, в истории, закладках пользователя или в результатах поиска. Заголовок документа может отличаться от заголовка первого уровня, поскольку не должен стоять отдельно, когда он вырван из контекста.

 . 
Что такое Flexbox
 
.
 

Текст внутри отображается браузером в заголовке окна. Также этот текст будет содержать ссылку на ваш сайт на странице результатов поиска. Длина заголовка должна быть не более 60 символов, чтобы поместиться полностью.

В одном документе должно быть не более одного элемента . Элемент является обязательным в большинстве ситуаций, но если протокол более высокого уровня предоставляет информацию о заголовке, например, в строке «Тема» электронного письма, когда HTML используется в качестве формата создания электронного письма, элемент может быть опущен.

3. Элемент

Категории содержимого: метаданные.

Контекст, в котором этот элемент может быть использован: в элементе , не содержащем других элементов .

Пропуск тегов: отсутствует закрывающий тег.

Элемент с помощью атрибута href предоставляет базовый URL документа для парсинга всех относительных URL-адресов на странице, установленных атрибутами src и href .

Атрибут target задает тип окна просмотра по умолчанию при переходе по всем гиперссылкам.

В одном документе может быть только один элемент и он должен иметь атрибут href , target или оба сразу.

Элемент должен находиться перед любыми другими элементами в дереве, которые имеют атрибуты, определенные как принимающие URL, кроме элемента (его атрибут manifest не подвержен влиянию элемента ).

     
Посетите страницу архивов.
  

Ссылка в приведенном выше примере будет ссылкой на https://www.example.com/news/archives.html .

4. Элемент

Категории содержимого: метаданные. Если его использование разрешено в — потоковое или текстовое содержимое.

Контекст, в котором этот элемент может быть использован: где ожидаются метаданные. В элементе , который является дочерним элементом элемента . Если элемент разрешен в — там, где ожидается текстовое содержимое.

Пропуск тегов: отсутствует закрывающий тег.

Для элемента доступны ‎глобальные атрибуты, а также атрибуты, приведенные в таблице:

Таблица 1. Атрибуты элемента

Атрибут	Описание, принимаемое значение
href	Задает адрес гиперссылки.
crossorigin	Описывает, как элемент обрабатывает CORS-запросы, предназначен для использования со ссылками на внешние ресурсы.
rel	Задает тип указанной ссылки, может содержать как одно значение, так и набор разделенных пробелами ключевых слов: alternate , dns-prefetch , icon , next , pingback , preconnect , prefetch , preload , prerender , search , serviceworker .
rev	Описывает обратное отношение текущего документа к связываемому документу, как определено атрибутом href .
media	Указывает, к какому типу медиа относится ресурс. Значение должно быть допустимым списком медиазапросов.
nonce	Используется в проверках политики безопасности контента, представляет криптографический одноразовый номер, который может использоваться политикой безопасности содержимого, чтобы определить, будет ли внешний ресурс, указанный в ссылке, загружаться и применяться к документу.
hreflang	Задает язык связанного ресурса.
type	Устанавливает подсказку для типа ссылочного ресурса.
referrerpolicy	Указывает URL источника запроса при переходе с одной страницы на другую.
sizes	Задает размеры иконок (для rel=»icon» ) для визуальных медиа, значение носит рекомендательный характер.
title	Устанавливает заголовок ссылки, альтернативное имя таблицы стилей.

Атрибут href элемента позволяет связывать HTML-документ с различным видами ресурсов, например, таблицами стилей, скриптами, альтернативными формами документа и ссылками навигации (оглавление, предыдущие и последующие страницы, уведомления об авторских правах и т.п.).

Тип связанного ресурса задается значением обязательного атрибута rel .

С помощью элемента можно создать две категории ссылок: ссылки на внешние ресурсы и гиперссылки. Например, следующий элемент ссылки создает две гиперссылки (на одну и ту же страницу):

Семантика первой состоит в том, что целевая страница содержит информацию об авторе текущей страницы, семантика второй заключается в том, что целевая страница содержит информацию о лицензии, под которой предоставляется текущая страница.

Гиперссылки, созданные с помощью элемента и его атрибута rel , применяются ко всему документу. Это отличается от атрибута rel элементов и , который указывает тип ссылки, контекст которой определяется местоположением ссылки в документе.

Если значения атрибута rel содержат только ключевые слова, разрешенные в , элемент можно использовать там, где ожидается фразовое содержание, то есть внутри .

5. Элемент

Категории содержимого: метаданные.

Контекст, в котором этот элемент может быть использован: если для элемента указаны атрибуты charset и http-equiv , то в элементе . Если значением атрибута не является content-type , то внутри элемента , являющимся дочерним элементом . Если присутствует атрибут name — там, где ожидаются метаданные.

Пропуск тегов: отсутствует закрывающий тег.

Для элемента доступны ‎глобальные атрибуты, а также атрибуты, приведенные в таблице:

Таблица 2. Атрибуты элемента

Атрибут	Описание, принимаемое значение
charset	Определяет кодировку символов, используемую в документе. В документе должен быть один элемент с атрибутом charset . Необходимо использовать utf-8 или другую кодировку, совместимую с ASCII.
content	Задает значение метаданных документа или прагма директив.
http-equiv	Задает прагма директиву.
name	Устанавливает название/имя метаданных документа.

Элемент представляет различные виды метаданных, которые не могут быть выражены с использованием элементов , , , и .

Для элемента обязательно должен быть определен один из атрибутов — name , http-equiv или charset . Если указан атрибут name или http-equiv , также должен присутствовать атрибут content (или пропущен, если нет соответствующих значений).

Стандартные названия метаданных

Для атрибута name доступны следующие значения (чувствительны к регистру):

• application-name — значение должно быть короткой строкой произвольной формы, содержащей название веб-приложения, которое представляет страница. Если страница не является веб-приложением, application-name не должно использоваться. В одном документе должно быть не более одного названия веб-приложения. Браузеры могут использовать название веб-приложения в пользовательском интерфейсе вместо , поскольку может содержать сообщения о состоянии и тому подобное, относящиеся к состоянию страницы в определенный момент времени, а не просто как название приложения.
• author — значение должно быть строкой произвольной формы с указанием имени одного из авторов страницы.
• description — значение должно быть строкой произвольной формы, описывающей страницу. Значение должно быть подходящим для использования в каталоге страниц, например, в поисковой системе.
• generator — значение должно быть строкой произвольной формы, которая идентифицирует один из пакетов программного обеспечения, использованных для создания документа. Это значение не должно использоваться на страницах, разметка которых не создается программным обеспечением, например на страницах, разметка которых была написана пользователем в текстовом редакторе.

• no-referrer — не передает никакую информацию о реферере.
• no-referrer-when-downgrade — передает реферальные данные только сайтам на HTTPS. Поведение браузера по умолчанию, если не указано иное.
• unsafe-url — всегда передает полный URL реферера.
• origin-when-cross-origin — отправляет полный URL при переходе на страницы в рамках одного сайта, вне зависимости от протокола, а на все остальные — только базовый домен/поддомен.

width — определяет ширину области просмотра, значением может быть определенное количество пикселей, например, width=768 или ключевое слово device-width (соответствует 100vw).

Прагма директивы

Когда атрибут http-equiv указан в элементе , элемент является прагма директивой, которая предоставляет дополнительную информацию о документе:

content-type — является альтернативной формой установки атрибута charset .

Последовательность страниц может использоваться в качестве автоматического слайд-шоу, если каждая страница обновляется до следующей страницы в последовательности с использованием следующей разметки:

6. Элемент

Категории содержимого: метаданные.

Контекст, в котором этот элемент может быть использован: где ожидаются метаданные. Внутри элемента который является дочерним элементом . Внутри , где ожидается потоковое содержимое.

Пропуск тегов: ни один из тегов не может быть пропущен.

Для элемента доступны ‎глобальные атрибуты, а также атрибуты, приведенные в таблице:

Таблица 3. Атрибуты элемента

Атрибут	Описание, принимаемое значение
media	Указывает, к каким медиа применяются стили. Значение должно быть допустимым списком медиазапросов. Браузер должен применять стили, когда значение атрибута media соответствует среде и применяются другие соответствующие условия. Если атрибут media пропущен, по умолчанию он принимает значение all , то есть стили применяются ко всем видам медиа.
nonce	Представляет криптографический одноразовый номер, который может использоваться политикой безопасности содержимого, чтобы определить, будет ли стиль, указанный элементом, применяться к документу.
type	Устанавливает язык таблиц стилей, значение должно быть допустимым MIME-типом. Значением по умолчанию является text/css .
title	Задает альтернативное имя таблиц стилей.

Элемент позволяет авторам встраивать информацию о стилях в свои документы. Элемент не представляет какое-либо содержимое для пользователя.

Элемент желательно использовать внутри раздела .

    em 
Моя любимая книга - «Приключения Алисы в Стране чудес».