Самоучитель HTML Справочник HTML Глобальные атрибуты События Типы элементов Таблица цветов Спецсимволы HTML
Теги HTML

HTML тег <meta>

Поддержка браузерами

Описание

HTML тег <meta> является пустым элементом и располагается внутри элемента <head>. Он используется для предоставления дополнительной информации (метаданных) о HTML-документе, используемой браузерами и поисковыми системами.

Обычно на одной странице располагается по несколько элементов <meta>, но с различными атрибутами, которые используются например для определения описания страницы, ключевых слов, указания автора документа, последнего изменения, указания кодировки HTML-документа и т.д.

Примечание: содержимое элементов <meta> не отображается на веб-странице.

Атрибуты

charset:
Указывает кодировку символов для текущего HTML-документа. Чаще всего используется кодировка UTF-8.

Тег <meta> с атрибутом charset лучше всего располагать в качестве первого дочернего элемента внутри элемента <head>. Чтобы текст на странице отображался корректно, кодировка, указанная в значении атрибута должна совпадать с кодировкой самого документа.
content:
Содержит произвольный текст, который определяет значение, ассоциируемое с атрибутом http-equiv или name, в зависимости от их значения.
http-equiv:
Контролирует действия браузера на данной веб-странице (эквивалент HTTP заголовков). При отображении страницы браузер будет следовать инструкциям, заданным в атрибуте.

Возможные значения атрибута:
  • default-style: указывает предпочтительный стиль для использования на странице. Атрибут content должен содержать идентификатор элемента <link>, который ссылается на таблицу стилей CSS, или идентификатор элемента <style>, содержащего таблицу стилей.
  • refresh: указывает время в секундах до перезагрузки страницы или время до перенаправления на другую страницу, если в атрибуте content после указания времени идет строка ";url=адрес_страницы":
    <!-- обновление страницы через 10 секунд -->
    <meta http-equiv="refresh" content="10">
    
    <!-- Перенаправление на другую страницу через 10 секунд -->
    <meta http-equiv="refresh" content="10;url=httр://www.puzzleweb.ru">
    
name:
Определяет название метаданных. Данный атрибут используется совместно с атрибутом content.

Примечание: атрибут name не должен использоваться в элементе, если в нём уже установлен атрибут http-equiv или charset.

Возможные значения атрибута:
  • application-name: указывает название веб-приложения, используемого на странице.
  • author: указывает имя автора документа.
  • description: определяет краткое описание к содержимому страницы.

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

  • generator: указывает один из пакетов программного обеспечения, используемого для создания документа.
  • keywords: содержит список ключевых слов, разделенных запятыми, соответствующих содержимому страницы.
  • robots: определяет поведение поисковых роботов на странице.
    Значения атрибута content для <meta name="robots">:
    ЗначениеОписаниеПоисковик
    indexразрешает роботу индексировать страницувсе
    noindexзапрещает роботу индексировать страницувсе
    followпозволяет роботу переходить по ссылкам на страницевсе
    nofollow запрещает роботу переходить по ссылкам на страницевсе
    noodpзапрещает использование общего описания сайта из каталога DMOZ, если таковое имеется, к описанию данной страницы на странице результата поискаgoogle, yahoo, bing
    noarchiveпредотвращает кэширование страницы поисковой системойgoogle, yahoo
    nosnippetпредотвращает отображение любого описания страницы на странице результатов поискаgoogle
    nocacheсиноним значения noarchivebing
  • viewport: позволяет определить размер и/или масштаб области просмотра веб-страницы в мобильных браузерах. Параметры для области просмотра указываются в атрибуте content через запятую:
    <meta name="viewport" content="width=device-width, height=device-height,
     initial-scale=1.0">
    Значения атрибута content для <meta name="viewport">:
    ЗначениеПример значенияДопустимые значенияОписание
    widthwidth=device-width
    width=320
    положительное целое число от 1 до 10000 или device-widthОпределяет ширину в пикселях. Специальное значение device-width указывает, что ширина области просмотра будет равна ширине экрана устройства.
    heightheight=device-height
    height=640
    положительное целое число от 1 до 10000 или device-heightОпределяет высоту в пикселях. Специальное значение device-height указывает, что высота области просмотра будет равна высоте экрана устройства.
    initial-scaleinitial-scale=2.0положительное число от 0.0 до 10.0Задает масштаб страницы при ее первоначальном просмотре.
    maximum-scalemaximum-scale=2.5положительное число от 0.0 до 10.0Задает предел увеличения веб-страницы.
    minimum-scaleminimum-scale=0.5положительное число от 0.0 до 10.0Задает предел уменьшения веб-страницы.
    user-scalableuser-scalable=noбулево значение (yes или no)При использовании значения no, пользователь не сможет масштабировать веб-страницу. Значение по умолчанию - yes.

Тег <meta> так же поддерживает Глобальные атрибуты

Стиль по умолчанию

Нет.

Пример

<head>
  <meta charset="UTF-8">
  <meta name="description" content="Портал для Web разработчиков">
  <meta name="keywords" content="HTML,CSS,XML,JavaScript">
  <meta name="author" content="Автор Я">
</head>

<body>
  Содержимое страницы
</body>

Результат данного примера в окне браузера:

Пример использования тега <meta>
Копирование материалов с данного сайта возможно только с разрешения администрации сайта
и при указании прямой активной ссылки на источник.
2011-2016 © puzzleweb.ru

Реклама на сайте | Обратная связь