Значение и применение
Тег обеспечивает метаданные о HTML документе. Метаданные не отображаются на странице, но интерпретируются браузерами и поисковыми системами.
Мета элементы, как правило, используются, чтобы указать описание страницы, ключевые слова, автора документа и другие метаданные. Разрешается и, как правило, необходимо использовать несколько метатегов. Тег всегда размещается внутри тега
. XHTML требует закрывающего тега , в HTML элемент считается одиночным.Поддержка браузерами
| Тег | Opera | IExplorer | Edge |
|||
|---|---|---|---|---|---|---|
| Да | Да | Да | Да | Да | Да |
Атрибуты
| Атрибут | Значение | Описание |
|---|---|---|
| character_set | Задает кодировку символов для HTML документа. | |
| content | text | Задает значение, связанное с атрибутами name и http-equiv , в зависимости от контекста. |
| http-equiv | content-security-policy content-type default-style refresh | Фактически эквивалентен гипертекстовому заголовку (имитация http-заголовка), формируют заголовок страницы и определяют его обработку. Как правило, они управляют действиями браузеров и используются для формирования информации, выдаваемой обычными http-заголовками. |
| name | application-name author description generator keywords | Определяет имя документа на уровне метаданных. |
| scheme | format/URI (универсальный идентификатор ресурса) | Не поддерживается в HTML 5.
Указывает полезную информацию о схеме или названии самой схемы, которая должна быть использована для уточнения значения свойства атрибута content . |
Пример использования
Указание кодировки документа
Тег позволяет сообщить браузеру посетителя, какой набор символов и какую кодировку необходимо установить на веб-странице. Атрибут (HTML тега ) задает кодировку символов для HTML документа.
charset = "utf-8" >Это заголовок.
Это параграф.
В данном примере мы задали кодировку документа UTF-8 с использованием элемента и атрибута . Кодировка UTF-8 одна из общепринятых и стандартизированных кодировок текста, которая позволяет хранить символы Юникода.
Часто используемые мета-теги
Метаданные разделены на две основные группы:
- первая группа - значения атрибута name .
- вторая группа - значения атрибута
Давайте согласимся иметь разногласия.
Роберт Льюис Стивенсон.
Э то урок, в котором мы поговорим о том, что такое мета-теги , для чего и как они используются при и как их правильно заполнить.
К ак я уже говорил в , мета-теги располагаются в заголовке html-страницы, между тегами и, и никак не отображаются браузером (за исключением содержимого тега «title»). Тем не менее, мета-теги для сайта играют очень важную роль. Их добавление и оптимизация могут существенно помочь сайту в его жизни.
Р екомендую использовать только те метатеги, которые реально нужны для работы сайта. Не загромождай область «head» лишними инструкциями, т.к. любая ошибка здесь может привести к печальным последствиям. Если знать, что делаешь, то мета-теги будут только на пользу, если же сваливать сюда всё подряд, то можно получить трудно диагностируемые проблемы.
ервый мета-тег очень важен. Причём этот мета-тег одинаково важен и для поисковых систем, и для посетителей. Первые в ранжировании результатов поиска придают большое значение ключевым словам, которые содержатся в теге «title», вторые видят его содержимое в виде ссылки на сайт в тех же результатах поиска:С одержимое этого же мета-тега отображается и в заголовке окна :
В HTML мета-тег «title» добавляется следующим образом:
Содержимое мета-тега «title»
Основное содержимое страницы
К роме того, как я уже сказал ранее, ключевые слова , которые ты добавишь в мета-тег «title», крайне положительно воспримутся поисковиками. Поэтому, заполняя этот тег, постарайся включить в него правильные ключевые слова. О них, кстати, и пойдёт речь дальше.
§ 2. Мета-тег «keywords» (ключевые слова)
С начала вкратце о том, а что, собственно, такое эти самые «ключевые слова».
Т е слова, которые наиболее полно характеризуют содержимое html-страницы и будут для нее ключевыми. Это могут быть как отдельные слова, так и словосочетания, но они обязательно должны встречаться в тексте на странице. По ним поисковики определяют релевантность страницы тому или иному запросу.
Н апример, для этой странице ключевыми словами будут «мета-теги», «мета-тег title», «мета-тег keywords» и т.д.
Б олее подробно о ключевых словах, в частности, и об оптимизации сайта, вообще, мы поговорим в .
Ч тобы облегчить работу поисковым системам, используется мета-тег «keywords». В нём вебмастер прописывает ключевые слова для страницы. HTML-код мета-тега «keywords» выглядит следующим образом:
Перечень ключевых слов">
Содержимое мета-тега «title»Основное содержимое страницы
К лючевые слова нужно добавлять по одному, через запятую, в единственном числе. Например, не «ключевые слова», а «ключевой, слово». К тому же, безответственное поведение вебмастеров, которые в целях получения более высоких позиций в поисковиках забивали мета-тег «keywords» не только ключевыми словами, но и многочисленными производными от них, привело к тому, что поисковые системы практически перестали обращать внимания на этот тег. В настоящее время правильно заполненный мета-тег «keywords» используется поисковиками лишь как один из многих факторов ранжирования (далеко не главный). Если же они видят перед собой «keywords», в который запихнули все возможные вариации ключевиков, то это становится для них первым сигналом о неблагонадёжности данной страницы.
§ 3. Мета-тег «description» (описание страницы)
С ледующим важным мета-тегом является тег «description», в котором должно содержаться краткое описание страницы. Именно «краткое» и именно «описание страницы». Достаточно добавить одно-два небольших предложения, в которых указать о чём и для кого эта страница.
В ажной особенностью мета-тега «description» является то обстоятельство, что в случае его правильного заполнения поисковые системы именно на его основе формируют сниппет страницы в выдаче (краткое описание под ссылкой на страницу):
Е сли поисковикам не нравится то, как заполнен мета-тег «description», то сниппет формируется из кусочков фраз (надёрганных со всей страницы), которые релевантны запросу.
Т аким образом, правильный мета-тег «description» обязательно содержит ключевое слово (фразу) и коротко и точно описывает то, о чём и для кого страница. «Description» вместе с «title» образуют пару очень важных мета-тегов, от которых зависит то, перейдёт пользователь из поисковой выдачи на сайт или нет! Поэтому его, как и «title», нужно прописывать для каждой страницы!
H TML-код для создания мета-тега «description» будет следующим:
Содержимое мета-тега «description»">
Содержимое мета-тега «title»Основное содержимое страницы
Т еперь перейдём к описанию основных технических мета-тегов из группы «HTTP-EQUIV» (HTTP-эквиваленты).
§ 4. Технические мета-теги
Т ехнические мета-теги, для сайта, значат очень много. С их помощью можно управлять отображением страницы, настройками индексирования и т.д. В этом уроке мы рассмотрим основные технические мета-теги.
- content-type - тип документа и его кодировка. Этот мета-тег нужен для правильного отображения символов браузером.
Кодировок существует много. Большинство из них тебе даже никогда не встретится. Не говоря уже про то, что ты будешь их использовать сам. Современные браузеры определяют тип кодировки атоматически, но для большей уверенности можно указать его и самостоятельно. Если ты создаёшь html-документ в операционной системе Windows, языком которой является русский, то кодировка будет «windows-1251», а код для вставки мета-тега такой:Содержимое мета-тега «title»
Основное содержимое страницы
- content-language - указание языка документа. Значение этого необязательного мета-тега используется как поисковыми роботами, так и web-серверами. Код для вставки:
Содержимое мета-тега «title»
Основное содержимое страницы
- refresh - время (в секундах), через которое произойдет автоматическая перезагрузка документа или переход на другую html-страницу с заданным адресом (url). Например, чтобы производить атоматическую перезагрузку документа каждые 30 секунд, нужно вставить этот мета-тег так:
Содержимое мета-тега «title»
Основное содержимое страницы
А, чтобы, спустя 5 секунд, перейти на страницу по адресу http://www.сайт/, нужно записать так:
Содержимое мета-тега «title»
Основное содержимое страницы
- robots - мета-тег, который отвечает за настройки индексирования страницы. У мета-тега «robots» могут быть следующие значения:
- index - страница индексируется;
- noindex - страница не индексируется;
- follow - гиперссылки на странице учитываются;
- nofollow - гиперссылки на странице не учитываются
- all - заменяет «index» и «follow», т.е. страница индексируется и гиперссылки на ней учитываются (действует по умолчанию);
- none - заменяет «noindex» и «nofollow», т.е. страница не индексируется и гиперссылки на ней не учитываются.
Код для вставки мета-тега «robots»:
Содержимое мета-тега «title»
Основное содержимое страницы
author и copyright - мета-теги, которые позволяют указать авторство и владельца контента на странице. HTML-код для вставки:
Содержимое мета-тега «title»
Основное содержимое страницы
§ 5. Заключение
Э то все метатеги в HTML, которые будут нужны новичку. Остальные специфичны и могут понадобиться тебе после того, как наберешься опыта и будешь точно знать, что делаешь. Из всех же вышеперечисленных мной настоятельно рекомендую использовать на каждой странице твоего сайта следующие:
Заголовок страницы
О стальные применяй по мере необходимости, но особо не заморачивайся. Помни, что мета-теги не сделают твой сайт интересным, они могут лишь помочь браузеру и web-серверу правильно отобразить страницы сайта, а поисковой системе их найти.
Н а этом раздел моего сайта окончательно закончен и дальше речь пойдёт о том, с чего начать раскрутку и продвижение своего сайта в Интернете. Там же парочка моих советов из личного опыта по оптимизации страниц сайта. Жми на «Дальше».
Мета теги (meta tags) - это специальные теги html, которые входят в состав заголовочных тегов html и не видны пользователю на странице
Эти теги не являются обязательными. Однако в мета тегах заключена важная служебная информация для браузера и поисковой машины, о которых мы и поговорим дальше.
Важным свойством мета тегов является то, что они все находятся внутри заголовочного тега
.Все мета теги можно разделить на три группы:
- Для поисковой машины (учитываются при продвижении сайта)
- Для браузера (учитываются только браузером)
- Информация об авторе
1. Мета теги для поисковой машины
Для оптимизаторов и поисковых машин только эти теги имеют значение. Однако в последнее время их вес в ранжировании сайтов значительно упал, но при этом ни одна поисковая система не сказала, что полностью отказывается от этих тегов.
Мета теги, которые учитывает поисковая машина:
- title
- заголовок страницы, другими словами название страницы. Очень важный тег в ранжировании сайтов (см. тег
);</li> <li><b>description </b> - описание страницы сайта (см. );</li> <li><b>keywords </b> - ключевые слова страницы сайта (см. );</li> <li><b>robots </b> - управляет индексацией документа, а также ссылками в этом документе. Имеет следующий синтаксис:</li> </ul><blockquote><meta name ="Robots " content ="ПАРАМЕТРЫ "> </blockquote> <p>Параметры могут принимать следующие значения:</p> <ul><li>index (разрешить индексацию документа)</li> <li>noindex (запретить индексацию документа)</li> <li>follow (разрешить следовать по ссылкам)</li> <li>nofollow (запретить следовать по ссылкам)</li> <li>all (равносильно сочетанию index и follow)</li> <li>none (равносильно сочетанию noindex, nofollow)</li> </ul><p>По умолчанию стоит all, что является нормой для большинства страниц интернета. Например, если хотите запретить страницу к индексации и обход ссылок, то надо написать none или noindex, nofollow (тег noindex и ).</p> <p><u>Примечание </u>: <br>Наверняка Вы слышали про файл robots.txt (см. как правильно создать robots.txt), в котором можно запрещать к индексации отдельные страницы сайта или даже целые разделы. Однако поисковая машина все равно может проиндексировать документ, который закрыт, через robots.txt, т.к. это всего лишь рекомендация для поисковой машины. В свою очередь мета тег robots позволяет со 100% точностью закрыть нужный документ от индексации.</p> <p>4. <b>Revisit </b> - позволяет указать, как часто нужно переиндексировать документ. Этот мета тег устарел и не учитывается поисковыми роботами. Его никто сейчас не воспринимает в серьез.</p> <h2>2. Мета теги для браузера</h2> <p>Главная задача мета тегов для браузера - это корректно отображать страницу сайта для пользователя.</p> <p>В этом варианте есть пару важных тегов, давайте рассмотрим каждый из них. Синтаксис мета тега в общем случае следующий:</p> <blockquote><meta http-equiv ="параметр " content ="параметр2 "> </blockquote> <p>Могут быть использованы следующие параметры атрибута:</p> <ul><li><b>Content-Type </b> - служит для задания кодировки страницы сайта. Обычно используется кодировка кириллицы Windows-1251 или UTF-8</li> <li><b>Content-Language </b> - задает язык, на котором написана страница. На мой взгляд не очень важный тег</li> <li><b>Cache-Control </b> - параметры кэширования документа</li> <li><b>Refresh </b> - этот мета тег задает промежуток времени для 301 редиректа</li> </ul><h2>3. Мета теги c информацией об авторе</h2> <p>Напоследок расскажу о том, как можно задать информацию о браузерах через мете таги:</p> <ul><li>Site-created - дата запуска сайта;</li> <li>author - имя автора сайта;</li> <li>owner - указывает владельца документа;</li> <li>reply-to - контакты автора;</li> <li>address - адрес автора.</li> </ul><p>Честно говоря, эти теги на данный момент никому не нужны, но тем не менее они есть.</p> <p>Приветствую!</p> <p>Новый Год уже совсем близко подошел. Осталось всего каких-то два дня. А это значит, что пора подводить итоги, уже почти прошедшего, года, чем завтра и займусь. Ну а сейчас я расскажу вам о том, что такое метатеги и как их правильно прописать на странице и еще кое-что.</p> <p>Начнем с определения метатегов:</p> <p>Метатеги — это теги HTML или XMTL, предназначенные для передачи структурированных данных о веб-страницах поисковым роботам и браузерам. </p> <p>Вот эти самые теги нужны только браузерам и поисковым роботам. Выполняют следующие функции:</p> <ul><li>Передают поисковикам и браузерам информацию о веб-странице;</li> <li>Содержат управляющие команды для поискового робота и браузера;</li> <li>Сообщают информацию о веб-странице и авторе.</li> </ul><p>Но сегодня разберем мы только теги, выполняющие две первые функции в списке выше. Они-то и являются самыми необходимыми с точки зрения SEO.</p> <h2>Метатеги Description, Keywords и тег Title</h2> <p>Итак, метатеги Description, Keywords и тег Title передают информацию поисковому роботу и браузерам о веб-странице. При правильном их заполнении улучшается индексация страницы, поэтому их заполнению следует уделить особое внимание. Но прежде, давайте разберемся с каждым из тегов.</p> <ul><li>Мета-тег Description — указывается описание веб-страницы, которое обычно используется поисковыми системами в сниппетах;</li> <li>Мета-тег Keywords — здесь указываются ключевые слова которым соответствует контент на странице;</li> <li>Тег Title — заголовок страницы, который вы можете увидеть в результатах поисковой выдачи и на вкладке браузера. Этот тег не относится к мета тегам, но он выполняет схожие функции с вышеперечисленными.</li> </ul><p>Раньше, лет 20 назад, с помощью только этих тегов, можно было без проблем продвинуться в ТОП по любому ключевому слову, главное заполнить их грамотно и все. Но в нынешнее время ситуация круто изменилась: из-за того, что вебмастера злоупотребляли этим, поисковики перестали учитывать данные метатеги, как фактор ранжирования. Теперь, просто заполнив их грамотно, продвинуться в ТОП невозможно.</p> <p>Возможно в вашей голове возник вопрос: зачем тогда они нужны? А вот ответ: метатеги, как уже было сказано выше, положительно влияют на индексацию страницы. Кроме того, информация, указанная в них, является важнейшим фактором внутренней оптимизации. А это, поверьте мне, немаловажно!</p> <h2>Метатег Robots</h2> <ul><li>Index — разрешить индексацию;</li> <li>Noindex — запретить индексацию;</li> <li>Follow — разрешить индексацию ссылок;</li> <li>Nofollow — запретить индексацию ссылок;</li> <li>All — разрешить индексацию страницы и ссылок</li> <li>None — запретить индексацию страницы и ссылок.</li> </ul><p>В некоторых случаях, этот метатег действительно нужен. Обращаться с ним нужно очень аккуратно, а то ненароком можно и закрыть от индексации нужные страницы.</p> <h2>Как заполнять метатеги?</h2> <p>Все метатеги прописываются в пределах тегов <head></head>, то есть в самом начале кода.</p><p> <head> <meta name="description" content="Урок о метатегах"> </head> </p><p>Как видите, метатег прописывается в коде элементом «<meta>» с наличием обязательных атрибутов:</p> <ul><li>name — прописывается сам метатег;</li> <li>content — прописывается значение тега.</li> </ul><p>Посмотрите пример выше.</p> <h3>Как заполнить тег Title?</h3> <p>В теге Title прописывается заголовок страницы, который отображается в выдаче поиска и вкладке браузера. По сути, это самый важный тег с точки зрения привлечения посетителей с поиска. А это значит только одно: чем привлекательней для потенциального клиента будет заголовок, тем больше у вас будет посещений (при условии, что вы в ТОП — 10, конечно).</p> <p><b>В заголовке должно содержаться ключевое слово по которому продвигается страница. </b></p> <p> <title>Что такое мета теги и как их заполнять? Как заполнить мета тег Description?
Description тоже очень важен для привлечения посетителей, так как ПС ставят в сниппет то, что написано в этом теге. Количество символов ограничено до 120-150 символов. Поэтому крайне важно сделать такое описание, которое бы носило в себе максимум информативности о странице.
Советы по заполнению:
- Не дублируйте то, что написано в теге Title;
- Разбавьте ключевой запрос тематическим текстом;
- Пишите только по делу!
Как заполнить мета тег Keywords?
Этот тег предназначен только для ПС и то они его не учитывают, а значит он бесполезен. Поэтому и расскажу я про него немного.
Ключевые слова должны быть перечислены через запятые.
Из всего написанного можно сделать вывод: самыми важными тегами являются Title и Description. Их заполнению нужно уделить особое внимание!
Ну а на этом все, дорогие друзья!
До скорых встреч и с наступающим!
Тест по уроку №77
Лимит времени: 0
Навигация (только номера заданий)
0 из 5 заданий окончено
Информация
Проверьте, полученные на уроке, знания!
Вы уже проходили тест ранее. Вы не можете запустить его снова.
Тест загружается...
Вы должны войти или зарегистрироваться для того, чтобы начать тест.
Вы должны закончить следующие тесты, чтобы начать этот:
Результаты
Правильных ответов: 0 из 5
Ваше время:
Время вышло
Вы набрали 0 из 0 баллов (0 )
- С ответом
- С отметкой о просмотре
Задание 1 из 5
1 .
Количество баллов: 1Могут ли браузеры воспринимать мета-теги?
Задание 2 из 5
2 .
Количество баллов: 1Является ли тег Title мета-тегом?
Задание 3 из 5
3 .
Количество баллов: 1За что отвечает мета-тег Description?
Один из вариантов применения тега meta - указание HTTP -заголовков, которые должны быть отправлены клиенту до отправки самой веб-страницы. Например:
<meta http-equiv = "Content-Type" content = "text/html" / >
Такая запись указывает, что страница должна быть отправлена вместе с HTTP-заголовком Content-Type: text/html. Такой заголовок указывает браузеру или другой программе тип отправляемого документа. Тем не менее, несмотря на то, что первоначально предполагалось, что веб-серверы будут считывать meta-теги внутри отправляемых клиенту веб-страниц, и формировать HTTP-заголовки в зависимости от их содержимого, на практике это не реализовано в наиболее используемых веб-серверах, соответственно, веб-серверы не меняют отправляемые клиенту HTTP-заголовки, а клиент (веб-браузер) обрабатывает эти meta-теги самостоятельно (в частности, данные из meta-тегов могут заменять данные, получаемые из HTTP-заголовков ).
Кроме того, meta-теги могут использоваться для того, чтобы сообщить браузеру информацию о документе, когда HTTP-заголовки недоступны (например, если страница открывается локально с диска, а не загружается с веб-сервера).
В общей форме метаданные записываются в следующем виде: в теге meta указывается атрибут name (имя) и связанный с ним атрибут content (содержимое), в котором описывается какой-либо аспект веб-страницы, например, ключевые слова:
<meta name = "keywords" content = "википедия, энциклопедия" / >
Функции мета-тегов
Функции мета-тегов достаточно разнообразны, однако на данный момент не существует их четкой стандартизации. Тем не менее, можно выделить несколько основных направлений использования мета-тегов:
- Мета-теги способны идентифицировать авторство Интернет-страницы, ее адрес, частоту ее обновлений;
- Мета-теги используются поисковыми системами для индексации и создания заголовков гипертекстовых документов;
- Не выводясь на экран, мета-теги влияют на режим отображения Интернет-страниц.
Группы мета-тегов
Мета-теги разделены на две основные группы - NAME и HTTP-EQUIV. Группа NAME отвечает за текстовую информацию о странице, ее авторе, а также - рекомендации для поисковых систем. HTTP-EQUIV фактически эквивалентны гипертекстовым заголовкам, формируют заголовок страницы и определяют его обработку. Как правило, они управляют действиями браузеров и используются для формирования информации, выдаваемой обычными заголовками.
Группа NAME
Мета-тег Author и Copyright
Мeтa-тeг PICS-Label
Мeтa-тeг Window-target
Определение окна загружаемой страницы.
Мета-тег Imagetoolbar
Отключает Панели управления изображениями. Обычно используют при выводе баннеров, фона картинки, карты изображения и др., когда вывод данной панели нежелателен.
<meta http-equiv = "imagetoolbar" content = "no" / >
Значение мета-тегов
Метаданные о веб-странице изначально предназначались в том числе для того, чтобы помочь поисковым машинам отнести веб-страницу к той или иной категории. В 90-е годы мета-теги активно использовались в целях раскрутки своего сайта, в том числе предоставляя ложные или избыточные метаданные. После этого поисковые машины стали придавать мало внимания метаданным; теперь большее значение имеет правильное структурирование веб-страницы и наличие большого количества ссылок на сайт с авторитетных ресурсов.
