Word meta http equiv content type - Word и Excel - помощь в работе с программами

Время на прочтение
7 мин

Количество просмотров 255K

META-теги

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

META-теги имеют два возможных атрибута

— <META HTTP-EQUIV=»имя» CONTENT=»содержимое»>
— <META NAME=»имя» CONTENT=»содержимое»>
META-теги должны находиться в заголовке HTML-документа между <HEAD> и </HEAD> (особенно это важно для документов, использующих фреймы).

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

Пруфлинк: http://www.w3.org/TR/html401/struct/global.html#h-7.4.4.1
(The META element can be used to identify properties of a document (e.g., author, expiration date, a list of key words, etc.) and assign values to those properties. This specification does not define a normative set of properties.)

Атрибут HTTP-EQUIV

META-теги с атрибутом HTTP-EQUIV эквивалентны HTTP-заголовкам. Обычно они управляют действиями броузеров и могут быть использованы для совершенствования информации, выдаваемой обычными заголовками. Теги такой формы могут дать такой же эффект, что и HTTP-заголовки, и на некоторых серверах автоматически могут быть переведены в настоящие HTTP-заголовки.
Некоторые генерируемые сервером поля заголовков не могут быть подменены значениями из META-тегов (в частности Date), другие подменяются только при ненормальном статус-коде (<>200). Когда заголовок не понятен, то значение HTTP-заголовка превалирует над значением META-тегов.

Значения поля content для Аттрибута HTTP-EQUIV

Значение	Описание	Пример использования	Эффект
Expires	Дата устаревания. Управление кэшированием в HTTP/1.0. Если указанная дата прошла, то очередной запрос этого документа вызывает повторный сетевой запрос, а не подгрузку документа из кэша. Дата со значением «0» интерпретируется как «сейчас». Такое значение заставляет броузер каждый раз при запросе проверять — изменялся ли этот документ. Это, кстати относится и к прокси-агентам.	Дата должна быть задана в формате, описываемом в RFC850, <META HTTP-EQUIV=»expires» CONTENT=»Wed, 26 Feb 2008 08:21:57 GMT»> что эквивалентно HTTP-заголовку Expires: Wed, 26 Feb 2008 08:21:57 GMT	Поисковые роботы могут либо совсем не индексировать такой документ, либо постоянно «обнюхивать» его.
Pragma	Эта директива показывает, что кешированная информация не должна использоваться и вместо этого запросы должны посылаться на сервер. Это директива имеет тоже самое значение что и CACHE-CONTROL:NO-CACHE и представлена для обратной совместимости с HTTP/1.0. Клиенты должны использовать оба значения PRAGMA:NO-CACHE и CACHE-CONTROL:NO-CACHE когда нужно послать некешируемый запрос к серверу, про который неизвестно – совместим ли он с HTTP/1.1. Если известно, что сервер совместим с HTTP/1.1 клиент НЕ должен посылать PRAGMA заголовок. HTTP/1.1 кэш должен понимать «PRAGMA:NO-CACHE» точно также, как будто клиент послал «CACHE-CONTROL:NO-CACHE».	<META HTTP-EQUIV=»PRAGMA» CONTENT=»NO-CACHE»>
Content-Type	Указание типа документа. Может быть расширено указанием кодировки страницы (charset). Если же указывать charset в содержании META-тега, то некоторые браузеры выводят такую страницу уже в заданном charset.	<META HTTP-EQUIV=»Content-type» CONTENT=»text/html; charset=ISO-2022-JP»>	Используют браузеры и поисковые системы
Content-language	Указание языка документа. Может использоваться поисковыми машинами при индексировании страниц. Комбинация поля Accept-Language (посылаемого броузером) с содержимым Content-language может быть условием выбора сервером того или иного языка.	<META HTTP-EQUIV=»Content-language» CONTENT=»en-GB»> что эквивалентно HTTP-заголовку Язык описывается парой значений (язык-диалект). В примере: Английский-Великобритания Для русского языка – ru-RU	Используется некоторыми поисковиками
Refresh	Определение задержки в секундах, после которой броузер автоматически обновляет документ. Дополнительная возможность — автоматическая загрузка другого документа.	<META HTTP-EQUIV=»Refresh» Content=»3, URL=http://www.name.com/page.html»> что эквивалентно HTTP-заголовку Refresh: 3; URL=http://www.name.com/page.html	W3C не рекомендует использовать этот тег. Google страницы с таким тегом игнорирует. Другие поисковые системы, возможно, тоже.
Cache-Control	Определяет действия кэша по отношению к данному документу. Возможные значения: Public — документ кэшируется в доступных для всех кэшах Private — только в частном кэше no-cache — не может быть кэширован no-store — может быть кэширован, но не сохраняется	<META http-equiv=»Cache-Control» content=»public»>	Используется некоторыми браузерами

Атрибут NAME

Robots	Тег <meta name=»Robots» content=»…»> управляет индексацией конкретной web-страницы. При этом роботам можно запретить не только индексацию самого документа, но и проход по имеющимся в нем ссылкам. Инструкции по индексации записываются в поле content. Возможны следующие инструкции: NOINDEX — запрещает индексирование документа; NOFOLLOW — запрещает проход по ссылкам, имеющимся в документе; INDEX — разрешает индексирование документа; FOLLOW — разрешает проход по ссылкам. ALL — равносильно INDEX, FOLLOW NONE — равносильно NOINDEX, NOFOLLOW Значение по умолчанию: <meta name=»Robots» content=»INDEX, FOLLOW»>. В следующем примере робот может индексировать документ, но не должен выделять из него ссылки для поиска дальнейших документов: <META name=»ROBOTS» content=»index, nofollow»> Имя тега, названия и значения полей нечувствительны к регистру. В поле content дублирование инструкций, наличие противоречивых инструкций и т.п. не допускается; в частности, значение поле content не может иметь вид «none, nofollow». Google поддерживает дополнительное значение NOARCHIVE, которое запрещает помещать страницу в архив google	<META NAME=»Robots» CONTENT=»NOINDEX,FOLLOW»>	Используется большинством поисковиков
Description	Значение атрибута CONTENT — строка, которая определяет текстовое описание (краткую аннотацию) конкретной страницы Вашего сайта. Не стоит создавать слишком длинное и подробное описание Вашего сайта в данном теге, рекомендуется ограничиться текстом до 100 символов, поскольку поисковые машины, в большинстве случаев, имеют ограничение на количество индексируемых символов. Этот тег может сильно помочь в случаях, когда в документе мало текста, когда это управляющий фреймами файл (frameset) или в начале документа используются скрипты.	<META NAME=»description» CONTENT=»Данный сайт содержит информацию для любителей старинных автомобилей, на нем Вы можете найти описание с фотографиями редких и эксклюзивных автомобилей»>	Самый широко используемый тег. Практически все поисковые системы учитывают его при индексации. Значение этого тега очень важно для раскрутки сайта, практически все поисковые системы опираются на этот тег, а некоторые выводят содержимое этого тега в результатах поиска (Google), поэтому желательно не просто указывать краткое описание документа, но сделать его содержание привлекательным рекламным сообщением.
Keywords	Значение атрибута CONTENT — список ключевых слов, как правило, через запятую, соответствующих содержимому Вашего сайта. Это те слова, в запрос на которые, Вы хотели бы, появления Вашего сайиа в списке результатов поиска. Здесь также рекомендуется ограничиться списком до 30 слов. Можно поместить и наиболее частые опечатки ключевых слов. Также Вы можете здесь записать и английские слова, соответствующие содержимому Вашего сайта. Ну, а какие конкретно нужно писать слова — это уже тема отдельной статьи. Некоторые поисковые системы не индексируют сайты, в которых в данном теге повторяется одно и то же слово для увеличения позиции в списке результатов.	<META NAME=»keywords» CONTENT=»реклама, дизайн, полиграфия»>	Учитывается большинством поисковых систем. Точно известно, что НЕ учитывает Google и Rambler
document-state	Управление индексацией страницы для поисковых роботов. Определяет частоту индексации — или один раз индексировать (значение Static), или реиндексировать документ регулярно (значение Dynamic).	<META NAME=»Document-state» CONTENT=»Static»>	Используется редко
GOOGLEBOT	Google поддерживает специальный тег Googlebot с помощью которого вы можете указать Google что он не должен индексировать и архивировать вашу страницу, другие поисковые системы этот тег проигнорируют.	<META NAME=»GOOGLEBOT» CONTENT=»NOARCHIVE»>
Author	Автор, создатель сайта. Вряд ли используется поисковыми системами, и нужен скорее всего чтобы можно было показать что сайт сделан именно определенной персоной или фирмой.	<META NAME=»AUTHOR» CONTENT=»www.neo-systems.ru»>
Revisit	Значение этого тега указывает — как часто обновляется информация на вашем сайте, и как часто поисковая система должна на него заходить чтобы увидеть обновления. В силу сложившихся условий — поисковые системы сейчас самостоятельно определяют частоту сканирования сайта, поэтому, возможно, наличие этого тега ничего вам не даст.	<meta name=»revisit-after» content=»15 days»>

Источники информации:

http://www.citforum.ru/internet/search/metatags.shtml
http://web-support.ru/adv/ps_meta_2.shtml
http://www.shtogrin.com/library/web/meta/
http://vancouver-webpages.com/META/metatags.detail.html
http://www.mattcutts.com/blog/keywords-meta-tag-in-web-search/
http://www.webotdel.ru/notes/metatags/
Очень хорошо и понятно написано http://www.w3schools.com/tags/tag_meta.asp
Какие мета-теги понимает Google http://www.google.com/support/webmasters/bin/answer.py?answer=79812
Какие мета-теги понимает Bing
http://www.bing.com/community/blogs/webmaster/archive/2009/07/18/head-s-up-on-lt-head-gt-tag-optimization-sem-101.aspx
Google не использует мета-тег keywords
http://googlewebmastercentral.blogspot.com/2009/09/google-does-not-use-keywords-meta-tag.html

Источник

HTML-элемент <meta> представляет такие метаданные, которые не могут быть представлены другими HTML-метатегами, такими как <base>, <link>, <script>, <style> или <title>.

Категории контента	Мета данные. Если задан `itemprop` атрибут: flow content, phrasing content.
Допустимое содержимое	Отсутствует — это пустой элемент.
Пропуск тегов	Так как это пустой элемент, то открывающий тег должен присутствовать, а закрывающий — отсутствовать.
Допустимые родители	`<meta charset>`, `<meta http-equiv>`: `<head>` элемент. Если `http-equiv` это не заявленная декларация, то может быть внутри элемента `<noscript>` или `<head>`.
Допустимые ARIA-роли	Отсутствуют
DOM-интерфейс	`HTMLMetaElement` (en-US)

Атрибуты

Этот элемент включает в себя глобальные атрибуты.

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

charset

Этот атрибут задаёт кодировку символов, используемую на странице. Он должен содержать стандартное имя IANA MIME для кодировки символов. Хотя стандарт не требует определённой кодировки, он рекомендует:

Авторам рекомендуется использовать UTF-8 (en-US).
Не следует использовать ASCII-несовместимые кодировки, чтобы избежать угроз безопасности: браузеры, не поддерживающие их, могут интерпретировать вредоносный контент как HTML. Это относится к семейству кодировок JIS_C6226-1983, JIS_X0212-1990, HZ-GB-2312, JOHAB и EBCDIC.
Примечание: ASCII-несовместимые кодировки — это те, которые не преобразуют 8-битные коды точек 0x20, 0x7E, 0x0020, 0x007E в коды Unicode точек.
Предупреждение:
- Авторы не должны использовать CESU-8, UTF-7, BOCU-1 и/или SCSU, так как есть примеры атак межсайтового скриптинга (en-US) использующих данные кодировки.
- Авторам не следует использовать кодировку UTF-32, потому что не все алгоритмы кодирования HTML5 могут отличить её от UTF-16.
  Примечание:
- Указанный набор символов должен соответствовать одной странице.
  Нет веских оснований для объявления неточного набора символов.
- <meta> элемент должен находиться внутри элемента <head> и задаваться в 1024 первых байтах HTML страницы, поскольку некоторые браузеры смотрят только эти байты перед выбором кодировки.
- Этот <meta> элемент — часть алгоритма, определяющего набор символов (algorithm to determine the character set) страницы, который браузер поддерживает. Заголовок Content-Type и любые Byte-Order Marks элементы переопределяют данный элемент.
- Настоятельно рекомендуется определить кодировку символов. Если для страницы не определён набор символов, то некоторые cross-scripting технологии могут повредить страницу, например такие как UTF-7 fallback cross-scripting technique. Постоянная установка этого элемента будет защищать вас от этого риска.
- Этот <meta> элемент это синоним для pre-HTML5 <meta http-equiv="Content-Type" content="text/html; charset=IANAcharset"> где *IANAcharset *соответствует значению эквивалентного charset атрибута.
  Этот синтаксис по-прежнему разрешён, хотя и устарел и больше не рекомендуется.

content

Этот атрибут содержит значение для http-equiv или name атрибута, в зависимости от контекста.

http-equiv

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

"content-language"
- : Эта прагма определяет значение языка страницы по умолчанию.
Примечание: Не используйте эту прагму, так как она устарела Используйте глобальный атрибут <html> элемента вместо этого.
"Content-Security-Policy"
- : Это значение позволит администратору веб-сайта определить политику содержания для обслуживаемых ресурсов. За некоторыми исключениями, политика в основном включают в себя указание происхождения сервера и конечные точки сценария. Это помогает предотвратить атаки межсайтового скриптинга.
"content-type"
- : Этот атрибут определяет MIME type документа. За ним следует синтаксис такой же как и в поле заголовка объекта содержимого HTTPI, однако как и внутри HTML-элемента, большинство этих значений не доступно.
  Поэтому допустимым синтаксисом для его содержимого является литеральная строка ‘text/html‘, за которой следует набор символов со следующим синтаксисом: ‘; charset=IANAcharset‘ где IANAcharset это предпочтительное MIME имя для набора символов, который определяется какIANA.
  Примечание:
  - Не используйте эту прагму, так как она устарела. Используйте атрибутcharset в элементе <meta> вместо этого.
  - <meta> не может быть использована для выбора типа документа в XHTML документе, или в HTML5 документе, за которым следует XHTML синтаксис, никогда не задавайте MIME тип как XHTML MIME. Это будет некорректно.
  - Только HTML документ может использовать контент-тип, так что большинство из них являются неиспользуемыми, поэтому они являются устаревшими и заменяются charset атрибутом.
"default-style"
- : Специализация этой прагмы — предпочтительный стиль таблиц, используемый на странице. content атрибут должен содержать заголовок <link> элемента который href связывает атрибут с CSS таблцей стилей, или заголовок <style> элемента, который содержит CSS таблицу стилей.
"refresh"
- : Эта прагма определяет:
  - Количество секунд перезагрузки таблицы, если content атрибут содержит только целое положительное число;
  - Время, в количестве секунд, за которое страница должна быть перенаправлена на другую, если content атрибут содержит целое положительное число, заканчивающийся строкой ‘;url=‘ и корректный URL.
"set-cookie"
- : Эта прагма определяет cookie для страницы. Её содержимое должно заканчиваться синтаксисом, определяемым IETF HTTP Cookie Specification.
  Примечание: Не используете эту прагму, так как она устарела. Используйте HTTP header set-cookie вместо этого.

name

Этот атрибут определяет имя уровня документа метаданных.
Его не следует устанавливать, если один из атрибутов itemprop, http-equiv или charset также указан в наборе.
Имя этого документального уровня метаданных связано со значением, которое содержится в content атрибуте.Допустимые значения для имени элемента, со связанными с ними значениями, хранятся посредством content атрибута:

application-name, определяет имя веб-приложения, запущенного на веб-странице;
Примечание:* Браузеры могут использовать его для идентификации приложения. Он отличается от <title> элемента, который обычно состоит из имени приложения, но также может содержать специальную информацию, как например имя документа или статус;
- Простые веб-страницы не определяют application-name meta.
автор определяет в свободном формате имя автора документа;
описание, содержащее краткое и точное резюме содержания страницы. В некоторых браузерах, среди которых Firefox и Opera, этот мета используется как описание страницы по умолчанию в закладке;
генератор, содержащий в свободном формате идентификатор программного обеспечения, создавшего страницу;;
Ключевые слова, представленные строками, разделёнными запятыми, связанные с содержанием страницы

referrer
Экспериментальная возможность
контролирует содержимое HTTP. Referer HTTP — заголовок, прикреплённый к любому запросу, отправленному из этого документа:

`no-referrer`	Не отправлять HTTP `Referer` заголовок.
`origin`	Отправить оригинал.
`no-referrer-when-downgrade`	Отправить оригинал, как ссылку по умолчанию на безопасный пункт (https->https), но не отправлять ссылку на менее безопасную структуру (https->http). Это поведение по умолчанию.
`origin-when-crossorigin`	Отправляет полный URL (удалённый из параметров) при выполнении запроса с тем же источником, или только оригинал документа в других случаях.
`unsafe-URL`	Отправляет полный URL (удалённый из параметров), при выполнении запроса того же или перекрёстного происхождения.

Примечание: Некоторые браузеры поддерживают ключевые слова всегда, по умолчанию и никогда для реферера. Эти значения устарели.

Примечание: Динамическая вставка <meta name="referrer"> (с помощью document.write или appendChild) создаёт недетерминизм, когда дело доходит до отправки рефереров. Также стоит отметить, что когда определяется несколько конфликтующих политик, применяется No-referrer policy.Атрибут также может иметь значение, взятое из существующего листа определений WHATWG Wiki MetaExtensions page. Хотя ни один из них официально не был принят, в число предложений входят несколько часто используемых имён:

creator, определят в свободном формате имя создателя документа. Это также может быть имя института. Если же имён больше чем одно, то несколько <meta> элементов должны быть использованы;
googlebot, синоним robots, но только следует за Googlebot, сканирует индексы для Google;
publisher, определяет в свободном формате имя того, кто опубликовал документ. Это также может быть имя института;

robots, определяет поведение, поисковых роботов на странице. Список этих значений представлен ниже:

Значение	Описание	Используется
`index`	Позволяет роботу индексировать страницу	All
`noindex`	Освобождает робота от индексирования страниц	All
`follow`	Позволяет роботу переходить по ссылкам со страницы	All
`nofollow`	Запрещает роботу переходить по ссылкам со страницы	All
`none`	Эквивалентно `noindex, nofollow`	Google
`noodp`	Запрещает использование Open Directory Project описания, если таковые имеются, как описание страницы на странице результатов поиска	Google, Yahoo, Bing
`noarchive`	Запрещает поисковой системе кешировать содержимое страницы.	Google, Yahoo, Bing
`nosnippet`	Запрещает отображение любого описания страницы на странице результатов поиска	Google, Bing
`noimageindex`	Запрещает отображение этой страницы в качестве ссылающейся страницы индексированного изображения.	Google
`nocache`	Синоним `noarchive`	Bing

Примечание:

Только кооперативные роботы будут следовать правилам, определённым именем роботов.
Роботу необходимо получить доступ к странице, чтобы считать мета значение. Если вы хотите скрыть от них информацию, то используйте robots.txt файл.
Если вы хотите удалить страницу индекса, изменение мета в noindex будет работать, но только тогда, когда робот снова посетит страницу. Убедитесь, что файл robots.txt не предотвращает такие посещения. Некоторые поисковые системы имеют инструменты, позволяющие быстро удалить какую-либо страницу.
Некоторые возможные значения взаимно исключают друг друга, такие как использование индекса и noindex или follow и nofollow одновременно. В этих случаях поведение робота не определено и может варьироваться от одного к другому. Поэтому избегайте этих случаев.
Некоторые поисковые роботы-роботы, такие как Google, Yahoo Search или Bing, поддерживают те же значения в директиве HTTP, X-Robot-Tags: это позволяет им использовать эту прагму для документов, отличных от HTML, например изображений.

slurp,синоним robots, но следует только за Slurp, индексирующим роботом от Yahoo Search;Наконец несколько общих терминов:

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

Значение	Допустимые значения	Описание
`width`	целое положительное число или литерал `device-width`	Определяет ширину области просмотра в пикселях
`height`	целое положительное число или литерал `device-height`	Определяет высоту области просмотра в пикселях
`initial-scale`	положительное число между `0.0` и `10.0`	Определяет соотношение между шириной устройства и размером области просмотра
`maximum-scale`	положительное число между `0.0` и `10.0`	Определяет максимальное значение зума; должен быть больше или равен минимальному масштабу или быть неопределённым.
`minimum-scale`	положительное число между `0.0` и `10.0`	Определяет минимальное значение зума; должен быть меньше или равен максимальному масштабу или быть неопределённым.
`user-scalable`	булевское значение (да или нет)	Если весь набор содержит значения нет, то пользователю не доступен зум на веб-странице. По умолчанию задано значение да.

Спецификация	Статус	Комментарий
CSS Device Adaptation Определение ‘<meta name=»viewport»>’ в этой спецификации.	Рабочий черновик	Ненормативно описывает элемент META Viewport

Смотрите также: @viewport

Примечание:

Хотя и не стандартизирован, этот атрибут используется разными мобильными браузерами, например Safari Mobile, Firefox for Mobile or Opera Mobile.
Значения по умолчанию могут быть изменены у разных браузеров или устройств..
Для изучения этой прагмы на Firefox for Mobile, посмотрите статью this article.

scheme

Этот атрибут определяет схему, которая описывает метаданные.
Схема — это контекст, ведущий к правильной интерпретации content значения, например формата.

Примечание: Не используйте этот атрибут, так как он устарел. Для него нет никакой замены, поскольку реально он не использовался. Опустите его.

Замечания

В зависимости от установленных атрибутов, тип метаданных может быть одним из следующих:

Если в наборе name, то это document-level metadata, применяемая ко всей странице.
Если в набореhttp-equiv , то это pragma directive,
то есть информация, веб-сервер предоставляет информацию о том, как должна обслуживаться веб-страница.
Если в наборе charset, то это charset declaration,
то есть кодировка, используемая для сериализованной формы веб-страницы.
Если в наборе itemprop, то это user-defined metadata,
прозрачна для агента пользователя, поскольку семантика метаданных зависит от пользователя.
Экспериментальная возможность

Пример

<!-- В HTML5 -->
<meta charset="utf-8">

<!-- Переход на другую страницу через три секунды -->
<meta http-equiv="refresh" content="3;url=https://www.mozilla.org">

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

Specification
HTML Standard # the-meta-element

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

Другие элементы, содержащие метаданные: <base>, <head>, <link>, <style>,<title>.

Источник

Глава 10

В первой главе этого учебника, об общем построении html документа, я говорил о том, что все html документы должны иметь вот такой шаблон кода:

<html> — начало документа
<head> — начало головы
</head> — закрытие головы
<body> — начало тела
</body> — закрытие тела
</html> — конец документа

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

С тегом <title> мы уже знакомы, с помощью него мы указываем имя документа в заголовке страницы. Теперь новый тег <meta> (закрывающего тега не требует) с помощью него мы и будем указывать эту самую служебную информацию на нашей страничке.

<meta> тег имеет следующие атрибуты:

http-equiv — указывает браузеру как следует обработать основное содержание документа, точнее на основе каких данных.
name — информационное имя. (применяется в паре с атрибутом content)
content — информационное содержание, связанное с мета именем (name)

Теперь на примерах будем вникать в суть дела.

Кодировка символов и язык

Пример (очень нужный и важный):

<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>

Сначала расскажу зачем необходима эта строка в заголовке html документа. Данная запись указывает браузеру кодировку в которой была написана данная страница — формат документа и раскладку клавиатуры, в данном случае это кириллица для Windows. Если эту строку не писать в заголовке страницы, то есть большая вероятность что весь текст на Вашей странице отобразится в виде непонятных человеку «иероглифов» у разных пользователей тех или иных браузеров. Конечно, пользователь может применить к такому документу команду в браузере Вид->Кодировка->Кириллица, но он может не знать о данной функции, да и зачем утруждать человека данным действием.

Теперь разберём по «слогам» нашу запись:
<meta http-equiv=»Content-Type» — указываем что в этом мета теге мы будем заниматься Content-Type — типом содержания
Content=»text/html; — а именно его текстом
Charset=Windows-1251″> — документ для Windows — Кириллица где 1251 кодировка раскладки клавиатуры, так например Английская клавиатура будет задаваться Charset=Windows-1252

В настоящее время продвинутые веб-мастера рекомендуют использовать кодировку UTF 8

То есть писать в голове документа вот так:

<meta http-equiv=»Content-Type» content=»text/html; charset=utf-8″>

Пример:

<meta http-equiv=»Content-Language» Content=»ru»>

В этой строчке говорится о том что язык Language документа является русским Content=»ru»

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

Информация о документе

Пример:

<meta name=»author» Content=»Остап Бендер»>
<meta name=»copyright» Content=»»Рога и копыта» Остап Бендер»>

Данные метаописатели предназначены для заявления об авторских правах непосредственно в заголовке html кода, так name=»author» указывает имя автора страницы, а name=»copyright» авторское право (копирайт) в котором может указываться фамилия, имя, отчество автора сайта, название фирмы, бренда.. и т. д. Кроме того включив в заголовок документа такое описание Вы значительно упростите задачу поисковой машине при поиске Вашего сайта по имени автора, названию фирмы, бренду…

Пример:

<meta name =»Generator» Content=»Microsoft Notepad»>

Если хотите можете указать с помощью какого html редактора была написана данная страница.

Описание страницы и ключевые слова

Пример:

<meta name=»description» Content=»Производим закупку по выгодным ценам рогов и копыт!»>

Description — краткое описание страницы. Данное описание частенько используется поисковыми системами для вывода в результатах поиска, по какому либо запросу, информации о сайте и его назначении.

Пример:

<meta name=»keywords» Content =»рога, копыта, рожки, рог, копыто, копытце, закупка, покупка, приобретение, выгодно, продать, купить, сбыть, реализовать, корова, бык, коровьи, бычьи, оплата, деньги, наличные, цена, цене»>

Keywords — ключевые слова веб-страницы, опять таки предназначены для поисковых машин.

Представьте что Вы ищете в какой либо поисковой системе сайт с информацией о том где можно продать те же рога и копыта Какие слова и фразы Вы будите вводить в строке «Поиск»? ну наверно что то типа: «Где продать коровьи рога?» или «Реализовать копыта по выгодной цене» Так вот если определить ключевые слова и так сказать предугадать мысли потенциального посетителя можно надеяться на то, что та или иная поисковая система выдаст ссылку на Ваш сайт в первых строчках результата поиска. Конечно ввод данного метоописателя не есть гарант того что именно Ваш сайт займет первые места в поиске по данным словам, но всё же не стоит им пренебрегать. Впрочем, оптимизация и раскрутка сайта это отдельная тема для разговора.

Помните что описание description не должно превышать по длине более 200 символов, а ключевые слова keywords 1000 символов, иначе это может пагубно отразится при продвижении Вашего сайта в ТОП поисковых систем.

Адрес

Пример:

<meta name=»Publisher-Email» Content=»Ваш_e-mail@сервер.домен»>
<meta name=»Publisher-URL» Content=»http://www.Ваш_сайт/»>

Думаю понятно.. здесь указывается адрес Вашего почтового ящика Publisher-Email и адрес сайта Publisher-URL

Обновление страницы

Пример:

<meta name =»revisit-after» Content=»15 days»>

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

Время действия документа и кэш

Пример:

<meta http-equiv=»expires» content=»Sun, 24 jan 2010 12:28:36 GMT+03:00″>

Для того чтобы ускорить загрузку страницы, а так же сэкономить трафик современные браузеры сохраняют посещаемые пользователем страницы в кэш (на жёсткий диск), и при повторном посещении загружают их не с сервера, а непосредственно с кэша. На самом деле такая функция хороша собой.. но есть одно «но», дело в том что в браузере может отображаться уже устаревшая информация, какой либо страницы. Представьте, к примеру, Ваш сайт представляет собой некое периодическое новостное интернет издание, а пользователь получит, вместо самых свежих новостей, уже устаревшую информацию, ту которая хранится у него в кэше!! и не разобравшись в чем «беда» примет Ваш сайт за «мертвый» заброшенный и никем не обновляемый.

Для того чтобы принудительно заставить браузер загружать ту или иную страницу не с жёсткого диска, а с сервера необходим мета тег с данным синтаксисом, где указывается день недели, число месяц год время (чч:мм:сс) и часовой пояс(GMT+03:00 — время Московское + три часа). День недели и время дня можно не указывать. Теперь при чтении страницы браузером страница будет грузится с сервера, если указанная дата и время настало или просрочено, и напротив из кэша если указанное время еще не наступило.

Ниже на всякий случай приведены таблицы сокращений от Английских слов на месяцы и дни недели

Месяцы:	От Английского:	Сокращения:
Январь	January	Jan
Февраль	February	Feb
Март	March	Mar
Апрель	April	Apr
Май	May	May
Июнь	June	Jun
Июль	July	Jul
Август	August	Aug
Сентябрь	September	Sep
Октябрь	October	Oct
Ноябрь	November	Nov
Декабрь	December	Dec

Дни недели:	От Английского:	Сокращения:
Понедельник	Monday	Mon
Вторник	Tuesday	Tue
Среда	Wednesday	Wed
Четверг	Thursday	Thu
Пятница	Friday	Fri
Суббота	Saturday	Sat
Воскресенье	Sunday	Sun

Атрибуту content можно присвоить значение «0» <meta http-equiv=»Expires» content=»0″> в этом случае страница всегда будет загружаться с сервера.

И еще.. некоторые поисковые роботы могут отказаться индексировать документ с заведомо устаревшей датой. — не искушайте судьбу..

Пример:

<meta http-equiv=»pragma» content=»no-cache»>

А такая запись вовсе запретит браузеру кэшировать данную страницу.

Команды для робота

Пример:

<meta name=»robots» content=»Index,follow»>

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

Список возможных команд роботу:

Index — индексировать страницу
Noindex — не индексировать страницу
Follow — прослеживать гиперссылки на странице
Nofollow — не прослеживать гиперссылки на странице
All — индексировать страницу и прослеживать гиперссылки на странице (по умолчанию)
None — не индексировать страницу и не прослеживать гиперссылки на странице

Автоматический переход на другую страницу

Пример:

<meta http-equiv=»Refresh» content=»10; URL=http://www.mysite/index.html»>

Если вдруг по каким либо причинам Вы задумаете поменять URL адрес Вашего сайта то хорошо было бы на старом месте оставить страницу вроде этой:

<html>

<head>

<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>
<meta http-equiv=»Refresh» content=»10; URL=http://www.mysite/index.html»>
<title>Переадресация</title>
</head>
<body>
<font size=»+1″>
Адрес сайта был изменен, через 10 секунд Ваш браузер будет автоматически перенаправлен по новому адресу:<br>
<a href=»http://www.mysite.ru/index.html»><b>http://www.mysite.ru/</b></a><br>

Нажмите <a href=»http://www.mysite.ru/index.html»>здесь</a> для того чтобы выполнить переход немедленно.<br>
Приносим извинения за доставленные неудобства.
</font>
</body>
</html>

Разберём и осмыслим строчку из примера:

<meta http-equiv=»Refresh» content=»10; URL=http://www.mysite/index.html»>

meta http-equiv=»Refresh» — Refresh (восстановление) указывает браузеру что данную страницу необходимо обновить

content=»10; — обновить через заданное количество секунд (в нашем случае десять)
URL=http://www.mysite/index.html»— адрес новой/другой страницы на которую следует перейти.

Пример:

<meta http-equiv=»Refresh» content=»30″>

А вот если в заголовке Refresh URL адрес упустить, как показано в примере, то тогда браузер будет постоянно через каждые 30 секунд (ну или не 30.. сколько пропишите через столько и будет..) обновлять содержимое данной страницы.

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

Эффекты при переходе по ссылке

Пример:

<meta http-equiv =»Page-Enter» Content=»RevealTrans(Duration=1.0, Transition=0)»>
<meta http-equiv =»Page- Exit » Content=»RevealTrans(Duration=3.0, Transition=23)»>

Данные заголовки создают визуальные эффекты при переходе с одной страницы на другую.

Page-Enter — Эффект появления страницы
Page- Exit — Эффект исчезновения страницы

В которых:

Duration — время действия эффекта в секундах
Transition — Один из номеров предлагаемых эффектов (от 0 до 23) перечисленных в таблице:

Номер	Описание эффекта	Номер	Описание эффекта
0	Прямоугольники внутрь	12	Растворение
1	Прямоугольники наружу	13	Вертикальная панорама внутрь
2	Круг внутрь	14	Вертикальная панорама наружу
3	Круг наружу	15	Горизонтальная панорама внутрь
4	Наплыв наверх	16	Горизонтальная панорама наружу
5	Наплыв вниз	17	Уголки влево — вниз
6	Наплыв вправо	18	Уголки влево — вверх
7	Наплыв влево	19	Уголки вправо – вниз
8	Вертикальные жалюзи	20	Уголки вправо – вверх
9	Горизонтальные жалюзи	21	Случайные горизонтальные полосы
10	Шажки горизонтальные	22	Случайные вертикальные полосы
11	Шажки вертикальные	23	Случайный выбор эффекта

Пример:

Файл page1.html

<html>
<head>
<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>
<meta http-equiv =»Page-Enter» Content=»RevealTrans(Duration=1.0, Transition=12)»>
<title>Эффекты перехода страниц</title>
</head>
<body bgcolor=»#c5ffa0″>
<center>
<h2>На заметку:</h2>
<font size=»+1″>Эффекты перехода с одной страницы на другую работают не во всех браузерах.</font><hr><br>
<font size=»+1″>Нажмите на «Перейти» чтобы перейти к следующей странице<br>
и оценить эффект перехода от одной странице к другой.</font><br><br>
<a href=»page2.html»><font size=»+2″>»Перейти»</font></a>
</center>
</body>
</html>

Файл page2.html

<html>
<head>
<meta http-equiv=»Content-Type» Content=»text/html; Charset=Windows-1251″>
<meta http-equiv =»Page-Enter» Content=»RevealTrans(Duration=2.0, Transition=23)»>
<title>Эффекты перехода страниц</title>
</head>
<body bgcolor=»#c0e4ff»>
<center>
<h2>На заметку:</h2>
<font size=»+1″>Эффекты открытия и закрытия веб-страниц будут видны только при переходе <br>
от одной страницы к другой или же при помощи кнопок «назад» «вперёд». <br>
При первом открыти страницы, а также во время перезагрузки<br>
эффекты перехода видны не будут.</font><hr><br>
<font size=»+1″>Нажмите на «Перейти» чтобы перейти к следующей странице<br>
и оценить эффект перехода от одной странице к другой.</font><br><br>
<a href=»page1.html»><font size=»+2″>»Перейти»</font></a>
</center>
</body>
</html>

Полезные советы:

Ещё раз напомню о том что мета теги стоит применять умело и грамотно особенно это касается команд для робота и кодировки символов, иначе весь Ваш труд может пойти насмарку..
Заголовок Refresh (автоматический переход на другую страницу) можно использовать не совсем стандартно.. Некоторые авторы используют его для создания своего рода «презентации» слайд шоу, где сменяющиеся страницы и есть кадры презентации. Представьте заходит человек на такой сайт а тут ему «Откинетесь на спинку кресла и расслабьтесь..»:) а далее сами по себе пошли картинки, графики, тексты.. а последняя страница тупиковая где пользователь берёт сайт «в свои руки» или же может замыкаться на первую. Только всегда помните о золотом правиле веб-мастера: Главное не переборщить!

Источник

Мета-теги — это необязательные атрибуты, размещенные в заголовке страницы, между тегами <head> и </head>, которые никак не отображаются браузером (за исключением содержимого тега <title>). Мета-теги могут содержать описание html-страницы, ключевые слова к ней, информацию об авторе, управляющие команды для браузера и поисковых роботов, а также прочую служебную информацию, не предназначенную для посетителей. Мета-теги для сайта играют очень важную роль. Их добавление в html-документ могут существенно помочь сайту в его жизни.

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

Функции мета-тегов

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

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

Группы метатегов

Мета-теги можно разделить на две основные группы — это NAME и HTTP-EQUIV. Группа NAME отвечает за текстовую информацию о веб-документе, его авторе, а также — формирует рекомендации для поисковых роботов. Мета-теги, относящиеся к группе HTTP-EQUIV фактически эквивалентны гипертекстовым заголовкам, они формируют заголовок веб-страницы и определяют его обработку, а также управляют действиями браузеров и используются для формирования информации, выдаваемой обычными заголовками.

Элемент meta принимает следующие атрибуты: content, http-equiv, name, charset и scheme.

Атрибут	Описание
Name	Имя метатега, также косвенно устанавливает его предназначение. Примеры: include, keywords, description, author, revised, generator и др.
content	Устанавливает значение атрибута, заданного с помощью name или http-equiv.
scheme (устарел)	Указывает полезную информацию о схеме или название самой схемы, которая должна быть использована для интерпретации значения свойства (то есть значения атрибута «content»). Не применяется в HTML5.
charset	Новый атрибут, показывает кодировку документа в HTML5. Пример: <meta charset=»utf-8″>
http-equiv	Формирует заголовок страницы и определяет его обработку. Как правило, управляет действиями браузеров и используется для формирования информации, выдаваемой обычными заголовками. Например HTTP-EQUIV может использоваться для управления кэшированием, обновлением страницы, автоматической загрузки другой страницы.

Группа значений атрибута NAME

«keywords» (ключевые слова)

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

Если раньше «keywords» имел определённую роль в ранжировании сайта, то в последнее время поисковые системы относятся к нему нейтрально.

HTML-код с «keywords»:

<!DOCTYPE html>
<html>
 <head>
  <title>keywords</title>
  <meta name="keywords" content="HTML,CSS,PHP,JavaScript"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

«description» (описание страницы)

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

Таким образом, правильный description обязательно должен содержать ключевое слово, коротко и точно описывать то, о чём данная веб-страница. «Description» вместе с «title» образуют очень важную пару значений, от которых зависит то, перейдёт пользователь из поисковой выдачи на веб-страницу или нет! Поэтому «description» и «title» нужно прописывать для каждой веб-страницы!

HTML-код с «description»:

<!DOCTYPE html>
<html>
 <head>
  <title>description</title>
   <meta name="description" content="Сайт об HTML и CSS"> 
   <meta name="keywords" content="HTML,CSS,PHP,JavaScript">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

«Author» и «Copyright»

Эти значения, как правило, не используются одновременно. Функция author и copyright — идентификация автора или принадлежности контента на странице. «Author» содержит имя автора веб-страницы, но в случае, если веб-сайт принадлежит какой-либо организации, целесообразнее использовать значение «Copyright».

HTML-код с «author»:

<!DOCTYPE html>
<html>
 <head>
  <title>Примеры применения метатегов</title>
  <meta name="author" content="Maxim White">
  <meta name="keywords" content="HTML, Meta Tags, Metadata">  
  <meta name="description" content="Сайт об HTML и CSS"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

«Robots»

Robots — формирует информацию о гипертекстовых документах, которая поступает к роботам поисковых систем.

У «robots» могут быть следующие значения:

index — страница должна быть проиндексирована;
noindex — страница не индексируется;
follow — гиперссылки на странице учитываются;
nofollow — гиперссылки на странице не учитываются
all — включает значения index и follow, включен по умолчанию;
none — включает значения noindex и nofollow.

HTML-код с «robots»:

<!DOCTYPE html>
<html>
 <head>
  <title>Примеры применения метатегов</title>
  <meta name="robots" content="noindex, nofollow">
  <meta name="keywords" content="HTML, Meta Tags, Metadata">
  <meta name="author" content="Maxim White">
  <meta name="description" content="Сайт об HTML и CSS"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

Группа значений атрибута HTTP-EQUIV

«Content-Type»

Content-Type определяет тип документа и его кодировку.

HTML-код с «Content-Type»:

<!DOCTYPE html>
<html>
 <head>
  <title>Примеры применения метатегов</title>  
  <meta name="keywords" content="HTML, Meta Tags, Metadata">  
  <meta name="description" content="Сайт об HTML и CSS">
  <meta name="author" content="Maxim White">
  <meta name="robots" content="noindex, nofollow">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
 </head> 
 <body>Основное содержимое страницы</body>
</html>

В HTML5 указание кодировки упрощено:

<meta charset="UTF-8">

«refresh»

Refresh — задержка времени (в секундах) перед тем, как браузер обновит страницу. Кроме того, может использоваться автоматическая загрузка другой html-страницы с заданным адресом (url).

HTML-код с «refresh»:

<!DOCTYPE html>
<html>
 <head>
  <title>Автозагрузка</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta http-equiv="refresh" content="5; URL=http://www.wm-school.ru">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

Браузер поймет эту запись, как через 5 секунд загрузить новую страницу, указанную в параметре URL, в данном случае это переход на сайт wm-school.ru.
Значение «refresh» позволяет создавать перенаправление (редирект) на другой сайт. Если URL не указан, произойдет автоматическое обновление текущей страницы через количество секунд, заданных в атрибуте content.

	Обратите внимание, что кавычки в указании URL-адреса перед http не ставятся.

«Content-Language»

Content-Language указывает язык документа. Может использоваться поисковыми машинами при индексировании страниц. Комбинация поля Accept-Language (посылаемого браузером) с содержимым Content-language может быть условием выбора сервером того или иного языка.

HTML-код с «content-language»:

<!DOCTYPE html>
<html>
 <head>
  <title>Язык документа</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta http-equiv="refresh" content="5; URL=http://www.wm-school.ru">
  <meta http-equiv="content-language" content="ru">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

В HTML5 указание языка упрощено:

<html lang="ru">

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

Пример HTML:

Попробуй сам

<!DOCTYPE html>
<html>
 <head>
  <title>Заголовок страницы</title>  
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="keywords" content="HTML, Meta Tags, метаданные">
  <meta name="description" content="Сайт об HTML и CSS">
 </head> 
 <body>Основное содержимое страницы</body>
</html>

Задачи

Итоговое задание [10-14]

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

Пришло время повторить изученное и выполнить четыре несложных задания:

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

Задание
Ответ
Реши сам »

С помощью одинарного тега <meta> задайте ключевые слова: «HTML,CSS,JavaScript» для текущей веб-страницы.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Ключевые слова</title>  
 </head>
 <body>
  <p>Метатеги (англ. meta tags) — предназначены для предоставления структурированных метаданных о веб-странице.</p>
 </body>
</html>

Индексация веб-страницы

Задание
Ответ
Реши сам »

С помощью одинарного тега <meta> разрешите индексацию Web-страницы поисковыми машинами, а переход по ссылкам запретите.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Индексация и переход по ссылкам</title>  
 </head>
 <body>
  <p>Тег meta позволяет запретить или разрешить индексацию Web-страницы поисковыми машинами.</p>
 </body>
</html>

Автоматическая перезагрузка страницы

Задание
Ответ
Реши сам »

С помощью одинарного тега meta назначте автоматическую перезагрузку текущей веб-страницы через 30 сек.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Автоматическая перезагрузка страницы</title>  
 </head>
 <body>
  <p>Тег meta позволяет автоматически перезагружать страницу через заданный промежуток времени.</p>
 </body>
</html>

Автозагрузка новой страницы

Задание
Ответ
Реши сам »

Сделайте так, чтобы через 5 сек после загрузки страницы браузер перешел на адрес http://www.wm-school.ru.

<!DOCTYPE html>
<html>
 <head>
  <meta>
  <title>Автозагрузка новой страницы</title>  
 </head>
 <body>
  <p>В данном случае через 5 сек после загрузки страницы браузер перейдет на адрес http://www.wm-school.ru.</p>
 </body>
</html>

Материал взят с разрешения админа здесь

Источник

Посмотрев HTML код разных сайтов возникает вопрос – зачем в нем так много мета-тегов и для чего они нужны? В данной статье представлены все самые встречающеюся теги с примерами и пояснениями.

Описание страницы

Title

Заголовок страницы, оптимальная длина 50-60 символов.

Description

Краткое описание страницы длинной 160-180 символов, используется в выводе результатов поиска.

<meta name="description" content="...">

HTML

Keywords

Содержит ключевые слова встречающихся на странице. Не более 20-ти слов и 3-х повторов.

<meta name="keywords" content="...">

HTML

Google – не использует.
Яндекс – под вопросом.

Кодировка сайта

<meta http-equiv="content-type" content="text/html; charset=utf-8">

HTML

В HTML5 тег сократили:

<meta charset="utf-8">

HTML

Application-Name

Название веб-приложения. Можно указать несколько названий для разных языковых локалей.

<meta name="application-name" content="Моё приложение">
<meta name="application-name" lang="en" content="My application">
<meta name="application-name" lang="fr" content="Mon application">

HTML

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

Generator

Сообщает, с помощью какой программы был сгенерирован код страницы.

<meta name="generator" content="...">

HTML

Author

Информация об авторе сайта.

<meta name="author" content="...">

HTML

Copyright

Информация о владельце сайта.

<meta name="copyright" content="...">

HTML

Reply-To

Указывает способ связи с автором страницы.

<meta name="reply-to" content="mail@example.com">

HTML

Content-Language

Указывает язык страницы. Используется поисковыми машинами при индексировании.

<meta http-equiv="content-language" content="ru">

HTML

Help

Предоставляет ссылку на справку или e-mail.

<link rel="help" href="mailto:help@example.com">

HTML

Управление индексацией

Robots

Задает правила индексации для поисковых роботов.

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

HTML

Общие значения:

`index`, `follow` или `all`	Разрешено индексировать текст и ссылки на странице
`noindex`	Не индексировать текст страницы
`nofollow`	Не переходить по ссылкам на странице
`noindex`, `nofollow` или `none`	Запрещено индексировать текст и переходить по ссылкам
`noarchive`	Не показывать ссылку на сохраненную копию в поисковой выдаче

Яндекс

noyaca Не использовать описание из Яндекс.Каталога для сниппета в результатах поиска

Google

`nosnippet`	Запрещает показывать видео или фрагмент текста в результатах поиска
`noimageindex`	Запрещает указывать вашу страницу как источник ссылки для изображения
`noodp`	Не использовать описание из каталога DMOZ

Last-Modified

Альтернативно HTTP-заголовку Last-Modified задает дату последнего изменения для статических страниц.

<meta http-equiv="last-modified" content="2017-12-31@08:04:23 +00:00">

HTML

Document-State

Определяет частоту индексации для поисковых роботов.

<meta name="document-state" content="dynamic">

HTML

`static`	Индексировать один раз
`dynamic`	Индексировать страницу регулярно

Revisit-After

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

<meta name="revisit-after" content="5 days">

HTML

Управление кэшированием

Cache-Control

Указывает как браузеру кэшировать страницу.

<meta http-equiv="cache-control" content="no-cache">

HTML

Допустимые значения:

`public`	Кэшируется все
`private`	Кэшируется браузером, но не proxy-сервером
`no-cache`	Запрещает кэширование
`max-age=0`	Сколько секунд хранить в кэше

Pragma

Отключает кэширование.

<meta http-equiv="pragma" content="no-cache">

HTML

Expires

Дата окончания кэша браузера. Если указать прошедшую дату или 0, то документ не будет кэшироваться.

<meta http-equiv="expires" content="0">

HTML

Canonical — предпочитаемый канонический адрес

Если у страницы есть дубликаты с одним содержанием и разными URL, например:

https://example.com/category/jquery
https://example.com/category/jquery?sort=desc

В rel="canonical" указывается адрес, который будет считаться основным и будет использоваться в поисковой выдаче.

<link rel="canonical" href="https://example.com/jquery">

HTML

Указывает URL предыдущий страницы при пагинации.

<link rel="prev" href="https://example.com/jquery">

HTML

Указывает URL следующий страницы при пагинации.

<link rel="next" href="https://example.com/jquery?page=3">

HTML

Rel Alternate

Атрибут «Hreflang»

Этот атрибут указывает ссылки на разные языковые версии сайта. Код языка указывается в формате ISO 639-1.

<link rel="alternate" hreflang="ru" href="https://ru.example.com/">

HTML

Или код языка и региона, регион указывается в формате ISO 3166-1 Alpha 2:

<link rel="alternate" hreflang="ru-RU" href="http://ru-ru.example.com/">

HTML

Значение x-default говорит о том что страница главная и не соответствует какому-либо языку или региону.

<link rel="alternate" hreflang="x-default" href="http://example.com/">

HTML

Описание: Яндекс Google

Атрибут «Media»

Значение handheld или only screen and (max-width: 640px) указывают адрес мобильной версии.

<link rel="alternate" media="handheld" href="http://m.example.com/">
<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/">

HTML

Атрибут «Type»

application/rss+xml – ссылка на RSS канал.

<link rel="alternate" type="application/rss+xml" href="http://example.com/rss">

HTML

application/atom+xml – фид в формате Atom.

<link rel="alternate" type="application/atom+xml" href="http://example.com/atom">

HTML

Google

Google-Site-Verification

Подтверждение прав пользователя сервисов Google.

<meta name="google-site-verification" content="...">

HTML

Google-Play-App

Подобно apple-itunes-app выводит баннер приложения в Андроид.

<meta name="google-play-app" content="app-id=ru.название_приложения">

HTML

Google

Значение «Notranslate»

Если страница написана на языке, который не подходит пользователю, Google добавляет ссылку, позволяющую сделать перевод на нужный язык. Значение notranslate отключает эту функцию.

<meta name="google" value="notranslate">

HTML

Значение «Nositelinkssearchbox»

Иногда в результатах поиска Google рядом со ссылками на сайт появляется окно поиска по сайту. С помощью данного мета-тега можно отключить показ этого поля.

<meta name="google" content="nositelinkssearchbox">

HTML

Chrome-Webstore-Item

Добавление ссылки в Интернет-магазин Chrome.

<link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/xxxxxxxxxxxxx">

HTML

Publisher

Google использует для связи между сайтом и его страницей в Google+.

<link rel="publisher" href="https://plus.google.com/xxxxxxxxx">

HTML

Разное

Search

Указывает на XML файл OpenSearch, который позволяет делать поиск по сайту в браузере не заходя на него.

Подробнее о формате на http://opensearch.org.

<link rel="search" type="application/opensearchdescription+xml" title="Поиск на example.com" href="http://example.com/opensearch.xml">

HTML

Referrer

Задает HTTP-заголовок «Referer» который отправится на сервер при переходе по ссылкам.

<meta name="referrer" content="origin">

HTML

`none`	Никогда не передает заголовок
`none-when-downgrade`	Заголовок передается только если используется HTTPS
`origin`	Передает данные о хостах и поддоменах
`unsafe-url`	Передает полный URL

Refresh

Задаст задержку в секундах, после чего браузер обновит страницу.

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

HTML

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

<meta http-equiv="refresh" content="10; URL=http://www.name.com/">

HTML

Skype Toolbar

Мета-тег skype_toolbar отключает расширение Skype на странице (только старые версии).

<meta name="skype_toolbar" content="skype_toolbar_parser_compatible">

HTML

CSRF

Свидетельствует о том, что на сайте реализована защита от CSRF-атак.

<meta name="csrf-token" content="gZoOqHdVwfq2QpfkwH6lQE75ivykrHdOS0rVfhiX">
<meta name="csrf-param" content="authenticity_token">

HTML

Ссылка на канал в телеграм

<meta name="telegram:channel" content="@telegram">

HTML

Тег Base

Указывает браузеру как обрабатывать относительные URL в ссылках и src изображений относительно адреса текущей страницы.

В примере, браузер запросит изображение по адресу:
http://site.ru/category/images/logo.png

<head>
	<base href="http://example.com/category/">
</head>
<body>
	<img src="images/logo.png">
</body>

HTML

Источник

META-теги

META-теги имеют два возможных атрибута

Атрибут HTTP-EQUIV

Значения поля content для Аттрибута HTTP-EQUIV

Атрибут NAME

Источники информации:

Атрибуты

Замечания

Пример

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

Совместимость с браузерами

Смотрите также

Кодировка символов и язык

Информация о документе

Описание страницы и ключевые слова

Адрес

Обновление страницы

Время действия документа и кэш

Команды для робота

Автоматический переход на другую страницу

Эффекты при переходе по ссылке

Полезные советы:

Функции мета-тегов

Группы метатегов

Группа значений атрибута NAME

«keywords» (ключевые слова)

«description» (описание страницы)

«Author» и «Copyright»

«Robots»

Группа значений атрибута HTTP-EQUIV

«Content-Type»

«refresh»

«Content-Language»

Пример HTML:

Задачи

Итоговое задание [10-14]

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

Индексация веб-страницы

Автоматическая перезагрузка страницы

Автозагрузка новой страницы

Описание страницы

Title

Description

Keywords

Кодировка сайта

Application-Name

Generator

Author

Copyright

Reply-To

Content-Language

Help

Управление индексацией

Robots

Last-Modified

Document-State

Revisit-After

Cache-Control

Pragma

Expires

Prev

Next

Атрибут «Hreflang»

Атрибут «Media»

Атрибут «Type»

Google

Google-Site-Verification

Google-Play-App

Google

Значение «Notranslate»

Значение «Nositelinkssearchbox»

Chrome-Webstore-Item

Publisher

Разное

Search

Referrer

Refresh

Skype Toolbar

CSRF

Ссылка на канал в телеграм