Meta в html: Тег | htmlbook.ru | Дропшиппинг

Содержание

| HTML | WebReference

Содержание
- Синтаксис
- Закрывающий тег
- Атрибуты
- Пример
- Спецификация
- Браузеры

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

Синтаксис

<head>
  <meta>
</head>

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

Не требуется.

Атрибуты

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

Пример

<!DOCTYPE HTML> <html> <head> <title>META</title> <meta charset=»utf-8″> <meta name=»GENERATOR» content=»Microsoft FrontPage 4.0″> <meta name=»ProgId» content=»FrontPage.Editor.Document»> </head> <body> <p>…</p> </body> </html>

Спецификация

Спецификация	Статус
WHATWG HTML Living Standard	Живой стандарт
HTML5	Рекомендация
HTML 4.01 Specification	Рекомендация

Спецификация

Каждая спецификация проходит несколько стадий одобрения.

Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.

Draft (Черновик спецификации) — первая черновая версия стандарта.

Особняком стоит живой стандарт HTML (Living) — он не придерживается традиционной нумерации версий, поскольку находится в постоянной разработке и обновляется регулярно.

Браузеры


2	12	1	3. 5	1	1


1	1	6	1

Браузеры

В таблице браузеров применяются следующие обозначения.

— элемент полностью поддерживается браузером;
— элемент браузером не воспринимается и игнорируется;

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

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

Документ

Практика

Кодировка документа

Автор и редакторы

Автор: Влад Мержевич

Последнее изменение: 09.10.2018

Редакторы: Влад Мержевич

— HTML — Дока

Кратко

Секция статьи «Кратко»

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

Таких метатегов может быть любое количество. Все они размещаются внутри тега <head>, желательно в самом начале.

Пример

Секция статьи «Пример»

<head>  <meta name="description" content="Краткое описание страницы">  <meta    name="keywords"    content="ключевое слово 1, ключевое слово 2, ключевое слово 3"  >  <meta name="viewport" content="width=device-width, initial-scale=1.0"></head>
          
 <head>
  <meta name="description" content="Краткое описание страницы">
  <meta
    name="keywords"
    content="ключевое слово 1, ключевое слово 2, ключевое слово 3"
  >
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

Как понять

Секция статьи «Как понять»

Теги <meta> содержат полезную для поисковиков и браузеров информацию. Информация в метатегах называется метаданными. Пользователь не видит их содержимое на странице.

Метатеги различаются набором атрибутов и их значений. Один тег содержит одно сообщение: например, описание страницы <meta name="description">, ключевые слова <meta name="keywords" content="...">, кодировку страницы <meta charset="UTF-8"> или другие метаданные.

Мы рекомендуем вставить как минимум метатеги description, viewport, charset. Они помогут оптимизировать сайт для браузера пользователя и поисковых систем.

В <meta> прописывается информация, которую нельзя указать в <base>, <link>, <script>, <style> или <title>.

Как пишется

Секция статьи «Как пишется»

Метатег, который задаёт кодировку страницы, не отличается по структуре от обычных:

<meta charset=". ..">
          <meta charset="...">

Остальные метатеги содержат атрибуты name или http-equiv, которые используются в паре с атрибутом content

<meta name="..." content="..."><meta http-equiv="..." content="...">
          <meta name="..." content="...">
<meta http-equiv="..." content="...">

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

<meta  name="keywords"  content="ключевое слово 1, ключевое слово 2, ключевое слово 3">
          <meta
  name="keywords"
  content="ключевое слово 1, ключевое слово 2, ключевое слово 3"
>

Атрибуты

Секция статьи «Атрибуты»

charset — задаёт кодировку страницы. Мы рекомендуем писать здесь UTF-8 — это самый распространённый вариант.

<meta charset="UTF-8">
          <meta charset="UTF-8">

http-equiv — атрибут, который может изменять поведение страницы или серверов. Используется в паре с content. У него есть несколько значений:
- "default-style" — предпочтительный стиль таблиц, который используется на странице. В этом случае в атрибуте content прописывается заголовок из элемента <link>, который связан с таблицей CSS-стилей, или заголовок элемента <style>, который содержит таблицу CSS-стилей.
- "refresh" — время автоматического обновления страницы. Страница будет автоматически перезагружаться с интервалом, который указан в секундах.

<meta http-equiv="refresh" content="3">
          <meta http-equiv="refresh" content="3">

name — имя мета-тега, которое также определяет его значение.

Используется в паре с content. Можно задать следующие значения:
- "keywords" — ключевые слова, которые помогают поисковикам находить страницу в интернете. По сути, это самые важные слова из содержания страницы.

<meta name="keywords" content="Рецепт, печенье, готовим дома">
          <meta name="keywords" content="Рецепт, печенье, готовим дома">

"viewport" — задаёт параметры окна просмотра в браузере. Страницу можно сделать адаптивной, подогнав ширину окна под размеры устройства. В примере ниже width указывает ширину окна просмотра, а initial-scale — коэффициент масштабирования страницы при первом открытии:

<meta  name="viewport"  content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scalable=yes">
          
 <meta
  name="viewport"
  content="width=device-width, initial-scale=1.0, maximum-scale=2. 0, user-scalable=yes"
>

"description" — краткое описание страницы, которое видит пользователь, когда находит сайт в поисковике. Например: «Рассказываем, как нарезать картошку тонкими ломтиками» для сайта о кулинарии. Это описание помогает поисковикам найти страницу, а пользователю — узнать, о чём она. Так что не забывайте указывать "description".

<meta  name="description"  content="Рассказываем, как нарезать картошку тонкими ломтиками">
          <meta
  name="description"
  content="Рассказываем, как нарезать картошку тонкими ломтиками"
>

"author" — имя автора страницы.

<meta name="author" content="Иван Петров">
           <meta name="author" content="Иван Петров">

content — основное содержимое метатега, которое используется только с http-equiv и name.

Подсказки

Секция статьи «Подсказки»

💡 Чтобы избежать ошибок кодировки, необходимо уместить метатег с атрибутом charset в первых 1024 байтах документа. Для этого старайтесь указывать его в самом начале тега <head>.

💡 Атрибуты http-equiv и name выполняют похожие функции, поэтому их нельзя использовать одновременно.

💡 С помощью атрибута http-equiv="refresh" можно сделать так, чтобы страница отправляла пользователя на другую страницу через определённое количество секунд. Например, отправим пользователя на главную Яндекса через 15 секунд:

<meta http-equiv="refresh" content="15;url=https://www.yandex.ru">
          <meta http-equiv="refresh" content="15;url=https://www.yandex.ru">

На практике

Секция статьи «На практике»

Дока Дог советует

Секция статьи «Дока Дог советует»

🛠 В <meta>, помимо стандартных метаданных, передаются всякие специальные. Например, есть такой браузер, как Safari: он очень любит подстраивать номера телефонов в какой-то удобный для себя вид. Чтобы отключить это своеволие, нужен отдельный метатег:

<meta name="format-detection" content="telephone=no">
          <meta name="format-detection" content="telephone=no">

🛠 С помощью метатегов можно задавать поведение мобильной версии сайта. Например, можно прописать, на сколько на мобайле можно увеличить масштаб и насколько уменьшить относительно стандарта.

🛠 Через метатеги задаётся и Open Graph-разметка: заголовок, картинка и описание для репоста в соцсетях.

Алёна Батицкая советует

Секция статьи «Алёна Батицкая советует»

🛠 Если не задать описание для страницы при помощи <meta name="description" content="...">, то поисковые системы при добавлении сайта в свою базу возьмут первый попавшийся текст со страницы и составят из него так называемый сниппет — текст под заголовком сайта в поисковой выдаче.

Если хочется контролировать, что именно увидит пользователь в поиске — всегда заполняйте description.

🛠 Есть отдельная категория метаразметки — OG-разметка. OG расшифровывается как open graph. Такая разметка нужна для того, чтобы при вставке ссылки на ваш сайт в соцсетях в превью отображалась красивая карточка.

Стандартный набор метатегов для красивой карточки в Facebook:

<meta property="og:title" content="Лучший сайт в интернете"><meta  property="og:description"  content="Посетите лучший сайт в интернете и познайте тщетность бытия"><meta property="og:image" content="http://best-site/thumbnail.jpg"><meta property="og:url" content="http://best-site/index.htm">
          <meta property="og:title" content="Лучший сайт в интернете">
<meta
  property="og:description"
  content="Посетите лучший сайт в интернете и познайте тщетность бытия"
>
<meta property="og:image" content="http://best-site/thumbnail.jpg">
<meta property="og:url" content="http://best-site/index. htm">

Большинство соцсетей используют информацию, указанную в тегах из примера выше, для генерации превью ссылок.

Метатег HTML

— javatpoint

следующий → ← предыдущая

HTML-тег используется для представления метаданных HTML-документа. Указывает описание страницы, ключевые слова, авторские права, язык, автора документов и т. д.

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

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

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

Синтаксис:

<мета-кодировка="utf-8">

Ниже приведены некоторые характеристики HTML-тега

Дисплей	Нет
Начальный тег/конечный тег	Пустой тег (только начальный тег)
Использование	Структурный документ

Ниже приведены некоторые конкретные варианты синтаксиса метатегов, которые показывают различные варианты использования метатегов.

1. <метакодировка="utf-8">

Определяет кодировку символов. Значение charset — «utf-8», что означает, что он будет поддерживать отображение на любом языке.

Указывает список ключевых слов, которые используются поисковыми системами.

Определяет описание веб-сайта, которое полезно для обеспечения релевантного поиска, выполняемого поисковыми системами.

4. <метаимя="автор" контент="этотавтор">

Указывает автора страницы. Полезно автоматически извлекать информацию об авторе с помощью системы управления контентом.

5. <мета-имя="обновить" контент="50">

Указывает, чтобы дать браузеру инструкцию автоматически обновлять содержимое каждые 50 секунд (или любое заданное время).

6. javatpoint.com/html-tags-list»>

В приведенном выше примере мы установили URL-адрес с содержимым, чтобы он автоматически перенаправлял на данную страницу по истечении указанного времени.

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

Пример

<голова> <мета-кодировка="utf-8"> <тело>

Пример метатега

В этом примере показано использование метатега в HTML-документе

Протестируйте сейчас

Атрибут:

Специфичные для тега атрибуты:

= Новое в HTML5

формат

Атрибут	Значение	Описание
кодировка	набор символов	Указывает кодировку символов HTML-страницы.
содержимое	текст	Содержит значение атрибута «name» и «http-equiv» в документе HTML, в зависимости от контекста.
http-экв.	Тип контента стиль по умолчанию обновить	Указывает информацию, предоставляемую веб-сервером о том, как должна обслуживаться веб-страница.
имя	имя-приложения автор описание генератор ключевые слова	Указывает имя метаданных уровня документа.
схема	/URL	Указывает схему, в которой описываются метаданные. (Не поддерживается в HTML5)

Глобальный атрибут:

Тег поддерживает глобальные атрибуты в HTML

Атрибут события:

Тег поддерживает атрибуты событий в HTML.

Поддержка браузеров

Элемент	Хром	IE	Firefox	Opera	Safari
	Да	Да	Да	Да	Да

9000.

969. 9000.. 9000..

9000.

← предыдущая следующий →

Метатег HTML — Tutorial Republic

Описание

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

В следующей таблице приведены контекст использования и история версий этого тега.

Родитель:	`<голова>`
Содержимое:	Нет. Это пустой элемент.
Начальный/конечный тег:	Начальный тег: обязательный , Конечный тег: запрещенный
Версия:	HTML 2, 3. 2, 4, 4.01, 5

Примечание: Метаданные — это данные (информация) о данных — например, ключевые слова и описание, относящиеся к документу.

Тег обычно используется для предоставления ключевых слов, описаний, информации об авторе и других метаданных, которые могут использоваться браузером для правильного отображения документа или могут использоваться поисковыми системами для целей индексации. Вот несколько примеров из реальной жизни, которые помогут вам понять <мета> тег.

Пример 1: определение кодировки символов для документа

Пример 2: определение имени автора документа

Пример 3: определяет список ключевых слов для поисковых систем

Пример 4: Определите краткое резюме/описание веб-страницы

Пример 5. Включение масштабирования на мобильных устройствах

Синтаксис

Основной синтаксис тега :

HTML:
XHTML: <мета-имя=" text " content=" text " />

В приведенном ниже примере показан тег в действии.

Пример

Попробуйте этот код »

 
    Пример метатега HTML
    <мета-кодировка="UTF-8">

Специфические для тега атрибуты

В следующей таблице показаны атрибуты, относящиеся к тегу .

Атрибут	Значение	Описание
Обязательно — Чтобы разметка была действительной, необходимо указать один из следующих атрибутов.
`имя`	`имя-приложения автор описание генератор ключевые слова`	Определяет имя для метаинформации, содержащейся в атрибуте содержимого.
`содержание`	текст	Дает значение, связанное с атрибутом `http-equiv` или `name` . Этот атрибут должен быть указан, если либо `http-equiv` или `name` атрибут присутствует.
`кодировка`	набор символов	Указывает кодировку символов для HTML-документа.
`http-экв.`	`тип содержимого стиль по умолчанию обновление`	Связывает метаинформацию в атрибуте `содержимого` с заголовком ответа HTTP. Разное permalink Post navigation Как составить объявление рекламное: Как составить правильное рекламное объявление для контекстной рекламы? Rss рассылка что это: Как увеличить трафик на сайт при помощи RSS-рассылки Добавить комментарий Отменить ответ Ваш адрес email не будет опубликован. Обязательные поля помечены * Комментарий * Имя * Email * Сайт Найти: Рубрики Seo Инструмент Инструменты Програм Программы Продвиж Продвижение Разное Семант Семантика Совет Советы Создан Создание Схем Схемы Copyright © 2025 Дропшиппинг в России. Сообщество поставщиков дропшипперов и интернет предпринимателей. Все права защищены. ИП Калмыков Семен Алексеевич. ОГРНИП: 313695209500032. Адрес: ООО «Борец», г. Москва, ул. Складочная 6 к.4. E-mail: mail@russia-dropshipping.ru. Телефон: +7 (499) 348-21-17

| HTML | WebReference

Синтаксис

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

Атрибуты

Пример

Спецификация

Спецификация

Браузеры

Браузеры

Практика

Автор и редакторы

— HTML — Дока

Кратко

Пример

Как понять

Как пишется

Атрибуты

Подсказки

На практике

Дока Дог советует

Алёна Батицкая советует

— javatpoint

Синтаксис:

Ниже приведены некоторые конкретные варианты синтаксиса метатегов, которые показывают различные варианты использования метатегов.

Пример

Пример метатега

Атрибут:

Специфичные для тега атрибуты:

Глобальный атрибут:

Атрибут события:

Поддержка браузеров

Метатег HTML — Tutorial Republic

Описание

Синтаксис

Пример

Специфические для тега атрибуты

Добавить комментарий Отменить ответ