Что такое мета теги, как правильно заполнить и проверить: примеры из практики
Содержание:
- description (краткое описание)
- Мета теги заголовков (H1-H6)
- Особенности работы с поисковыми ботами
- Мета-теги технического плана
- Описание
- Примеры
- Устаревшие мета-теги
- Проверка мета-тегов через сервис Вебмастер Яндекс
- Заполнение тега Descriptions
- Alt атрибуты изображения
- Определение модели
- Информация, содержащаяся в теге
- Очистка списка статических маршрутов
- Почему тегу Title следует уделить внимание
- Управление режимами Internet Explorer
- Пример использования
- Поиск самого ближнего сервера
description (краткое описание)
Значение description используется для краткого описания содержимого, расположенного на текущей странице. Рекомендуемая максимальная длина такого описания не должна превышать 180 символов:
<meta name="description" content="Описание содержимого на данной странице">
Краткое описание страницы может быть использовано поисковыми система на странице с результатами поиска под названием страницы и URL-адреса:
Также краткое описание используется на сайтах некоторых соцсетей, при добавлении ссылки:
При составлении краткого описания следует учитывать следующие моменты:
- в описании нужно указывать именно ту информацию, которая отражает содержимое, опубликованное на данной странице;
- описание должно быть уникальным и не должно повторяться для разных страниц;
- старайтесь в описание страницы также включать необходимые ключевые слова, которые будут учитываться в поисковых запросах.
Примечание: краткое описание, расположенное под ссылкой на странице с результатами поиска, называется сниппетом.
Мета теги заголовков (H1-H6)
Теги подзаголовков – это HTML-теги, используемые для отграничения заголовков и подзаголовков в вашем контенте от других типов текста (например, текста абзаца). Использование heading tags в наши дни является темой многих споров.
Хотя теги H2-H6 считаются не столь важными для поисковых систем, правильное использование тега H1 подчёркивалось во многих отраслевых исследованиях. В то же время Джон Мюллер не устаёт повторять, что подзаголовки вообще не являются факторами ранжирования.
Однако стоит помнить, что заголовки имеют решающее значение для организации контента на страницах сайтов. Использование мета тегов заголовков, безусловно, улучшает архитектуру контента.
- Поисковым системам намного легче читать и понимать хорошо организованный контент, чем продираться через простыни неструктурированного содержания.
- Пользователям заголовки указывают на основные разделы в стене текста и облегчают навигацию по странице.
Оба эти фактора повышают важность тщательной оптимизации мета тегов, когда мелкие детали складываются в большую и удобную для пользователя картину, и могут привести к улучшению позиций в поисковой выдаче
Оптимизация подзаголовков
Заголовки должны соответствовать тому фрагменту текста, который они описывают
То, что они не являются фактором ранжирования (по словам Мюллера), не означает, что поисковые системы не принимают их во внимание.
Заголовки всегда должны отражать тональность текста, над которым они расположены. Избегайте заголовков вроде «Глава 1… Глава 2… Глава 3…».
Не злоупотребляйте тегами и ключевыми словами в них
Подзаголовки должны быть понятны простым людям.
Должны ли совпадать мета-теги title и H1?
Согласно официальным рекомендациям Google по созданию статей, название страницы (в HTML-теге <title>), на которой размещён материал, должен совпадать с заголовком статьи (в теге <h1> или аналогичном). Так что здесь можно обойтись одним и тем же текстом для обоих элементов.
Особенности работы с поисковыми ботами
Чтобы индексация сайта поисковыми роботами происходила быстро и эффективно, необходимо:
Кроме ошибок в robots.txt, медленной скорости загрузки сайта и блокировки в .htaccess, причинами плохой индексации могут быть:
3.1. Высокая нагрузка на сервер при посещениях роботов
Индексация ботами поисковых систем крайне важна для продвижения, однако в некоторых ситуациях она может перегружать сервер, либо под видом роботов сайт могут атаковать хакеры. Чтобы знать цели, с которыми боты обращаются к ресурсу, и отслеживать возможные проблемы, проверяйте логи сервера и динамику серверной нагрузки в панели хостинг-провайдера. Критические значения могут свидетельствовать о проблемах, связанных с активным доступом к сайту поисковых роботов.
Когда роботы перегружают сервер слишком активными запросами к сайту, можно снизить их скорость обхода. Как это сделать, узнайте из справок и .
3.2. Проблемы из-за доступа фейковых ботов к сайту
Бывает, что под видом ботов Google к сайту пытаются получить доступ спамеры или хакеры. Если возникла такая проблема, проверьте, действительно ли сайт сканирует поисковый робот Google:
-
В логах сервера хостинг-провайдера скопируйте IP-адрес, с которого был сделан запрос к сайту.
-
Проверьте данный IP с помощью сервиса MyIp.
-
Затем проверьте адрес, указанный в строке IP Reverse DNS (Host).
Полученный IP-адрес должен совпадать с исходным в логах сервера, иначе это говорит о том, что имя бота поддельное. В данном случае сайт действительно сканировал Googlebot Аналогично проверяются и вызвавшие подозрения боты Яндекса.
Узнайте о других причинах плохой индексации из нашего поста «Почему поисковые роботы и Netpeak Spider не сканируют ваш сайт».
Чтобы узнать, как тот или иной поисковый бот сканирует ваш сайт, воспользуйтесь краулером Netpeak Spider, который позволяет имитировать поведение робота. Для анализа необходимо:
-
Открыть настройки «Продвинутые» и выбрать шаблон «По умолчанию: бот» → он предполагает учёт всех инструкций по сканированию и индексации.
-
Перейти на вкладку «User Agent» и из списка ботов выбрать нужного.
- Начать сканирование и по окончании ознакомиться с полученными данными.
3.3. Список ботов поисковых систем
Поисковые системы используют различные типы роботов: для индексации обычных страниц, новостей, изображений, фавиконов и прочих типов контента. Список IP-адресов, которые используют боты поисковиков, постоянно меняется и не разглашается.
3.2.1. Роботы Google
Полный список роботов Google можно посмотреть в справке. Рассмотрим наиболее популярных ботов:
- Googlebot — к ним относятся краулеры двух типов: для десктопных и мобильных версий стандартных сайтов. С июля 2019 года для новых и адаптированных под мобильные устройства сайтов включено приоритетное сканирование мобильных версий, соответственно большинство запросов будут обрабатывать мобильные боты.
-
Googlebot Images — поисковый робот для индексации изображений. При желании можно запретить индексацию всех картинок на сайте с помощью такой директивы в robots.txt:
User-agent: Googlebot-Image
Disallow: / - Googlebot News — бот, добавляющий материалы в Google Новости.
- Googlebot Video — робот, индексирующий видеоконтент.
- Google Favicon — краулер, собирающий фавиконы сайтов.
- APIs-Google — агент пользователя для отправки PUSH-уведомлений. Такие уведомления используются, чтобы веб-разработчики могли быстро получить информацию о каких-либо изменениях на сайтах без излишней нагрузки серверов Google.
- AdsBot Mobile Web Android, AdsBot Mobile Web, AdsBot — краулеры, проверяющие качество рекламы на различных типах устройств.
3.2.2. Роботы Яндекс
У Яндекса тоже обширный список ботов, который можно детально изучить в Яндекс.Помощи. Расскажу о некоторых из них:
- Основной робот, индексирующий страницы, — YandexBot/3.0. Указания боту можно указывать с помощью директив в robots.txt.
- Бот, скачивающий страницы для проверки их доступности, — YandexAccessibilityBot/3.0. Этот краулер игнорирует команды в файле robots.txt.
- Робот, определяющий зеркала проектов, — YandexBot/3.0; MirrorDetector.
- Бот, индексирующий картинки, — YandexImages/3.0.
- Бот, который скачивает фавиконы сайтов. — YandexFavicons/1.0.
- Краулер, индексирующий мультимедийный контент, — YandexMedia/3.0.
- Бот, собирающий материалы для Яндекс.Новостей, — YandexNews/4.0.
- Краулеры Яндекс.Метрики — YandexMetrika/2.0, YandexMetrika/3.0.
Мета-теги технического плана
Эти элементы используются для внутренней оптимизации сайта. Они отвечают за передачу информации пользователям и содержат некоторые команды для поисковых роботов (например, позволяют закрыть от индексации отдельные страницы или разделы). Рассмотрим основные технические мета-теги:
Content-language
Передают информацию о том, на каком языке представлено содержимое страницы. Сейчас поисковые боты и браузеры научились автоматически определять язык. Однако при неправильных настройках этот тег окажется полезным.
Content-type
Содержит данные о типе документа и кодировке. Браузер не всегда правильно определяет кодировку с содержанием на кириллице. Переключить кодировку вручную нельзя, поэтому пользователь не получит доступ к контенту. Наличие этого тега решает ситуацию.
Robots
Тег указывает поисковым роботам, какие страницы индексировать, а какие — нет. Можно избирательно закрывать от индексации контент, ссылки, картинки для Google или Яндекс.
Чтобы тег правильно восприняли поисковые роботы, содержимое атрибута должно включать одну или несколько директив:
- index/noindex – указывает боту индексировать или не индексировать ссылки на странице.
- follow/nofollow – анализировать или не учитывать ссылки на странице.
- all/none – индексировать страницу или нет.
- noimageindex – не индексировать картинки на странице.
- noarchive – говорит поисковому роботу, чтобы он не выводил в поисковой выдаче ссылки «Сохраненная копия». Так пользователи не смогут посмотреть копию страницы из базы поисковой системы, если вдруг сайт будет недоступен или страница удалена.
- nosnippet – команда запрещает вывод сниппета в поисковой выдаче.
Refresh
Тег используется для автоматического обновления страницы или переадресации на другой раздел/сайт. Можно задавать время, когда произойдет это обновление или переадресация: 5 сек, 10 сек и так далее.
Актуально при обновлении ресурса: вместо ожидания долгой загрузки или ошибки 404 пользователь перенаправляется в новый раздел, что сокращает количество отказов.
Copyright и Meta Author
Он не участвует в формировании сниппета (не путайте с микроразметкой Schema.Org), а используется для указания автора и авторских прав.
Описание
Мета тег является, вероятно, наиболее часто используемым. Он предоставляет поисковому роботу короткое описание страницы. Например:
<meta name=”description” content=”Урок о мета тегах для поисковой оптимизации”/>
Раньше данный тег использовался для повышения ранжирования страницы, но изменения алгоритмов работы поисковых систем уменьшили его влияние на результат выдачи по поисковому запросу. Однако данный мета тег все еще может быть полезен, так как поисковые сервера используют информацию из него на страницах результатов.
Но что случится, если оставить мета тег описания пустым или совсем его не использовать? Поисковый сервис также будет выдавать короткое описание страницы в результатах запроса, но оно будет составлено самим сервисом. В большинстве случаев такое описание не настолько хорошо, как хотелось бы. То есть, в таком случае вы теряете возможность убедить пользователя перейти на свою страницу.
Примеры
Пример 1 — определение ключевых слов для поисковых систем:
<meta name=»keywords» content=»HTML, CSS, XML, XHTML, JavaScript»>
Пример 2 — Определите описание веб-страницы:
<meta name=»description» content=»Free Web tutorials on HTML and CSS»>
Пример 3 — Определите автора страницы:
<meta name=»author» content=»html5css»>
Пример 4 — обновление документа каждые 30 секунд:
<meta http-equiv=»refresh» content=»30″>
Пример 5 — Настройка видового экрана, чтобы сделать ваш сайт хорошо выглядел на всех устройствах:
<meta name=»viewport» content=»width=device-width, initial-scale=1.0″>
Устаревшие мета-теги
Мета-тег Keywords
Синтаксис
<meta name="keywords" content="ключевое слово 1, ключевое слово 2, ключевое слово 3, ..." />
Тег должен находиться внутри контейнера <head>…</head> в любом месте.
Данный мета-тег уже долгое время не учитывается системой Google, Яндекс официально сообщает о том, что данный тег может использоваться при определении соответствия страницы поисковым запросам. Однако подтверждений тому, что мета-тег kewords помогает в ранжировании сайта в Яндексе нет. Тем не менее, приведем ниже требования SEO к правильному заполнению мета-тега, которые были актуальны порядка 10 лет назад.
Требования SEO
- Использовать не больше 5-6 слов,
- использовать не более 3-х повторов,
- не стоит использовать союзы, предлоги, междометия.
Примеры правильного заполнения тегов
автополив газонов, авто полив, системы, купить, цены, москва
Ошибки и неудачные примеры мета-тегов
- автополив газонов, автополив газонов купить, автополив газонов цены, автополив газонов москва, система автополива газонов, авто полив газонов, авто полив газонов купить, авто полив газонов цены, авто полив газонов москва, система авто полива газонов
- автополив газонов, секс, порно, девки,
Мета-тег NoODP
Синтаксис
<meta name="robots" content="noodp" />
Тег должен находиться внутри контейнера <head>…</head> в любом месте. Этот тег использовался в следующих случаях. Если сайт был добавлен в каталог dMoz, то некоторые поисковые системы могли выводить описание сайта, взятое из dMoz. Если это было не нужно, то добавлялся этот тег. С 17 марта 2017 года dMoz больше не работает, поэтому данный мета-тег теперь является устаревшим.
Проверка мета-тегов через сервис Вебмастер Яндекс
Каждый создаваемый сайт нужно добавить в панель Яндекс Вебмастера, где будут в последствие выводиться все рекомендации об устранении найденных проблем сайта.
В панели Яндекс Вебмастера есть пункт «Диагностика сайта». На странице есть пункт под названием «Ознакомиться».
При нажатии на данный пункт, вам будет выведен список ссылок страниц вашего сайта, где отсутствует мета-тег Description.
Чтобы проанализировать мета описания сайтов-конкурентов, то можно использовать известные сервисы, которые можно посмотреть в режиме онлайн.
Вот несколько таких сервисов:
- Серпстат
- Промопульт
- Пиксельплюс
Заполнение тега Descriptions
Как уже упоминалось, основная задача этого тега — сформировать привлекательный для пользователя сниппет, который будет побуждать пользователя зайти именно на нужный сайт.
Этот тег располагается там же, где и остальные мета-теги, в теге <head> и имеет следующий синтаксис:
При заполнении этого тега лучше придерживаться следующих рекомендаций:
- Содержание должно быть лаконичным, но при этом максимально читабельным. Лучше всего выразить основную суть в кратком содержании основной информации страницы, разделив на несколько простых предложений, либо расположить завлекающее пользователя приветствие (это лучше размещать на главной странице сайта или авторского блога).
- Описание в теге должно полностью соответствовать содержимому сайта.
- Нужно добиваться максимальной уникальности описания, иначе сайт не попадет на первые страницы поисковиков.
- Наличие или отсутствие ключей в данном мета-теге мало влияет на содержимое страницы, в отличие от мета-тега title, где они должны быть указаны в обязательном порядке.
- Размещайте самые важные данные ближе к началу или середине описания, поскольку в разных браузерах и поисковиках форма отображения сниппета может отличаться, и в некоторых случаях последние несколько слов обрезаются, таким образом, пользователь может не получить какие-либо важные данные.
Перейдем к описанию правил заполнения тега Keywords.
Alt атрибуты изображения
Атрибут alt изображения добавляется к тегу изображения img для описания его содержимого. Альтернативные атрибуты важны с точки зрения внутренней оптимизации сайта по двум причинам:
- Альтернативный текст показывается посетителям, если какое-либо конкретное изображение не может быть загружено (или если отображение картинок отключено).
- Атрибуты Alt обеспечивают контекст для роботов, потому что поисковые системы не могут «видеть» изображения.
На e-commerce сайтах изображения часто имеют решающее влияние на то, как посетитель взаимодействует со страницей
Поисковики так же прямо заявляют о важности этого тега
Например, Google в своих гайдах для вебмастеров пишет, что помощь поисковым системам в понимании того, что находится на картинках, и как они сочетаются с остальным контентом, помогает соотносить страницу сайта с подходящими поисковыми запросами.
Даже Мюллер писал у себя в Твиттере, что продуманное альтернативное описание изображения необычайно важно, если вы хотите занять высокое место в Google Картинках. Однако не забывайте о релевантности
Не только alt-текст, заголовки и подписи должны соответствовать изображению, но и сама картинка должна размещаться в тематическом контенте
Однако не забывайте о релевантности. Не только alt-текст, заголовки и подписи должны соответствовать изображению, но и сама картинка должна размещаться в тематическом контенте.
Оптимизация alt тега img для изображений
- Сделайте всё возможное, чтобы оптимизировать свои самые важные изображения (картинки товаров, инфографику, инструкции), которые могут получить хорошие позиции в поиске Google Images.
- Добавьте alt-текст на страницах, где не так много другого контента (кроме картинок).
- Делайте тег alt для изображений понятным и достаточно информативным, разумно используйте ключевые слова и убедитесь, что они естественным образом вписываются в содержание страниц.
Определение модели
Информация, содержащаяся в теге
Для того чтобы тег правильно работал на ранжирование страниц в поисковике, нужно учитывать, какая именно информация в него попадет.
Необходимо учитывать, что в разных браузерах информация будет отображаться по-разному, поэтому лучше ограничиться оптимальной длиной содержимого. Данные будут совпадать с основными запросами пользователя, поэтому ключевые слова должны быть указаны основные, а содержание лучше оставить максимально емким, но лаконичным.
Основные составляющие, которые должен содержать мета-тег Title:
- Наименование услуги или товара, который вы предлагаете. Ему желательно располагаться в самом начале.
- Блок, отвечающий за конверсию — это некий призыв для пользователя к действию. Он может содержать такие слова, как «приобрести», «смотреть», «скачать» и тому подобные.
- Расположение — где товар или услуга располагается географически.
- Непосредственно название фирмы или поставщика услуг — его лучше расположить в конце описания.
- В теге не должны использоваться точки, а при необходимости использования такого пунктуационного символа, как тире, лучше заменить его на двоеточие, таким образом можно будет задействовать один лишний полезный знак.
- Чтобы разделить смысловые блоки текста, в рамках мета-тега используют вертикальную черту. Выглядеть это будет примерно таким образом: «Изготовление мебели для дома — это просто и доступно | Мебель своими руками» (в самом теге пишется без кавычек).
- Точка в конце не ставится, однако можно использовать знак восклицания в том случае, если текст логически содержит некий призыв к действию или носит экспрессивную окраску.
Для того чтобы разобраться, какие ключевые слова лучше добавить в тег Title, лучше всего воспользоваться сервисами от Google и Яндекс — Google AdWords и «Подбор слов Яндекс», соответственно.
Очистка списка статических маршрутов
В процессе работы в интернете Windows собирает и хранит список статических маршрутов IP, без которых доступ в локальную сеть и в сам интернет был бы затруднён. Чтобы очистить список маршрутов, запустите командную строку (или её усовершенствованную версию PowerShell) с правами администратора и введите команду route -f.
После удаления старых IP-маршрутов обновлённые пропишутся при повторном заходе на те же сайты
Об успешной очистке приложение «Командная строка» сообщит лишь уведомлением OK, после чего вновь пригласит вас вводить очередные команды (будет показан путь к последней папке, с которой вы работали). Перезапустите Windows и попытайтесь вновь открыть сайт, с которыми возникли проблемы.
Почему тегу Title следует уделить внимание
Так как роботы-поисковики индексируют именно HTML-версию страницы, в том числе ее служебное содержимое, нельзя оставлять без внимания мета-тег Title — грамотное его заполнение поможет попасть в верхние строчки поиска, а также облегчит работу пользователя с сайтом.
Этот мета-тег технически является отдельным тегом, что отличает его от Descriptions и Keywords — он имеет закрывающую и открывающую части, с таким синтаксисом:
Он является видимым для пользователя, и его содержимое отображается на верхней вкладке. Если навести на него курсор мышки, то можно будет увидеть развернутое описание, то есть все, что мы поместили в данный тег. Это очень удобно для пользователя, если в браузере открыто сразу несколько вкладок.
Также именно данный тег будет показан в самой поисковой выдаче в качестве заглавия сайта, поэтому он не должен содержать никаких «мусорных» элементов, мешающих нормальному восприятию.
Управление режимами Internet Explorer
Заключительный мета-тег, который должен присутствовать на Ваших страницах, позволяет в зависимости от указанного значения content сообщить браузеру Internet Explorer как отображать документ (в каком режиме) в зависимости от версии, которая используется в данный момент:
<meta http-equiv = "X-UA-Compatible" content = "IE=edge">
Атрибут content задает режим для страницы, например, чтобы имитировать работу Internet Explorer 7, укажите IE=EmulateIE7. Укажите IE=5, IE=7 или IE=8, чтобы выбрать один из этих режимов совместимости. Также можно задать IE=edge, чтобы использовать в Internet Explorer 8 наивысший доступный режим.
Значение IE=edge сообщает браузеру пользователя, что необходимо использовать последний доступный режим отображения документа, используйте это значение на своих страницах.
Грамотное размещение метаданных на каждой странице Вашего сайта, сделает его привлекательным для поисковых машин и упростит процесс индексации.
Пример использования
<!DOCTYPE html> <html> <head> <meta name = "description" content = "Бесплатные уроки по созданию сайтов" > <!-- мета элемент, который описывает содержимое документа --> <meta name = "keywords" content = "HTML, CSS, JavaScript, jQuery"> <!-- мета элемент, который описывает ключевые слова в документе --> <meta name = "author" content = "Denis Bolshakov"> <!-- мета элемент, который указывает имя автора документа --> <title>Пример использования атрибута content тега <meta></title> </head> <body> <h2> Это заголовок.</h2> <p>Это параграф. </p> </body> </html>
В данном примере мы использовали три элемента <meta>:
- первый мета элемент описывает содержимое документа (значением атрибута name мы указали, что это описание страницы (description), а текстовое содержимое указали в атрибуте content. Это описание могут использовать поисковые машины для отображения результатов поиска.
- второй мета элемент описывает ключевые слова в документе (значением атрибута name мы указали, что это ключевые слова (keywords), а текстовое содержимое указали в атрибуте content. Ключевые слова могут использоваться некотрыми поисковыми машинами.
- третий мета элемент описывает имя автора документа (значением атрибута name мы указали, что это автор документа (author), а имя автора указали в атрибуте content.
<!DOCTYPE html> <html> <head> <meta http-equiv = "refresh" content = "15, URL='http://basicweb.ru'" > <!-- мета элемент, который указывает, что страница будет перезагружена через 15 секунд и перейдет по указанному URL --> <meta http-equiv = "content-security-policy" content = "default-src https:" > <!-- мета элемент, который разрешает загрузку ресурсов (изображения, шрифты, скрипты и так далее) только с использованием https --> <meta http-equiv = "default-style" content = "default style" > <!-- мета элемент, который указывает имя предпочитаемых css стилей документа --> <title>Пример использования атрибута http-equiv тега <meta></title> <link href = "default.css" rel = "stylesheet" type = "text/css" title = "default style"> </head> <body> <h2> Это заголовок.</h2> <p>Это параграф. </p> </body> </html>
В данном примере мы использовали три элемента <meta> для которых были указаны различные значения атрибута http-equiv:
первый мета элемент, указывает, что страница будет перезагружена (значение refresh) через 15 секунд и перейдет по указанному URL (значения, указанные в атрибуте content). Если адрес URL не указан, то страница просто будет перезагружена.
второй мета элемент разрешает загрузку ресурсов (изображения, шрифты, скрипты и так далее) только с использованием https. Это стало доступным благодаря использованию значения content-security-policy, которое позволяет с использованием атрибута content определить правила (политику) для обслуживаемых ресурсов.
третий мета элемент, указывает имя предпочитаемых css стилей документа
Обратите внимание, что значение атрибута content должно совпадать со значением глобального атрибута title HTML тега .
HTML тег <meta>
Поиск самого ближнего сервера
Самый простой способ уменьшить пинг — подключиться к самому ближнему серверу. Для этого необходимо:
- Перед запуском поиска игры мы пишем в такую команду — mm_dedicated_search_maxping 50. Это позволит отбирать нам сервера к которым пинг не выше, чем 50;
- Также прописываем cl_updaterate 60 чтобы мы получили обработку данных именно в такой частоте;
- Выставляем правильный rate в зависимости от скорости вашего подключения:
ПОЛЕЗНЫЕ СТАТЬИ: Не запускается КС ГО (исправляем), Лагает кс го (инструкция по исправлению)