Meta теги: Мета-теги для сайта — что такое мета теги, какие бывают, для чего прописывать ключевые слова в мета-теги

Содержание

Атрибут http-equiv | htmlbook.ru

Internet ExplorerChromeOperaSafariFirefoxAndroidiOS
3.0+1.0+4.0+1.0+1.0+1.0+1.0+

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

HTML:3.24.015.0XHTML:1.01.1

Описание

Браузеры преобразовывают значение атрибута http-equiv, заданное с помощью content, в формат заголовка ответа HTTP и обрабатывают их, как будто они прибыли непосредственно от сервера.

Синтаксис

HTML
<meta http-equiv="...">
XHTML
<meta http-equiv="..." />

Значения

Любой подходящий идентификатор. Ниже приведены некоторые допустимые значения атрибута http-equiv.

Content-Type
Тип кодировки документа.
expires
Устанавливает дату и время, после которой информация в документе будет считаться устаревшей.
pragma
Способ кэширования документа.
refresh
Загрузить другой документ в текущее окно браузера.

Значение по умолчанию

Нет.

Пример

HTML 4.01IECrOpSaFx

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   <title>Тег META, атрибут http-equiv</title>
   <meta http-equiv="expires" content="Sun, 01 Jan 2013 07:01:00 GMT">
  </head> 
  <body>
    <p>...</p>
  </body>
</html>

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

3 способа работы с мета-тегами

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

  1. На основе правила вы настраиваете теги, которые применяются для всех посадочных страниц. Эти теги можно использовать как основу для редактирования на следующих уровнях. Здесь нет возможности работать со свойствами, доступны только поля раздела, родительского раздела, инфоблока и функции.
  2. На основе условия
    теги настраиваются для всех посадочных страниц.
  3. Теги настраиваются для конкретной посадочной страницы.

На основе правила

Заполнять теги на уровне правила необязательно. Чаще всего это делают, чтобы на уровне шаблона задавать условия для посадочных страниц.

Для примера задаем:

  1. Title.
  2. Заголовок страницы.
  3. Верхнее описание.

Сохраняем изменения. Проверяем, как изменились теги в публичной части сайта.

На основе условия


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

Заполненные теги наследуются из заполненных тегов на уровне правила. 

Также заданы:

  1. Title.
  2. Заголовок страницы.
  3. Верхнее описание.

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

Сохраняем изменения. Проверяем, как изменились теги в публичной части сайта.

На уровне посадочной страницы

На уровне правила и условия мы уже задали шаблоны мета-тегов. В редактировании посадочной страницы мы можем скорректировать теги так, как нужно в этом случае. Для этого перейдите на вкладку «ЧПУ», затем в редактирование посадочной страницы.

Заполненные теги наследуются из заполненных тегов на уровне условия. Если условие не задано, то — из тегов правила. 

Также заданы:

  1. Title.
  2. Заголовок страницы.
  3. Верхнее описание.

Изменим мета-теги на уровне посадочной страницы. Добавим к шаблону словосочетание «на весну».

Сохраняем изменения. Проверяем, как изменились теги в публичной части сайта.

Обратите внимание, что можно вносить изменения даже в хлебные крошки. 


Результат в публичной части сайта.


Как добавить мета-тег, скрипт или иной код на сайт?

Добавление мета-тегов требуется в случаях, когда какой-либо ресурс требует подтвердить право владения доменом (верифицировать домен). В большинстве своем мета-теги нужны для подключения корпоративной почты на домене или регистрации в сервисах вроде Яндекс.Вебмастера или Google Search Console.

HTML-страница состоит из двух базовых разделов, идущих в коде друг за другом: <head> и <body>. В разделе <head> размещается основная информация о самой странице, а в разделе <body> – непосредственно контент (то, что мы видим в окне браузера).


Мета-теги вставляются в раздел <head>. Для редактирования данного раздела нужен доступ к HTML-редактору, который доступен на тарифах «Стандартный» и выше.

Заходим в редактор и открываем папку «Сниппеты», находим в этой папке сниппет head:

 

Внутри сниппета мы увидим код нужной нам секции <head>. Ставим курсор в самый конец документа, задаем новую пустую строку клавишей Enter и вставляем наш код в это место, а в конце сохраняем изменения:

 

Поскольку сниппет head является необязательным, в старых или сторонних шаблонах он может отсутствовать. В этом случае необходимо искать секцию <head> в файле layouts.layout.liquid и делать изменения там. Если Вы не владеете языком HTML в достаточной степени и не уверены в своих силах, можете просто прислать в техническую поддержку мета-тег, и мы поможем Вам его разместить.


Помимо мета-тегов, иногда возникает потребность разместить на своем сайте

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

Сперва необходимо скопировать JavaScript-код, который предоставляется создателем виджета. Затем открываем в бэк-офисе раздел «Настройки => Счетчики и коды», нам нужно поле «javascript-код для вывода на всех страницах магазина»:

Содержимое, фигурирующее здесь, появляется в итоговом HTML-коде страницы непосредственно перед закрывающим тегом </body>.

Размещаем нужный JavaScript-код. Если в поле уже имеется какой-либо код, можно в самом конце сделать пару пустых строк и вставить новое содержимое:

Сохраняем изменения, заходим на сайт и проверяем работоспособность вставленного скрипта.

их важность для SEO, примеры и рекомендации

Что такое мета-теги?

 

Знаете ли вы другие мета-теги, помимо title и description? Небольшой список тегов поделенных на три категории (плохие, хорошие и нейтральные) поможет вам обновить свои знания и расставить приоритеты при оптимизации страниц.. Более того, прочитав эту статью до конца, вы поймете, что количество плохих тегов значительно превышает все остальные. Тем не менее, это не исчерпывающий список. Если нужно больше, вы всегда можете найти дополнительные данные с помощью этого источника – https://www.metatags.org/all_metatags.

 

Плохие

 

    Нельзя сказать, что эти теги плохо влияют на ваш сайт, но это всего лишь пустая трата вашего времени и лишний код на сайте.
  • Тег автора – указывает, кто является автором страницы.
  • Тег генератора – используется для обозначения программы, которая сгенерировала вашу страницу.
  • Тег типа ресурса – указывает тип ресурса, на котором находится ваша страница.
  • Тег повторения – указывает поисковым роботам, что им нужно вернуться на страницу еще раз через некоторое время, но большинство известных поисковых систем его не поддерживают.
  • Тег рейтинга – помогает добавить ограничения по возрасту для вашего контента, но лучший способ справиться со взрослыми изображениями заключается в размещении их в изолированном каталоге, который находится вдали от обычных изображений, используемых на сайте, и уведомляет о них Google.
  • Тег распределения – используется, когда нужно изменить доступность документа; в большинстве случаев он имеет «общий» режим по умолчанию, поэтому, если ваша страница открыта, значит, она открыта для всех.
  • Тег резюме – используется, если следует добавить только резюме текста.
  • Теги даты / истечения срока действия – дата указывает на точный день создания страницы, а срок её действия – когда он истекает. Гораздо полезнее удалять страницы, когда срок их действия истекает самому, и постоянно обновлять XML-карту сайта.
  • Тег копирайта – если у вас он уже есть в разделе нижнего колонтитула, зачем его использовать еще раз?
  • Тег управления кэшем – помогает контролировать период кеширования страницы в браузере, но более предпочтительно делать это в HTTP заголовке.

 

Хорошие

 

    «Хорошие» мета-теги должны использоваться на каждой странице. Конечно, это не полный их список, но вы должны применять хотя-бы следующие теги:
  • Мета-тег Title – это очень важный элемент любой SEO оптимизации, поскольку он размещается в секции header и содержит самые важные данные. Самое важное правило, которого следует придерживаться, это создание уникальных заголовков для каждой отдельной страницы.
  • Мета тег description – этот мета-элемент служит описанием страницы для различных поисковых запросов. Хотя он не влияет на ранжирование сайта в поисковой выдачи напрямую, но по-прежнему остается очень важным, поскольку помогает привлечь пользователей на ваш сайт.
  • Тег типа контента (content type) – должен использоваться на каждой странице, так как он показывает тип набор символов страницы (кодировку), и его упущение может повлиять на отображение страницы браузером. Ниже приведено несколько вариантов, но опытный разработчик может самостоятельно выбрать лучший вариант для сайта.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

  • Область просмотра (Viewport) – в нашу техническую эпоху это очень важный элемент, если вы хотите, чтобы ваш сайт имел хороший мобильный интерфейс. Вы можете использовать такую программу, как Google PageSpeed Insights Tool, чтобы получить более подробную информацию. В противном случае, стандартный тег выглядит так:

<meta name=viewport content="width=device-width, initial-scale=1">

 

Нейтральные

 

    Эти теги не обязательно задействовать, и лучше избегать их использования, если не предвидится особых случаев, когда этого нельзя избежать.
  • Социальные мета-теги – информация из Twitter и OpenGraph в большинстве случаев имеет ключевое значение, но не является обязательной.
  • Тег языка – задействуйте его, если нужно указать определенный язык, который используется на странице.
  • Тег для специальных ботов – служит для предоставления инструкций особым ботам, таким как noodp (говоря им, что данные списков DMOZ запрещены к использованию) и noydir (довольно похожий, но здесь предоставляются данные Yahoo).
  • Тег Robots – некоторые специалисты уверены, что это обязательный мета-тег. Что касается индексации страниц, если вы не добавляете мета-тег роботс, поисковые системы будут считать, что страницу нужно индексировать. Но когда вы хотите запретить индексацию ссылок на странице, то нужно использовать этот элемент с параметром noindex.

<meta name="robots" content="noindex" />

  • Тег обновления – это вариант редиректа, которого следует избегать в большинстве ситуаций. Лучший вариант – это старая переадресация с помощью 301 редиректа, даже если нужно предпринять меры как можно скорее.
  • Ключевые слова – согласно многим SEO стратегиям, его не рекомендуется использовать, потому что вероятность хоть какого-то прока от него очень низкая. Таким образом, если он был автоматически использован при создании сайта, то оставьте его, но, если это не так, лучше не добавляйте.
  • GEO тег – обрабатывается только при помощи поисковой системы Bing. Более того, он делится на три типа: регион, положение и топоним.

<META NAME="geo.position" CONTENT="latitude; longitude">
<META NAME="geo.region" CONTENT="Country Subdivision Code">
<META NAME="geo.placename" CONTENT="Place Name">

  • Тег проверки сайта – иногда его необходимо использовать для авторизации сайта в Google. Вы также можете использовать внешний файл, DNS или просто ссылку на свой профиль Google Analytics. А если речь идет о Bing, то мета-тег и проверка файла XML возможны, но XML-код всегда предпочтительнее.
Nataliya Fialkovskaya

SEO specialist

Nataliya is SEO expert at Sitechecker. She is responsible for blog. Can’t live without creating valuable content about SEO and Digital Marketing.

Мета теги html — куда вставлять?

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

Куда вставлять мета-теги в HTML

Подобно другим мета-тегам, они должны располагаться внутри тега :

Теперь разберемся с основными используемыми мета-тегами html для поисковых роботов.

1. Description – в него входит описание страницы. То есть в этом мета-теге должна быть кратко сформулирована информация, расположенная на странице. Многие не видят важность этого элемента, однако он существенно влияет на поисковую выдачу, а потому каждая страница должна иметь мета-тег Description;

2. Keywords – мета-тег, состоящий из ключевых слов для страницы. Может содержать группу различных слов, чаще всего встречающихся на странице. Подобно дескрипшн данный тег должен отображаться на каждой странице;

3. Robots – данный тег чаще всего применяется тогда, когда необходимо запретить индексацию страницы поисковиками или запретить поисковым роботам переходить по ссылкам. Зачастую это бывает весьма полезно.

Ниже приведен пример, как используются мета теги HTML для поисковых роботов:

Стоит отметить, что мета-тег Robots может иметь несколько значений, нижде даны наиболее важные:

1. index,follow – то есть необходимо произвести индексацию страницы и осуществить переход по всем ссылкам, размещенным на ней. Если тег не указан, робот поисковой машины ориентируется на данное значение.

2. noindex,follow – данное значение информирует поисковик о том, что странице не нужна индексация, но по ссылкам здесь необходимо пройтись.

3. index,nofollowнеобходимо проиндексировать страницу без перехода по ссылкам, размещенным на ней.

4. noindex,nofollow или none – поисковому роботу не нужно индексировать и осуществлять переход по ссылкам.

SEO. Зачем нужны meta-теги? | Onfor

Мир SEO — мир контрастов и неоднозначностей. О пользе и вреде от использования meta-тегов в общем и отдельных из них ведется очень много споров. Сегодня попытаюсь своими словами рассказать мое виденье основных meta-тегов — их назначение, смысл и суть.

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

Ниже разберем основные и наиболее часто встречающиеся теги.

Description

<meta name=»description» content=»Короткое описание контента страницы»/>

<meta name=»description» content=»Короткое описание контента страницы»/>

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

Этот тег отвечает за информацию о странице, которую видит пользователь в выдаче.

Robots

<meta name=»robots» content=»noindex, nofollow» />

<meta name=»robots» content=»noindex, nofollow» />

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

Title

<title>Заголовок страницы</title>

<title>Заголовок страницы</title>

Данный тег формально не является meta — но так сложилось исторически, что он ассоциируется именно с этой группой тегов.
Думаю тут понятно, что именно этот тег отвечает за то, какой заголовок будет у окна (вкладки) с Вашим сайтом — поэтому очень важно следить за правильностью его указания.

Content-Type

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

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

Данный тег используется для указания типа данных на странице (текст, json, xml и т.д.) и кодировки этого содержимого. На уровень ранжирования не влияет — но указывает браузеру, в какой кодировке отображать страницу.
На данный момент более удобно использовать указание кодировки в следующем виде:

Keywords

<meta name=»keywords» content=»мета теги,поисковая оптимизация» />

<meta name=»keywords» content=»мета теги,поисковая оптимизация» />

Ключевые слова для Вашей страницы. Невероятно полезен и аналогично безсмысленен сейчас. Насколько мне известно — ни один из популярныхх поисковых ресурсов не использует его при формировании списков выдачи.

Content-language

<meta http-equiv=»content-language» content=»ua» />

<meta http-equiv=»content-language» content=»ua» />

Указание языка страницы. Информация полезна для различных обработчиков страниц и самого браузера.
Более удобным и современным вариантом является указание параметра lang для определенного тега, например div, p и т.д. К примеру, для указания языка для всей страницы следует указать следующий код:

Refresh

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

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

Использование тега refresh вместе с параметром content позволяет проводить обновление или перенаправление пользователя. При указании content равным 0 — действие произойдет немедленно.
Пример для переадресации пользователя:.

<meta http-equiv=»refresh» content=»30;URL=’http://onfor.info'»>

<meta http-equiv=»refresh» content=»30;URL=’http://onfor.info'»>

Подбивая итог отмечу всего несколько тегов, использование которых могу рекомендовать — это description, keywords, title, robots.

4 «кита», использование которых и полезно, и является правилом хорошего тона одновременно.

Похожие записи


Важные мета-теги для социальных сетей

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

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

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

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

Twitter также предлагает несколько способов форматирования веб-страниц, но сегодня мы рассмотрим пример, схожий с приведенным выше примером для Facebook. Такой формат в Twitter называется «Summary Card with Large Image»:

В каждом примере имеется несколько атрибутов:

  • Большая картинка и заголовок;
  • Описание;
  • Домен.

Каким образом разместить эти атрибуты? Например, при помощи мета тегов для HTML сайта. При публикации ссылки на ресурс Facebook и Twitter извлекают связанную веб-страницу и считывают ее meta-теги, что позволяет отображать соответствующую информацию.

Facebook использует meta-теги, используя протокол Open Graph. Это система классификации веб-страниц, которая на данный момент охватывает meta-теги, определенные в HTML5. Полный список доступных тегов можно просмотреть на сайте Open Graph. Но в работе пригодится всего четыре тега:

<meta property="og:title" content="European Travel Destinations">
<meta property="og:description" content="Offering tour packages for individuals or groups.">
<meta property="og:image" content="http://euro-travel-example.com/thumbnail.jpg">
<meta property="og:url" content="http://euro-travel-example.com/index.htm">

Как Facebook, так и Twitter дают рекомендации относительно использования упомянутых выше тегов. Учтите, что Facebook ссылается на публикуемую веб-страницу при помощи термина «объект» (object):

FacebookTwitter
Title (Заголовок).Заголовок или название объекта.Продуманный заголовок для связанного контента (максимально 70 символов).
Description (Описание).Краткое описание или содержание объекта (2-4 предложения).Описание, которое несет в себе всю необходимую информацию. Не следует использовать одинаковые заголовки и описания для нескольких страниц (длина до 200 символов).
Image (Картинка).URL картинки объекта. Картинка должна быть как минимум 600 на 315 пикселей в размере, но лучше использовать 1200 на 630 и выше (объемом до 5Мб). Что касается соотношения сторон, то старайтесь укладываться в 1.91:1, чтобы избежать обрезкиСсылка на картинку, прикрепленную к контенту. Не следует использовать случайные картинки типа логотипа сайта, фотографию автора или другие картинки, которые встречаются на других ресурсах. Картинка должна иметь минимум 280 пикселей в ширину и 150 – в высоту. Вес картинки не должен превышать 1 Мб.
URLКанонический URL страницы. Ссылка должна быть прямой, без дополнительных параметров, переменных, данных идентификации пользователей и т. д.

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

<meta property="og:title" content="European Travel Destinations">
<meta property="og:description" content="Offering tour packages for individuals or groups.">
<meta property="og:image" content="http://euro-travel-example.com/thumbnail.jpg">
<meta property="og:url" content="http://euro-travel-example.com/index.htm">
<meta name="twitter:card" content="summary_large_image">

Универсальные рекомендации для использования картинок: старайтесь, чтобы размер картинок был не менее 1200 на 630 пикселей при соотношении сторон 1.91:1, но при этом не забывайте про ограничение Twitter в 1Мб.

Если у вас возникли сомнения относительно комбинирования мета тега description для сайта c другими тегами, то всегда можно воспользоваться специальными инструментами Facebook Sharing Debugger и Twitter Card Validator. Оба средства умеют извлекать любые веб-страницы с публичных серверов, используя релевантные мета-теги, и демонстрировать вам, как они будут смотреться при распространении в социальных сетях. Кроме этого они выводят список ошибок и дают советы. Как мы поступим с нашим примером? С Twitter, кажется, проблем не возникло, а вот проверка Facebook выдала предупреждение:

И это дает нам отличную тему для разговора.

Этой ошибкой Facebook указывает, что, если вы собираетесь использовать их аналитический инструмент Domain Insights, то нужно будет предоставить уникальный ID, привязанный к вашему аккаунту. Мета-тег должен выглядеть следующим образом:

<meta property="fb:app_id" content="your_app_id" />

У Twitter имеется нечто похожее — Twitter Card Analytics. Twitter рекомендует использовать следующий мета-тега, который должен содержать ваш логин в Twitter, привязанный к публикуемой веб-странице:

<meta name="twitter:site" content="@website-username">

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

В документации Facebook есть еще одна рекомендация о дополнительном мета-теге. Он отвечает за название сайта:

<meta name="og:site_name" content="European Travel, Inc.">

Twitter рекомендует использовать другой мета-тег, но он также не обязателен:

<meta name="twitter:image:alt" content="Alt text for image">

Он позволяет указывать альтернативное описание картинки для людей с плохим зрением.

И на этом, пожалуй, все. Стоит отметить, что в документации Facebook и Twitter есть множество других мета тегов для HTML сайта, которые можно использовать для распространения контента другого типа. Но я считаю, что приведенного ниже кода будет вполне достаточно:

<!--  Essential META Tags -->

<meta property="og:title" content="European Travel Destinations">
<meta property="og:description" content="Offering tour packages for individuals or groups.">
<meta property="og:image" content="http://euro-travel-example.com/thumbnail.jpg">
<meta property="og:url" content="http://euro-travel-example.com/index.htm">
<meta name="twitter:card" content="summary_large_image">

<!--  Non-Essential, But Recommended -->

<meta name="og:site_name" content="European Travel, Inc.">
<meta name="twitter:image:alt" content="Alt text for image">

<!--  Non-Essential, But Required for Analytics -->

<meta property="fb:app_id" content="your_app_id" />
<meta name="twitter:site" content="@website-username">

Пожалуйста, оставляйте свои отзывы по текущей теме материала. За комментарии, дизлайки, лайки, подписки, отклики огромное вам спасибо!

Данная публикация является переводом статьи «The Essential Meta Tags for Social Media» , подготовленная редакцией проекта.

мета-тегов в SEO: полное руководство

Мета-теги вкратце

Мета-теги — это элементы в вашем HTML-коде, которые не видны пользователю, но играют решающую роль в эффективности вашего SEO и пользовательском опыте, который вы предоставляете.

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

Узнайте о наиболее важных мета-тегах для SEO: мета-заголовок, мета-описание, мета-роботы и другие теги, которые обычно ошибочно принимают за метатеги!

Что такое метатеги HTML?

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

Мета-теги не отображаются на странице; они включены только в исходный код страницы.

Давайте посмотрим на пример:

  • Весь фрагмент кода называется «метаэлементом».
  • Часть является фактическим тегом.
  • Есть атрибут с именем name со значением description .
  • И есть атрибут под названием content со значением Это описание страницы .

Метатег заголовка — это элемент HTML, который сообщает браузерам и поисковым системам, что такое заголовок данной страницы. Заголовок отображается как первый интерактивный элемент во фрагменте страницы на странице результатов поисковой системы (SERP) и передает основную тему, которую пользователи найдут на странице.

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

Чтобы тег заголовка был настоящим метатегом, его синтаксис должен быть .

Вместо этого это просто Вот название .

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

Давайте посмотрим, как будет выглядеть мета-заголовок нашей специальной статьи в поисковой выдаче Google:

Вот как вы можете увидеть это в исходном коде нашей страницы, в разделе HTML-документа:

Тег заголовка: полное справочное руководство, которое заставит его работать на вас

Поскольку Google, Bing, Yahoo, DuckDuckGo и другие поисковые системы различаются своими точными требованиями к длине тега заголовка, хорошее практическое правило:

  • Максимальный размер 575 пикселей, что составляет около 60 символов.
  • Минимальный размер 285 пикселей, около 30 символов.

Есть ли у вашего сайта проблемы с тегом заголовка?

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

Что вы должны включить в мета-тег заголовка

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

Использование фирменных наименований и разделителей

Если у вас сильный бренд, включение вашего бренда в заголовок увеличит CTR. Вот почему многие компании включают его.

Заголовок часто отделяется от бренда отличительным знаком. Это может быть тире (), трубка ( | ) или другие разделители, которые вы предпочитаете.

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

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

Но, в конце концов, это действительно зависит от ваших эстетических предпочтений.

Подобно мета-заголовку, мета-описание является важным элементом фрагмента вашей страницы, который люди видят в результатах поиска.Хотя его значимость для SEO относительно ниже — в основном потому, что Google не рассматривает ключевые слова в метаописании как фактор ранжирования (открывается в новой вкладке), — плохое описание может помешать пользователям решить, нажимать ли на вашу ссылку. , что означает, что это может снизить ваш CTR.

Метаописание должно быть удобочитаемым и уникальным, а главное, оно должно резюмировать содержание страницы. Он должен содержать 70–155 символов (430–920 пикселей) и включать релевантные ключевые слова.Google выделит их жирным шрифтом в вашем фрагменте, и это снизит вероятность того, что поисковая система переписывает описание вашей страницы.

Например, мета-описание для нашей страницы обзора Академии:

    

Когда Google переписывает метаописания?

Google иногда игнорирует ваши метаописания и генерирует свои собственные.

На видеовстрече в Центре веб-мастеров (открывается в новой вкладке) Джон Мюллер из Google назвал три причины, по которым Google может изменить ваше метаописание.

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

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

Мета-теги роботов — это теги, которые сообщают поисковым системам такие вещи, как необходимость перехода по ссылкам и индексации страниц.

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

Метатег robots можно найти в исходном HTML-коде страницы, и он содержит определенные директивы, определяющие их назначение. Это может выглядеть так:

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

Существуют различные примеры директив мета-тегов роботов, такие как noarchive , nosnippet и notranslate , которые позволяют отправлять определенные поисковым системам сигналы для изменения их поведения на вашей странице.

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

Затраты на продажи за проблемы с метатегами?

Отслеживайте свой веб-сайт на предмет мошеннических метатегов noindex, чтобы случайно не подать сигнал Google об удалении ваших денежных страниц из их индекса!

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

Этот элемент также может использоваться как своего рода перенаправление, сообщающее браузеру о перенаправлении на другой URL-адрес по истечении определенного периода времени: в приведенном ниже примере выполняется перенаправление на https://www.example.com через 5 секунд:

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

Метатеги Open Graph и Twitter Card

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

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

Настройка Open Graph для Facebook и LinkedIn

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

Например, так выглядит наша статья в Академии об Open Graph на Facebook:

А вот как это выглядит в исходном коде страницы:

  






  

Один раз вы настроили свойства Open Graph и опубликовали веб-сайт, вы можете протестировать его функциональность в отладчике Facebook (открывается в новой вкладке) и LinkedIn Inspector (открывается в новой вкладке).

Настройте свои карты Twitter

Очень похожий процесс применяется для Twitter, где вы можете установить те же свойства, что и для Open Graph. Единственное отличие состоит в том, что эта социальная платформа имеет разметку, определенную для ее собственного имени twitter . Так выглядит наша статья в Twitter Cards в Twitter:

А вот как это выглядит в исходном коде:

  




  

После того, как вы определили свойства своей карты Twitter и опубликовали страницу, вы можете проверить ее работоспособность в Twitter Card Validator (открывается в новой вкладке).

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

Их фрагмент кода HTML выглядит так:

Однако эта практика стала настолько популярной, что больше не имела никакого значения. Вот почему Google, Bing и другие вообще перестали придавать им значение. Единственная поисковая система с приличной полезностью, которая по-прежнему дает кредит мета-ключевым словам, — это Яндекс (открывается в новой вкладке).

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

Оптимизированные мета-теги = больше органического трафика

Контролируйте и отслеживайте метатеги вашего сайта с помощью ContentKing для улучшения видимости и увеличения количества переходов на ваш сайт.

Помимо основных мета-тегов, таких как мета-заголовок, мета-описание и мета-роботы, существует множество второстепенных мета-тегов, которые помогают вам сигнализировать Google и браузерам, как им следует вести себя на вашем сайте.Давайте посмотрим на некоторые из них:

Кодовый метатег

Тег meta charset указывает браузеру кодировку символов для документа HTML. Два наиболее распространенных значения:

.
  • UTF-8 — Кодировка символов для Unicode.
  • ISO-8859-1 — Кодировка символов латинского алфавита.

Когда используется кодировка UTF-8 , вы увидите это в HTML:

Метатег области просмотра

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

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

Например, в приведенном ниже примере метатег области просмотра сигнализирует о том, что экран должен отображаться на всю ширину устройства с уровнем масштабирования 100%:

Метатег языка

Как следует из названия этого элемента, языковой тег определяет язык содержания страницы.Этот метатег используется Bing и Baidu, а для Google лучше использовать атрибут hreflang.

Пример:

Мета-тег для взрослых

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

Пример:

Другие теги, которые часто принимают за метатеги

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

Следующие теги часто называются метатегами , но на самом деле все они являются атрибутами связи ссылок . Вместо того, чтобы иметь тег в элементе HTML, все они являются частью тега .

Вывод

Мета-теги — это мощные HTML-элементы, которые могут значительно улучшить ваш успех в SEO.Некоторые теги помогают настроить внешний вид вашего контента на странице результатов поиска или в социальных сетях, в то время как другие позволяют контролировать поведение браузеров и поисковых роботов на вашем веб-сайте. Правильная настройка метатегов может помочь вам повысить рейтинг и CTR, а также взять под контроль бюджет сканирования.

Однако возникла путаница в отношении того, что считается метатегом, а что нет. Например, такие элементы, как тег заголовка, canonical и hreflang, часто неправильно называются метатегами сообществом SEO.

kpumuk / meta-tag: поисковая оптимизация (SEO) для приложений Ruby on Rails.

Плагин поисковой оптимизации (SEO) для приложений Ruby on Rails.

Рубин на рельсах

Основная ветка MetaTags полностью поддерживает Ruby on Rails 5.1+ и протестирована на всех основные выпуски Rails до 6.1.

Версии Ruby старше 2.5 больше не поддерживаются официально.

Обратите внимание, , что мы больше не поддерживаем версии Ruby старше 2.4.0 и Ruby on Rails старше 5.1, потому что они достигли конца своего жизненного цикла.

Установка

Добавьте гем «мета-теги» в свой Gemfile .

И запустите команду bundle install .

Конфигурация

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

Чтобы изменить настройки по умолчанию, создайте инициализатор. config / initializers / meta_tags.rb , используя следующую команду:

Рельсы
 генерируют мета_теги: установить 

По умолчанию метатеги отображаются с ключом , именем . Поскольку некоторые метатеги вместо этого требуется использовать свойство (например, объект Facebook Open Graph), гем MetaTags позволяет настроить, какие теги отображать с помощью свойства , атрибута . По умолчанию предварительно настроенный список включает все возможные типы объектов Facebook Open Graph, но вы можете добавить свой собственный, если он вам нужен.

Использование метатегов

Сначала добавьте этот код в основной макет:

 
  <% = display_meta_tags site: 'Мой веб-сайт'%>
 

Затем, чтобы задать заголовок страницы, добавьте это к каждому из ваших представлений (другие параметры см. Ниже):

  

<% = title 'Заголовок моей страницы'%>

При визуализации просмотров заголовок страницы будет помещен в нужные места:

 
   Мой сайт | Заголовок моей страницы 


   

Заголовок моей страницы

Вы можете найти допустимые параметры для метода display_meta_tags ниже.

Использование метатегов в контроллере

Вы можете определить следующие переменные экземпляра:

 @page_title = 'Вход для участников'
@page_description = 'Страница входа в систему.'
@page_keywords = 'Сайт, Логин, Участники' 

Также вы можете использовать метод set_meta_tags для одновременного определения всех метатегов:

 set_meta_tags title: 'Вход для участников',
              description: 'Страница входа в систему.',
              ключевые слова: 'Сайт, Логин, Пользователи' 

Вы можете найти допустимые параметры для метода set_meta_tags ниже.

Использование метатегов в представлении

Для установки метатегов вы можете использовать следующие методы:

 <% title 'Вход для участников'%>
<% description 'Страница входа в систему.' %>
<% keywords 'Сайт, Логин, Участники'%>
<% nofollow%>
<% noindex%>
<% обновления 3%> 

Также существует метод set_meta_tags :

 <% set_meta_tags title: 'Вход для участников',
                 description: 'Страница входа в систему.',
                 ключевые слова: 'Сайт, Логин, Участники'%> 

Вы можете передать объект, который реализует метод #to_meta_tags и возвращает Hash:

 класс Document 

Метод title возвращает сам заголовок, поэтому вы можете использовать его для отображения заголовка где-то на странице:

  

<% = title 'Вход для участников'%>

Если вы хотите установить заголовок и отобразить другой текст, используйте это:

  

<% = title 'Вход для участников', 'Здесь вы можете войти на сайт:'%>

Допустимые параметры для

display_meta_tags и set_meta_tags методы

Используйте эти параметры для настройки формата заголовка:

Опция Описание
: площадка название сайта
: титул заголовок страницы
: описание описание страницы
: ключевые слова Ключевые слова страницы
: кодировка набор символов страницы
: префикс текст между названием сайта и разделителем
: разделитель текст, используемый для отделения названия веб-сайта от заголовка страницы
: суффикс текст между разделителем и заголовком страницы
: строчные при истине имя страницы будет в нижнем регистре
: назад при значении true имена страниц и сайтов будут перевернуты.
: noindex добавить метатег noindex; если true, будут использоваться «роботы»; принимает строку с именем робота или массив строк
: индекс добавить метатег индекса; если истина, будут использоваться «роботы»; принимает строку с именем робота или массив строк
: nofollow добавить метатег nofollow; если true, будут использоваться «роботы»; принимает строку с именем робота или массив строк
: следовать добавить метатег Follow; если true, будут использоваться «роботы»; принимает строку с именем робота или массив строк
: нет архива добавить метатег noarchive; если истина, будут использоваться «роботы»; принимает строку с именем робота или массив строк
: канонический добавить тег канонической ссылки
: предыдущая добавить тег предыдущей ссылки
: вперед добавить тег следующей ссылки
: image_src добавить тег ссылки image_src
: og добавить теги Open Graph (хэш)
: твиттер добавить теги Twitter (хэш)
: обновить интервал обновления и необязательно URL для перенаправления на

А вот несколько примеров, которые могут дать вам представление.

 <% = display_meta_tags separator: "& mdash;". Html_safe%>
<% = display_meta_tags prefix: false, separator: ":"%>
<% = display_meta_tags в нижнем регистре: true%>
<% = display_meta_tags reverse: true, prefix: false%>
<% = display_meta_tags og: {title: 'The Rock', type: 'video.movie'}%>
<% = display_meta_tags alternate: {'zh-Hant' => 'http://example.com.tw/base/url'}%> 

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

Вы можете указать : title как строку или массив:

 set_meta_tags title: ['part1', 'part2'], site: 'site'
# сайт | часть1 | часть 2
set_meta_tags title: ['part1', 'part2'], reverse: true, site: 'site'
# part2 | часть1 | сайт 

Ключевые слова могут передаваться как строка значений, разделенных запятыми, или как массив:

 ключевых слов set_meta_tags: ['tag1', 'tag2']
# tag1, tag2 

Описание - это строка (HTML будет удален из выходной строки).

Зеркальные значения

Иногда желательно отразить значения метатегов в пространствах имен. А общий вариант использования - это когда вы хотите, чтобы og: title открытого графика были идентичны название .

Допустим, у вас в макете приложения следующее:

 display_meta_tags og: {
  название:: название,
  site_name:: site,
} 

Значение og [: title] является символом и, следовательно, ссылается на значение метатег верхнего уровня title .Со следующим в любом обзоре:

Вы получаете этот метатег открытого графика бесплатно:

   

Обратите внимание, что в заголовке не указан сайт. Если вам нужно указать точный значение, отображаемое в метатеге </code>, используйте <code>: full_title </code>.</p><h4><span class="ez-toc-section" id="_Turbolinks"> Использование с Turbolinks </span></h4><p> Turbolinks - простое решение для получения преимущества производительности одностраничного приложения без дополнительной сложности клиентская среда JavaScript.MetaTags поддерживает Turbolinks из коробки, нет конфигурация необходима.</p><h4><span class="ez-toc-section" id="_pjax"> Использование с pjax </span></h4><p> jQuery.pjax - хорошее решение для навигации без полной перезагрузки страницы. Основное отличие состоит в том, что файл макета не будет отображаться, поэтому заголовок страницы не изменится. Чтобы исправить это, при использовании фрагмента страницы pjax проверит элемент DOM фрагмента для атрибута <code> title </code> или <code> data-title </code> и использовать любое найденное значение.</p><p> MetaTags упрощает это с помощью метода <code> display_title </code>, который возвращает полностью разрешенный заголовок страницы (включая сайт, префикс / суффикс и т. д.) Но в этом случае вам придется установите параметры по умолчанию (например, <code>: сайт </code>) как в файле макета, так и в ваших представлениях. Чтобы свести к минимуму дублирование кода, вы можете определить помощника в <code> application_helper.rb </code>:</p><pre> def default_meta_tags { title: 'Вход для участников', description: 'Страница входа в систему.', ключевые слова: "Сайт, Логин, Участники", разделитель: "& mdash;". html_safe, } конец </pre><p> Затем в вашем файле макета используйте:</p><pre> <% = display_meta_tags (default_meta_tags)%> </pre><p> И в ваших шаблонах pjax:</p><pre> <! - задайте здесь заголовок, чтобы мы могли использовать его как в «display_title», так и в «title» -> <% title "Заголовок моей страницы"%> <% = content_tag: div, data: {title: display_title (default_meta_tags)} do%> <h2> </h2><% = title%> </h2> <! - HTML идет сюда -> <% конец%> </pre><h3><span class="ez-toc-section" id="_SEO-2"> Основы SEO и метатеги </span></h3><h4><span class="ez-toc-section" id="i-34"> Заголовки </span></h4><p> Заголовки страниц очень важны для поисковых систем.Заголовки в обозревателя отображаются в строке заголовка. Поисковые системы смотрят на строка заголовка, чтобы определить, о чем страница.</p><pre> set_meta_tags title: «Вход для участников» # <title> Вход для участников set_meta_tags site: 'Заголовок сайта', заголовок: 'Вход для участников' # Заголовок сайта | Вход для членов set_meta_tags site: 'Заголовок сайта', заголовок: 'Вход для участников', обратное: true # Вход для участников | Заголовок сайта

Рекомендуемая длина тега заголовка: до 70 символов , 10 слов .

Дополнительная литература:

Описание

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

 set_meta_tags description: "Весь текст о ключевых словах, других ключевых словах"
#  

Рекомендуемая длина тега описания: до 300 символов .

Дополнительная литература:

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

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

 set_meta_tags keywords:% w [keyword1 Keyword2 KeyWord3]
#  

Рекомендуемая длина тега ключевых слов: до 255 символов , 20 слов .

Обратите внимание, , что и Google, и Bing публично указали, что ключевые слова метатеги полностью игнорируются.

Noindex

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

 set_meta_tags noindex: true
# 
set_meta_tags noindex: 'googlebot'
#  

Это полезно для таких страниц, как логин, сброс пароля, политика конфиденциальности и т. Д.

Дополнительная литература:

Индекс

Хотя добавлять «индекс» к «роботам» не обязательно, так как это значение по умолчанию для Google, некоторые специалисты по SEO рекомендуют добавить его на веб-сайт

 индекс set_meta_tags: true
#  

Nofollow

Мета-тег Nofollow сообщает поисковой системе не переходить по ссылкам на определенном страница. Вполне вероятно, что робот найдет такие же ссылки на некоторых другая страница без nofollow (возможно, на каком-то другом сайте), и поэтому по-прежнему попадает на вашу нежелательную страницу.

 set_meta_tags nofollow: true
# 
set_meta_tags nofollow: 'googlebot'
#  

Дополнительная литература:

Подписаться

Follow будет работать с метатегом Noindex

 set_meta_tags noindex: true, follow: true
#  

Он не будет просматривать эту страницу, но будет сканировать остальные страницы на Ваш сайт.

Канонический URL

Канонический элемент ссылки сообщает поисковой системе, какой URL является каноническим или основным. для контента с несколькими URL-адресами.Поисковая система всегда будет возвращать этот URL-адрес, а популярность и авторитет ссылки будут применены к этому URL-адресу.

Примечание. Если вам нравится следовать совету Джона Мюллера о том, что не следует смешивать каноническое и noindex, то вы можете установите MetaTags.config.skip_canonical_links_on_noindex = true , и мы сделаем это за вас.

 set_meta_tags canonical: "http://yoursite.com/canonical/url"
#  

Дополнительная литература:

Значок

Значок (сокращение от «Избранный значок»), также известный как значок ярлыка, веб-сайт. значок, значок вкладки или значок закладки - это файл, содержащий один или несколько маленьких значков, чаще всего 16 × 16 пикселей, связанных с конкретным веб-сайтом или веб-страницей.

 значок set_meta_tags: '/favicon.ico'
# 
set_meta_tags icon: '/favicon.png', введите: 'image / png'
# 
set_meta_tags значок: [
  {href: '/images/icons/icon_96.png', размеры: '32x32 96x96', тип: 'image / png'},
  {href: '/images/icons/icon_itouch_precomp_32.png', rel: 'apple-touch-icon-precomposed', размеры: '32x32', тип: 'image / png'},
]
# 
#  

Дополнительная литература:

Многорегиональные и многоязычные URL-адреса, RSS и ссылки для мобильных устройств

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

 set_meta_tags alternate: {"fr" => "http://yoursite.fr/alternate/url"}
# 

set_meta_tags alternate: {"fr" => "http://yoursite.fr/alternate/url",
                           "де" => "http://yoursite.de/alternate/url"}
# 
#  

Если вам нужно больше, чем просто многоязычные ссылки, вы можете использовать альтернативный синтаксис:

 альтернативный set_meta_tags: [
    {href: 'http: // example.fr / base / url ', hreflang:' fr '},
    {href: 'http://example.com/feed.rss', тип: 'application / rss + xml', заголовок: 'RSS'},
    {href: 'http://m.example.com/page-1', media: 'only screen and (max-width: 640px)'},
  ] 

Дополнительная литература:

Ссылки на страницы

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

 set_meta_tags предыдущая: "http: // yoursite.ru / url? page = 1 "
# 
set_meta_tags следующий: "http://yoursite.com/url?page=3"
#  

Дополнительная литература:

ссылки image_src

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

 set_meta_tags image_src: "http://yoursite.com/icons/icon_32.png"
#  

ссылок amphtml

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

 set_meta_tags amphtml: url_for (формат:: amp, only_path: false)
#  

Чтобы вернуться к обычной версии, используйте canonical .

Ссылки на манифест

 манифест set_meta_tags: 'manifest.json'
#  

Интервал обновления и URL перенаправления

Метаобновление - это метод указания веб-браузеру автоматически обновить текущую веб-страницу или фрейм через заданный интервал времени. Это также можно указать браузеру получить другой URL-адрес, когда страница обновляется путем включения альтернативного URL-адреса в параметр содержимого.К установка интервала времени обновления на ноль (или очень низкое значение), это позволяет метаобновление, которое будет использоваться как метод перенаправления URL-адресов.

 set_meta_tags обновить: 5
# 
set_meta_tags обновить: '5; url = http: //example.com'
#  

Дополнительная литература:

Открыть поиск

Элемент ссылки Open Search для описания поисковой системы в стандартном и доступном формате.

 set_meta_tags open_search: {
  title: "Открытый поиск",
  href: "/opensearch.xml"
}
#  

Дополнительная литература:

Хеши

Любое пространство имен можно построить, просто передав любое имя символа и хэш. Например:

 set_meta_tags foo: {
  бар: "лрем",
  baz: {
    qux: "ipsum"
  }
}
# 
#  

Массивы

Повторяющиеся метатеги можно построить, просто используя массив внутри хэша.Например:

 set_meta_tags og: {
    изображение: ["http://example.com/rock.jpg", "http://example.com/rock2.jpg"]
}
# 
#  

Открыть график

Чтобы превратить ваши веб-страницы в графические объекты, вам нужно добавить Open Graph протокол тегов на ваши веб-страницы. Теги позволяют указать структурированная информация о ваших веб-страницах.Чем больше информации вы предоставите, тем больше возможностей для ваших веб-страниц можно будет увидеть в Facebook уже сегодня. и в будущем. Вот пример страницы фильма:

 set_meta_tags og: {
  название: 'Скала',
  тип: 'video.movie',
  url: 'http://www.imdb.com/title/tt0117500/',
  изображение: 'http://ia.media-imdb.com/rock.jpg',
  видео:    {
    директор: 'http://www.imdb.com/name/nm0000881/',
    писатель: ['http://www.imdb.com/name/nm01/', 'http://www.imdb.com/name/nm0177018/']
  }
}
# 
# 
# 
# 
# 
# 
#  

Несколько изображений, объявленных как массив (посмотрите на символ _ ):

 set_meta_tags og: {
  title: 'Два свойства структурированного изображения',
  тип: 'сайт',
  url: 'view-source: http: // examples.opengraphprotocol.us/image-array.html ',
  изображение:    [{
    _: 'http://examples.opengraphprotocol.us/media/images/75.png',
    ширина: 75,
    высота: 75,
  },
  {
    _: 'http://examples.opengraphprotocol.us/media/images/50.png',
    ширина: 50,
    высота: 50,
  }]
}
# 
# 
# 
# 
# 
# 
# 
# 
#  

Также поддерживаются мета-теги статей:

 статья о set_meta_tags: {
  Published_time: '2013-09-17T05: 59: 00 + 01: 00',
  modified_time: '2013-09-16T19: 08: 47 + 01: 00',
  раздел: "Раздел статьи",
  tag: 'Тег статьи',
}
# 
# 
# 
#  

Дополнительная литература:

Карты Twitter

карточки Twitter позволяют вам прикреплять мультимедийные материалы к твитам, которые ссылаются на ваш контент.Есть 3 типа карт (сводка, фото и игрок). Вот краткий пример:

 set_meta_tags twitter: {
  карточка: "сводка",
  site: "@username"
}
# 
#  

Учтите, что если вы уже используете OpenGraph для описания данных на своей странице, легко создать карточку Twitter без дублирования тегов и данных. Когда обработчик карточек Twitter ищет теги на вашей странице, он сначала проверяет свойство Twitter и, если его нет, возвращается к поддерживаемому свойству Open Graph.Это позволяет определять оба элемента на странице независимо и сводит к минимуму количество повторяющейся разметки, необходимой для описания вашего контента и опыта.

Когда вам нужно создать фотокарточку Twitter, свойство twitter: image представляет собой строку, а размеры изображения задаются с помощью twitter: image: width и twitter: image: height или Hash объектов в термины драгоценных камней MetaTags. Для этой работы есть специальный синтаксис:

 set_meta_tags twitter: {
  карточка: "фото",
  изображение: {
    _: "http: // пример.com / 1.png ",
    ширина: 100,
    высота: 100,
  }
}
# 
# 
# 
#  

Специальный параметр itemprop может использоваться в «анонимном» теге «_» для создания атрибута HTML «itemprop»:

 set_meta_tags twitter: {
  карточка: "фото",
  изображение: {
    _: "http: // пример.com / 1.png ",
    ширина: 100,
    высота: 100,
    itemprop: "изображение",
  }
}
# 
# 
# 
#  

Дополнительная литература:

Ссылки на приложения

App Links - это открытое кроссплатформенное решение для прямых ссылок на контент в вашем мобильном приложении. Вот пример интеграции приложения iOS:

 set_meta_tags al: {
  ios: {
    url: "пример: // приложения",
    app_store_id: 12345,
    app_name: "Пример приложения"
  }
}
# 
# 
#  

Дополнительная литература:

Пользовательские метатеги

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

Пример:

 set_meta_tags автор: "Дмитрий Штефлюк"
#  

Вы также можете указать значение в виде массива, и значения будут отображаться в виде списка из мета-тегов :

 set_meta_tags автор: [«Дмитрий Штефлюк», «Джон Доу»]
# 
#  

Сопровождающие

Дмитрий Штефлюк, https: // kpumuk.инфо

Руководство для новичков по метатегам для SEO

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

Что такое метатеги?

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

На этой странице мы расскажем вам о трех способах, которыми ваши метатеги влияют на SEO, и о пяти из лучших метатегов для SEO, которые вы захотите оптимизировать. Если вам нужна помощь в оптимизации метатегов, позвоните нам сегодня по телефону 888-601-5359 , чтобы поговорить со стратегом о создании кампании SEO, которая приведет к результатам для вашего бизнеса.

WebFX SEO Checker

  • Всеобъемлющий.
  • Немедленно.
  • БЕСПЛАТНО.

3 способа влияния мета-тегов на SEO

Мета-теги играют важную роль в вашей SEO-кампании. Давайте рассмотрим три способа, которыми метатеги помогают в SEO.

1. Они влияют на то, как Google индексирует ваш сайт

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

Google сканирует ваш сайт, чтобы понять контекст вашей страницы. Ваши метатеги дают представление о вашей аудитории, потому что они описывают вашу страницу.

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

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

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

2. Это помогает вам ранжироваться по ключевым словам

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

Пользователи используют ключевые слова, чтобы помочь им найти сайты, соответствующие их поисковым запросам. Если вы выберете правильные ключевые слова, вы поможете разместить свой сайт в правильных результатах поиска.

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

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

3. Мета-теги влияют на восприятие пользователем вашего сайта

Мета-теги помогут вам предоставить вашей аудитории лучший опыт на вашем веб-сайте.Эти теги помогают организовать вашу страницу и предоставить вашей аудитории информацию о ней.

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

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

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

Используя метатеги и SEO, вы поможете своему контенту показываться более релевантным потенциальным клиентам и привлекать больше посетителей на ваш сайт.

5 лучших мета-тегов для SEO (и способы их оптимизации)

Мета-теги - отличный способ для вашего бизнеса повысить эффективность вашего сайта в результатах поиска. Давайте рассмотрим пять лучших метатегов для SEO, на которых вы захотите сосредоточиться, чтобы помочь вашему бизнесу появляться в правильных результатах SEO.

1. Тег заголовка

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

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

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

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

Дополнительное чтение: как написать соблазнительный тег заголовка
2. Мета-описание

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

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

Этот метатег является одним из наиболее важных мета-тегов SEO для привлечения потенциальных клиентов при нажатии на ваше объявление. Ваше мета-описание также поможет поисковым системам понять контекст вашей страницы и ранжировать вас в релевантных результатах поиска.

3. Канонический тег

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

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

Этот тег имеет решающее значение для гарантии того, что Google не накажет ваш сайт за идентичный контент. Дублированный контент обычно является отрицательным индикатором SEO. Когда поисковые системы видят, что несколько страниц контента охватывают одни и те же идеи, эти поисковые системы будут полагать, что вы пытаетесь создать контент, чтобы попытаться неэтично поднять свой рейтинг.

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

4. Альтернативный текст

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

Когда вы используете замещающий текст, вы делаете изображения доступными для людей и поисковых систем. Google не может читать картинки и не знает, что они собой представляют, что делает альтернативный текст чрезвычайно важным. Альтернативный текст помогает Google понять контекст изображения, чтобы правильно оценить вашу страницу и ваше изображение.

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

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

5. Тег заголовка

Когда вы создаете контент для своей страницы, вы часто разбиваете его на разделы с помощью тегов заголовков. Эти теги заголовков помогают структурировать вашу страницу и сделать ваш контент более удобоваримым для вашей аудитории. Они также имеют решающее значение для SEO, поскольку помогают поисковой системе лучше понимать ваш контент.

Теги заголовков

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

Заголовки

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

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

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

Начните оптимизацию своих мета-тегов и SEO сегодня

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

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

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

Мета-тегов и головной раздел сайта

Строительные блоки для SEO

Этот пост был первоначально опубликован авг.26 августа 2015 г. и обновлялась 1 августа 2019 г. и 5 апреля 2021 г.

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

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

По теме: Руководство для начинающих по поисковой оптимизации веб-сайтов малого бизнеса

Краткое руководство по метатегам

Эта статья, отражающая важные изменения в алгоритмах поиска Google, расскажет вам такие важные вещи, как:

Приступим.

Веб-сайт состоит из трех основных частей:
  1. Головка (или жатка)
  2. Кузов
  3. Нижний колонтитул

Думайте о своем теле как о веб-сайте.Ваша голова - это явно верхний колонтитул, нижний колонтитул - это ваши ноги, а ваш торс - ну, вы понимаете.

Верхний и нижний колонтитулы веб-сайта практически одинаковы на всех страницах.

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

Посмотрите на верхнюю часть этой страницы от GoDaddy.В самом верху находится баннер - GoDaddy, Help, How-To и т. Д. Это заголовок. Если вы посетите другую страницу блога GoDaddy, эта часть останется неизменной.


Теперь прокрутите страницу до конца. Вы видели там синий баннер со всем текстом внутри и под ним? Это нижний колонтитул.

Если вы посетите другую страницу блога GoDaddy, этот баннер и его информация останутся неизменными.

Это основной текст, часть, которую вы читаете, будет меняться с каждой новой страницей, которую вы посещаете.

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

А поскольку верхний и нижний колонтитулы являются постоянными, имеет смысл вставлять важный код, например, метатеги, внутри заголовка. Вы, , можете поместить его в нижний колонтитул, , но это плохая идея.

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

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

(Это все равно что съесть салат, когда вы идете за пиццей.Вы же ведь не хотите тратить драгоценную комнату на салат, не так ли? Нет, ты хочешь все это отложить на пиццу! Вот как работает краулинговый бюджет.)

Итак, теперь, когда вы знаете, где хранятся мета-теги, что именно они делают?

Связано: 10 способов улучшить рейтинг ключевых слов в Google

К началу

Мета-теги являются частью вашей поисковой оптимизации (SEO).

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

Например, Google, Bing и Yahoo будут знать, что эта страница посвящена метатегам для веб-сайтов и метатегам SEO, отчасти из-за заголовка и ключевых слов.

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

Некоторые метатеги важнее других, но очень важно, чтобы все они соответствовали целевому ключевому слову страницы.

Например, мета-тег описания сообщает нам, о чем конкретная страница.Это краткая аннотация о содержании страницы и о том, что мы можем ожидать от нее.

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

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

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

Итак, Google запретил кучу распространенных SEO-тактик, потому что эти SEO-спамеры испортили их всем.

Сегодня функция метаописания - заставить людей прочитать вашу страницу.

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

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

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

К началу

Вот самые важные мета-теги и краткое описание того, как они работают. Некоторые из этих тегов помогают людям, посещающим ваш сайт, другие помогают Google и / или веб-браузерам решать, как себя вести.

Тег заголовка

Тег title является частью троицы SEO.Этот тег должен полностью совпадать с URL-адресом страницы и содержанием, двумя другими ножками стула. Это один из самых сильных сигналов, информирующих поисковые системы о том, что страница посвящена определенной теме, что напрямую влияет на рейтинг ключевых слов.

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

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

H - для заголовков, которые читают люди, T - для заголовков, которые читают - черт возьми! Неважно.

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

Вот несколько основных рекомендаций по созданию оптимизированного тега заголовка:

  • Используйте максимум 65 символов (включая пробелы).
  • Целевое ключевое слово страницы должно быть в начале.
  • На каждой странице должен быть один тег заголовка.
  • Каждый тег заголовка должен быть уникальным (никогда не используйте тот же тег заголовка на других страницах).
  • Фирменный знак всегда отображается в конце тега заголовка. Это увеличивает количество ваших персонажей.
  • Отделите заголовок от фирменного знака дефисом или символом | труба (это символ над клавишей \).
  • Если есть место, обязательно укажите название своей компании или свое собственное имя в теге заголовка.Если нет места, оставьте это. Люди будут знать, где они находятся, потому что вы разместите брендинг вверху страницы.

Пользователь видит тег заголовка на странице результатов поисковой системы (SERP). Пользователь не увидит это содержимое на самой веб-странице. Он скрыт, поэтому его могут видеть только боты.

Совет от профессионалов: Если вы используете WordPress в качестве системы управления контентом, я настоятельно рекомендую вам использовать плагин Yoast SEO, хотя есть и другие доступные. Это поможет вам автоматически создавать теги заголовков, которые вы можете настроить самостоятельно.Это также дает вам место для записи мета-тега описания. Кстати, давайте посмотрим на…

К началу

Мета-тег описания

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

Семь или восемь лет назад ваш мета-тег описания мог обмануть Google, чтобы он поставил вас выше, если бы вы были умны - и нечестны и коварны - в том, как вы его написали.

Но Google поумнел и больше не учитывает метаописания при определении рейтинга страницы. помогает другим людям узнать, о чем ваша страница.

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

Чем больше людей перейдут на вашу страницу в своей поисковой выдаче, тем лучше будет работать ваша страница.Чем меньше они щелкают, тем хуже он будет работать.

Итак, если у вас плохое мета-описание, вашей странице будет сложнее привлечь внимание людей. А если вы вообще не напишете его, Google выберет с вашей страницы собственный текст, который, как он надеется, является достаточно хорошим описанием содержания. Фактически, в статье в блоге ahrefs говорится, что Google переписывает метаописания в 62,78% случаев. Вы можете себе представить, какими холодными и неискусными могут быть эти поисковые боты. Вы действительно хотите, чтобы они приняли это решение?

Вот несколько основных правил, которым нужно следовать при написании мета-тега описания:

  • Никогда не превышайте 150 символов, включая пробелы.Если вы используете Yoast SEO для написания своего метаописания, оно сообщит вам, превысили ли вы этот предел.
  • Поместите целевое ключевое слово страницы в начало этого тега.
  • Каждая страница должна иметь один мета-тег описания.
  • Каждый мета-тег описания должен быть уникальным (никогда не используйте такое же описание на других страницах).
  • Используйте язык призыва к действию, который убедит пользователя нажать на результат поиска.

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

К началу

Мета-тег роботов

Осторожно используйте мета-теги роботов! Вам действительно нужно знать, как правильно развернуть этот тег, и вы должны четко понимать различные директивы этого тега. Если нет, оставьте это в покое.

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

Но в основном это первые две вещи: что посетить и записать, чего следует избегать и что игнорировать.

Некоторые команды тегов роботов инструктируют поисковые системы индексировать страницу и следить за ней, а некоторые говорят поисковым системам не индексировать и не подписываться на нее. Как вы уже догадались, это теги NOINDEX и NOFOLLOW.

Если вы используете один или оба этих тега, вы не получите никаких переходов из обычных поисковых систем. Эти страницы будут полностью проигнорированы и невидимы роботами поисковых систем.

Три основных тега робота:

Первая строка указывает поисковым системам не включать эту страницу в свой поисковый индекс, а следовать всем гиперссылкам на этой странице.(То есть перейдите по гиперссылке туда, куда он ведет, будь то другая страница на этом веб-сайте или страница на совершенно другом веб-сайте.)

Вторая строка указывает движкам индексировать страницу, но не переходить по ссылкам на странице, указывающим на другие страницы. (Другими словами, игнорируйте все гиперссылки на сайте.)

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

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

К началу

Теги Open Graph

Open Graph Tags (OG Tags) используются для создания настраиваемых общих сообщений на некоторых платформах социальных сетей.

В принципе, если вы хотите поделиться информацией с определенной веб-страницы в другой социальной сети, например Facebook или Twitter, вам нужны эти теги.

Они сообщат этим сетям, какую информацию отображать всякий раз, когда вы делитесь ссылкой со своего сайта.

Например, если вы когда-либо вставляли ссылку из новостной статьи в обновление статуса Facebook или Twitter, и она заполняла заголовок и фотографию, это социальный граф. И именно теги OG рассказали сети, как это сделать.

Вот типичные теги OG, используемые на веб-сайте:

  • meta property = "og: title"
  • meta property = "og: description"
  • meta property = "og: type"
  • meta property = "og: url"
  • meta property = "og: image"
  • meta property = "og: site_name"

Эти теги не влияют на ранжирование напрямую.Однако исследования показали, что страницы с самым высоким рейтингом по конкурентоспособным ключевым словам, как правило, имеют наибольшую долю из Twitter, Facebook и других сетей. (Если вы все еще не уверены, что вам нужно, спросите своего веб-дизайнера.)

К началу

Мета-тег ключевого слова

Что я могу сказать? Мета-теги ключевых слов действительно не служат конструктивной цели почти для всех поисковых систем по всему миру, включая Bing (США), Baidu (Китай) и Naver (Южная Корея). (Есть вероятность, что Яндекс, российская поисковая система, может использовать теги ключевых слов, но они имеют очень низкий вес.) Большинство профессионалов поисковых систем тоже игнорируют это.

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

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

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

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

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

По теме: Как использовать Bing Webmaster Tools для улучшения SEO вашего сайта

К началу

Другие метатеги HTML

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

Однако вам следует полностью избегать их.

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

Быстрая загрузка страницы очень важна для улучшения вашего SEO.

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

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

Однако есть одно исключение: тег Viewport. По данным Moz:

«В этом мобильном мире вы должны указывать область просмотра. Если вы этого не сделаете, вы рискуете получить неудовлетворительную работу с мобильными устройствами ».

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

Инструмент Google PageSpeed ​​Insights расскажет вам больше о теге области просмотра. Стандартный тег:

Если вы занимаетесь поисковой оптимизацией и полагаетесь на Yoast SEO при написании описания и тега заголовка, ничего страшного. Но если вы понятия не имеете, что делаете, оставьте этот тег своему дизайнеру или разработчику. Пусть они скажут вам, что с этим делать, а еще лучше пусть сделают это сами.

К началу

Заключение и следующие шаги

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

Хотите узнать больше о SEO и о том, как использовать различные метатеги? Или вы хотите оставить SEO и метатеги на усмотрение экспертов?

Если последнее, обратитесь к профессионалам в GoDaddy SEO Services, чтобы привлечь к своему сайту должное внимание.Узнайте, как можно меньше работать и занимать более высокое место. Если первое, я рекомендую прочитать все, что можно, в блоге Moz.com. Они являются лидерами в области поисковой оптимизации и осведомлены о последних практиках и обновлениях Google. Кроме того, если вы пользователь WordPress, скачайте плагин Yoast и читайте их блог; они также следят за последними исследованиями в области SEO и могут помочь вам в полной мере использовать блог Yoast.

Эта статья включает материалы, изначально опубликованные в блоге GoDaddy Гарт О’Брайен.

Поддерживаемые мета-теги

Обсуждение

Используйте мета-ключ области просмотра, чтобы улучшить представление вашего веб-контента на iOS. Как правило, вы используете метатег области просмотра, чтобы установить ширину и начальный масштаб области просмотра.

Например, если ваша веб-страница уже, чем 980 пикселей, вы должны установить ширину области просмотра, чтобы она соответствовала вашему веб-контенту. Если вы разрабатываете Safari в веб-приложении для iOS, вам следует установить ширину, равную ширине устройства.

В таблице 1 описаны свойства, поддерживаемые мета-ключом области просмотра, и их значения по умолчанию. При предоставлении нескольких свойств для мета-ключа области просмотра следует использовать список операторов присваивания, разделенных запятыми. Следуйте этим правилам при установке нескольких свойств:

  • Не используйте точку с запятой в качестве разделителя.

  • Пробел может работать как разделитель, но предпочтительнее использовать запятую.

  • Для числовых свойств, если значение содержит нечисловой символ, но начинается с числа, то в качестве значения используется префикс числа.Например, 1,0x эквивалентно 1,0 , а 123x456 эквивалентно 123 . Если параметр не начинается с числа, значение - 0 .

При обращении к размерам устройства следует использовать константы, описанные в таблице 2, вместо жесткого кодирования конкретных числовых значений. Например, используйте device-width вместо 320 для ширины и device-height вместо 480 для высоты в портретной ориентации.

Нет необходимости устанавливать все свойства области просмотра. Если задано только подмножество свойств, Safari на iOS определяет другие значения. Например, если вы установите масштаб на 1,0 , Safari предполагает, что ширина составляет ширина устройства в портретной ориентации и высота устройства в альбомной ориентации. Следовательно, если вы хотите, чтобы ширина составляла 980 пикселей, а начальный масштаб был 1,0 , установите оба этих свойства.

Например, чтобы установить ширину области просмотра в соответствии с шириной устройства, добавьте это в свой HTML-файл:

  

Чтобы установить начальный масштаб на 1.0 , добавьте это в свой HTML-файл:

  

Чтобы установить начальный масштаб и отключить масштабирование пользователя, добавьте это в свой HTML-файл:

  

Используйте Safari на консоли iOS для отладки веб-страниц как описано в Safari Web Inspector Guide .Консоль содержит советы, которые помогут вам выбрать значения области просмотра - например, она напоминает вам использовать константы при обращении к ширине и высоте устройства.

Мета-элементы: руководство для начинающих

Статья обновлена ​​20 октября 2020 г.

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

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

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

Индекс содержимого:

  • Что такое мета-теги
  • Типы мета-тегов
  • Мета-описание
  • Тип мета-содержимого
  • Мета Роботы
  • Мета-заголовок
  • Мета-ключевое слово
  • Мета Автор
  • Мета Авторское право
  • Мета-язык
  • Разные мета-теги
  • Как добавить мета-теги на свой сайт

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

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

Наиболее распространенный синтаксис метатега HTML выглядит следующим образом:

Есть две широкие категории метатегов: важные и необязательные.

Важные мета-теги:

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

Следующие теги являются важными метатегами:

  • Мета-описание
  • Тип мета-содержимого
  • Мета Роботы
Дополнительные мета-теги:

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

Следующие теги подпадают под необязательные метатеги:

  • Мета-заголовок
  • Мета-ключевое слово
  • Мета Автор
  • Мета Авторское право
  • Мета-язык (для неанглоязычных сайтов)

Теперь давайте рассмотрим каждый метатег по отдельности.

Мета Описание

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

Взгляните на пример фрагмента поиска ниже, взятого из поиска Bing:

Пример снимка экрана фрагмента поиска Bing (изображение предоставлено - bing.com)

И этот фрагмент поиска был взят из метаописания сайта, которое показано ниже:

Исходный код Метаописание образца сайта из приведенного выше фрагмента поиска (изображение предоставлено keurig.com)

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

Пример снимка экрана фрагмента поиска Google (изображение предоставлено google.com)

Вот так выглядит закодированная сторона сайта, которая показывает, что содержание в метаописании не совпадает с содержанием во фрагменте поиска Google на примере сайта.

Исходный код Мета-описание образца сайта из фрагмента поиска. Снимок экрана вверху (изображение предоставлено - d Downtownhouston.org)

Это связано с тем, что Google выбирает из лучшего описания сайта, найденного либо в метаописании, либо в содержимом страницы, либо в данных ODP (проект открытого каталога), и отображает его при поиске.Что касается поиска Google, то выбор содержания описания больше не находится под вашим контролем.

Узнайте больше об этом в этом блоге Moz в сообщении под названием Почему Google не будет использовать мое метаописание?

Насколько важны мета-теги описания для SEO?

По 10-балльной шкале значимости для SEO метаописания получают 5.

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

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

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

Пример мета-тега описания.

Тип мета-контента

Этот метатег используется для объявления набора символов веб-сайта. Этот тег определяет кодировку символов для документа HTML. Общие коды - UTF-8 (кодировка символов для юникода) и ISO-8859-1 (кодировка символов для латинского алфавита). В HTML 4.01 тег типа мета-контента выглядит так:

HTML 5, с другой стороны, имеет новый атрибут под названием charset, который упрощает объявление набора символов, как показано в примере ниже:

 ] (https: // s3.amazonaws.com/woocms.woorank.com/2016/Aug/sample_screenshot_of_bing_search_snippet-1472550869927.png
  

Рекомендуется всегда использовать этот тег вместе с форматом объявления DTD Консорциумом World Wide Web. В противном случае могут возникнуть проблемы с отображением на веб-сайте.

Насколько важна мета-кодировка для SEO?

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

Мета Роботы

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

  • Если вы не хотите, чтобы страницы вашего сайта индексировались или переходили по ссылкам, вы можете использовать следующий код:

Это указывает поисковому роботу не индексировать вашу страницу в результатах поиска и не переходить по ссылкам на странице.В основном это делается на стадии разработки, когда сайт еще не готов к поиску. При запуске нового веб-сайта всегда проверяйте, был ли удален этот метатег robots.

  • Если вы хотите, чтобы ваш сайт был проиндексирован, но не хотите переходить по ссылкам на нем, вы можете использовать следующий код:

    ] (https://s3.amazonaws.com/woocms.woorank.com/2016/Aug/sample_screenshot_of_google_search_snippet-1472550941831.png

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

  • Если вы не хотите, чтобы ваша страница индексировалась, но хотите, чтобы по вашим ссылкам на странице следовали, используется следующий код:

     ] (https://www.downtownhouston.org/guidedetail/minuti-coffee/
      

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

  • Если вы не возражаете, если ваш сайт проиндексирован и переходят по ссылкам, используется следующий код:

    ] (https://s3.amazonaws.com/woocms.woorank.com/2016/Aug/source_code_view_of_meta_description_of_sample_site_from_search_snippet-1472550997552.png

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

Ниже перечислены некоторые другие значения, которые можно указать в теге robots.(За этими значениями следует googlebot):

  • nosnippet : предотвращает отображение фрагментов в результатах поиска.
  • noodp : предотвращает использование альтернативного описания из ODP / DMOZ во фрагментах поиска.
  • noarchive : запрещает Google показывать кешированные ссылки для страницы.
  • unavailable_after [дата] : чтобы указать точную дату, когда вы хотите остановить сканирование и индексирование вашей веб-страницы.
  • noimageindex : Предотвращает указание ваших страниц в качестве страниц-ссылок для изображений при поиске изображений Google.

ПРИМЕЧАНИЕ. Если вы не укажете метатег robots, страница будет считаться индексной, следуйте. Кроме того, не обязательно, чтобы все роботы поисковых систем следовали коду роботов.

Насколько важны мета-теги роботов для SEO?

По шкале от 1 до 10 по значимости для SEO мета-теги роботов получают 8 баллов.

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

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

Допустим, вы заблокировали индексирование страницы в файле robots.txt вашего веб-сайта. Но страница по-прежнему отображается в поиске как простые URL-адреса (без названия и описания).Что, если этот URL-адрес накапливает ссылки и получает ссылочный вес? Они никогда не смогут передать этот ссылочный вес, поскольку ссылки на них не будут сканироваться, и, таким образом, ссылочный вес будет потрачен впустую.

С другой стороны, если вы используете метатег robots на этой конкретной странице со значением 'noindex, follow', страница не будет проиндексирована при поиске, но сможет передать свой рейтинг другим страницам, потому что ссылки на ней могут сканироваться. .

Это то, что Google говорит о метатеге robots.

Мета-заголовок

Мета-заголовок часто путают с тегом </code>, который используется в тегах <code><head> </code>.Хотя тег <code><title> </code> является обязательным для использования на вашем сайте, метатег заголовка не является обязательным. Содержимое тега <code><title> </code> отображается на вкладке браузера, а также как заголовок во фрагменте поиска.</p><p> Взгляните на следующий пример:</p><p></p><p> Тег заголовка, отображаемый во фрагменте поиска в поиске Google (изображение - google.com)</p><p> Этот фрагмент поиска, показанный выше, отображает содержимое тега <code><title> </code>.</p><p> Ниже показаны снимки экрана раздела исходного кода сайта, содержащего тег <code><title> </code>, за которым следует снимок экрана вкладки браузера, на которой отображается заголовок страницы.</p><p></p><p> Исходный код образца сайта с содержимым тега заголовка (изображение предоставлено frankspizza.com)</p><p></p><p> Образец заголовка страницы на вкладке браузера (изображение предоставлено frankspizza.com)</p><p> Однако, если у вас есть метатег заголовка, его содержимое будет отображаться в фрагменте поиска, а содержимое тега <code><title> </code> будет отображаться на вкладке окна браузера.Большинство веб-сайтов не используют метатег заголовка, кроме следующих редких случаев.</p><p> Скажем, ваш тег заголовка короткий, чтобы поместиться в текстовой области вкладки браузера - Frank's Pizza | Хьюстон, и вы хотите, чтобы в вашем поисковом фрагменте было больше информации. Затем вы можете использовать метатег заголовка с надписью Frank's Pizza Best 24 Hour Pizza Place в Хьюстоне. Метатег заголовка представлен следующим образом:</p><p> <code><meta name = "title" content = "Здесь идет ваш заголовок"> </code></p><p> Большинство отраслевых экспертов говорят, что теги <code><title> </code> являются метатегами, но это не так.Тем не менее, они очень важны, и вот статья, которая дает вам 10 советов по оптимизации тегов заголовков.</p><p> <strong> Насколько важны мета-теги заголовков для SEO? </strong></p><p> Вы можете иметь теги <code><title> </code> вместо тегов мета-заголовков или оба с одинаковым содержимым. Ключевые слова в метатеге заголовка (или теге <code><title> </code>) играют незначительную роль в вашей позиции в поисковой выдаче, при условии, что другие элементы SEO правильно реализованы на вашем сайте.</p><h5><span class="ez-toc-section" id="i-65"> Мета-ключевое слово </span></h5><p> В начале 1996 года две поисковые системы, Infoseek и AltaVista, основанные на поисковой системе, использовали метатег ключевого слова для идентификации, классификации и позиционирования веб-сайтов в поисковой выдаче.Следуя их примеру, некоторые другие поисковые системы, такие как Inktomi и Lycos, также начали использовать эти теги для ранжирования веб-сайтов в поиске. Вскоре спамеры начали манипулировать этим тегом для повышения рейтинга, что привело к снижению поддержки со стороны быстро развивающихся поисковых систем. Таким образом, большинство основных поисковых систем сделали метатеги ключевыми словами бесполезными для SEO.</p><p> Метатег ключевого слова представлен следующим образом:</p><pre> <code> http://www.domain.com/page.html </code> </pre><p> <strong> Насколько важны мета-теги ключевых слов для SEO? </strong></p><p> Мета-тег ключевого слова объявлен непригодным для основных поисковых систем.В 2009 году Google открыто заявил, что не использует этот тег. Единственная поисковая система, которая использует этот тег, - Bing, чтобы помочь обнаружить спам. Лучше всего не использовать этот тег и добавлять его в код сайта, вызывая раздувание кода. И даже если вы все же используете этот тег, убедитесь, что в нем не более трех уникальных ключевых слов.</p><h5><span class="ez-toc-section" id="i-66"> Мета Автор </span></h5><p> Этот метатег относится к автору страницы, то есть к тому, кто разработал просматриваемый HTML-документ. Он используется в качестве ссылки для отслеживания автора конкретной страницы в случаях, когда используются несколько разработчиков.</p><p> Представляется как:</p><p> <code><meta name = "author" content = "имя и фамилия, адрес электронной почты" </code></p><p> <strong> Насколько важны мета-теги авторов для SEO? </strong></p><p> Этот тег в любом случае бесполезен для SEO-рейтинга вашего сайта.</p><h5><span class="ez-toc-section" id="i-67"> Мета Авторское право </span></h5><p> Метатег копирайта используется для включения авторского права, патента или товарного знака. Мы не несем ответственности за защиту содержимого или интеллектуальной собственности вашего сайта. Тег представлен как:</p><p> <code><meta name = "copyright" content = "Copyright 2014"> </code></p><p> <strong> Насколько важны мета-теги авторских прав для SEO? </strong></p><p> Не имеет значения для SEO вашего сайта.</p><h5><span class="ez-toc-section" id="i-68"> Мета-язык </span></h5><p> Если ваш сайт не на английском языке, вы можете указать язык своего сайта с помощью этого тега. Ниже приведен пример HTML-кода метаязыка:</p><pre> <code> undefined </code> </pre><p> ПРИМЕЧАНИЕ. Google не требует, чтобы этот код определял язык веб-сайта, поэтому он помещен в необязательный раздел метаэлементов. Это может быть полезно для других поисковых систем.</p><p> <strong> Насколько важны метаязыковые теги для SEO? </strong></p><p> Это не имеет существенного значения для SEO вашего сайта.</p><h5><span class="ez-toc-section" id="i-69"> Разные мета-теги </span></h5><p> Есть много других разных мета-тегов, о которых мы не будем подробно говорить в этом посте. Однако для справки они следующие:</p><ul><li> Meta Designer - Этот тег используется для объявления дизайнера веб-сайта. например: <code><meta name = "Designer" content = "Robert Lewis"> </code></li><li> Meta Googlebot - этот тег используется в тех случаях, когда вы хотите, чтобы робот Google делал что-то конкретное. например: <code><meta name = "googlebot" content = "nosnippet"> </code></li><li> Meta MSN - этот тег используется для описания вашего сайта в поиске Bing, а не из DMOZ.например: <code><meta name = "msnbot" content = "NOODP"> </code></li><li> Тип сценария мета-содержимого - этот тег используется для указания языка сценариев по умолчанию для документа. например: <code><meta http-Equiv = "Content-Script-Type" content = "text / javascript"> </code></li><li> Meta Content Style Type - этот тег используется для определения CSS по умолчанию для документа. например: <code><meta http-Equiv = "Content-Style-Type" content = "text / css"> </code></li><li> Meta Distribution - этот тег используется для объявления распространения вашего веб-контента (глобального, локального или IU).например: <code><meta name = "Distribution" content = "Global"> </code></li><li> Meta Expires - этот тег используется для объявления даты и времени, после которых документ должен считаться просроченным. например: <code><meta http-Equiv = "expires" content = "Thu, 5 Jun 2014 09:30:00 GMT"> </code></li><li> Meta Generator - этот тег используется для объявления имени и версии инструмента, используемого для публикации веб-сайта. например: <code><meta name = "Generator" content = "FrontPage 4.0"> </code></li><li> Meta MS Smart Tags - этот тег использовался для выделения ключевых слов на веб-сайте, которые перенаправляли пользователя на сайт конкурента.например: <code><meta name = "MSSmartTagsPreventParsing" content = "True"> </code></li><li> Meta Pragma No-Cache - этот тег используется для предотвращения просмотра кэшированной версии страницы. например: <code><meta http-Equiv = "Pragma" content = "no-cache"> </code></li><li> Meta Publisher - этот тег используется для объявления имени и версии инструмента, используемого для публикации веб-сайта. Он похож на тег Meta Generator. например: <code><meta name = "Publisher" content = "FrontPage 4.0"> </code></li><li> Meta Refresh - этот тег используется для указания задержки в секундах перед автоматическим обновлением документа браузером.например: <code><meta http-Equiv = "Refresh" content = "3; URL = http: //www.domain.com/page.html"> </code></li><li> Meta Reply-to - это тег для сбора адресов электронной почты (обычно используется спамерами). например: <code><meta name = "reply-to" content = "your.email@address.com" /> </code></li><li> Meta Resource Type - этот тег используется для объявления ресурса страницы. например: <code><meta name = "resource-type" content = "document"> </code></li><li> Meta Revisit After - этот тег используется для информирования поисковых систем о том, когда вернуться для индексирования сайта.например: <code><meta name = "Revisit-After" content = "30 days Days"> </code></li><li> Meta Set Cookie - этот тег используется для установки cookie в веб-браузере пользователя. например: <code><meta http-Equiv = "Set-Cookie" content = "cookievalue = xxx; expires = Четверг, 5 июня 2014 г. 20:30:00 GMT; path = /"> </code></li><li> Meta Subject - этот тег используется для объявления темы веб-сайта. например: <code><meta name = "Subject" content = "Тема веб-страницы"> </code></li></ul><h5><span class="ez-toc-section" id="i-70"> Как добавить мета-теги на свой сайт? </span></h5><p> Прежде чем мы узнаем, как добавить метатеги на ваш сайт, позвольте мне дать вам быстрый ярлык, чтобы проверить, есть ли на вашем сайте метаэлемент.</p><p> Откройте свой веб-сайт в браузере и нажмите Ctrl + U на клавиатуре.</p><p> Кроме того, вы можете щелкнуть правой кнопкой мыши в любом месте своего веб-сайта и выбрать опцию «Просмотреть исходный код страницы». Теперь нажмите Ctrl + F и введите «мета». Если присутствует слово «мета», это означает, что ваш сайт был создан с использованием необходимого метаэлемента.</p><p> В любом случае, если отсутствует какой-либо метаэлемент, выполните следующие действия:</p><p> Если вы используете CMS или сторонние инструменты, поищите документацию по программному обеспечению о том, как добавить метатеги на ваш сайт.</p><p> Если вы не уверены, как самостоятельно обрабатывать HTML и добавлять его на свой сайт, попросите веб-разработчика сделать это за вас.</p><p> Но если вы немного разбираетесь в HTML, вот что вам нужно, чтобы добавить метатеги на свой сайт самостоятельно:</p><ul><li> Имя пользователя и пароль к вашему веб-серверу.</li><li> Программа FTP.</li><li> Программа для редактирования текста или блокнот.</li></ul><p> Шаги по добавлению метатега на вашу веб-страницу:</p><ul><li> Напишите свой метатег в блокноте или воспользуйтесь генератором метатега</li><li> Установите FTP-соединение с вашим сервером.</li><li> Найдите файлы с именами index.html, index.htm, default.html или default.htm.</li><li> Откройте файл с помощью Блокнота или используемого текстового редактора.</li><li> Скопируйте и вставьте метатег между <code><head> </code> и <code></head> </code>.</li><li> Сохраните страницу.</li><li> Используя FTP, замените отредактированный индексный файл на вашем сервере.</li></ul><p> ПРИМЕЧАНИЕ. Всегда сохраняйте резервную копию исходного кода вашего сайта, прежде чем вносить какие-либо изменения.</p><h5><span class="ez-toc-section" id="i-71"> Вывод: </span></h5><p> Использование метаэлемента может не иметь заметного или существенного влияния на то, насколько хорошо ваш веб-сайт отображается в результатах поисковых систем, но он полезен для контроля того, как поисковые системы сканируют, индексируют и перечисляют страницы вашего сайта.Поскольку вы уже много узнали о метаэлементах в этом посте и знаете, что добавить эти элементы на свой сайт не так уж и сложно.</p><p> Вы должны добавить на свои страницы как минимум три тега - мета-описание, мета-роботов и мета-заголовок (необязательно, если вы используете тот же контент в тегах <code><title> </code>). Как уже говорилось выше, известно, что эти три тега незначительно влияют на SEO вашего сайта.</p><p> <strong> Сообщите нам о своем опыте работы с метатегами. Считаете ли вы, что они помогают с вашим SEO? </strong></p><table><h2><span class="ez-toc-section" id="_Twitter-3"> Карты разметки | Документы | Платформа разработчика Twitter </span></h2><tr><td> Свойство</td><td> OpenGraph</td></tr><tr><td><p> <code> twitter: карточка </code></p><p> Тип карты</p><p> <i> Используется со всеми картами </i></p></td><td><p> <code> ог: тип </code></p><p> <i> Если og: type, og: title и og: description существуют в разметке, но twitter: card отсутствует, то может отображаться сводная карточка.</i></p></td></tr><tr><td><p> <code> твиттер: сайт </code></p><p> @ имя пользователя веб-сайта. Требуется либо twitter: site, либо twitter: site: id.</p><p> <i> Используется с summary, summary_large_image, приложением, карточками игроков </i></p></td><td> н / д</td></tr><tr><td><p> <code> твиттер: сайт: id </code></p><p> То же, что twitter: site, но с идентификатором пользователя в Twitter. Требуется либо twitter: site, либо twitter: site: id.</p><p> <i> Используется с summary, summary_large_image, картами игроков </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: создатель </code></p><p> @ имя пользователя создателя контента</p><p> <i> Используется с картами summary_large_image </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: создатель: id </code></p><p> Идентификатор пользователя Twitter создателя контента</p><p> <i> Используется с карточками summary, summary_large_image </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: описание </code></p><p> Описание содержания (максимум 200 знаков)</p><p> <i> Используется с summary, summary_large_image, картами игроков </i></p></td><td> <code> ог: описание </code></td></tr><tr><td><p> <code> twitter: title </code></p><p> Название содержания (не более 70 символов)</p><p> <i> Используется с summary, summary_large_image, картами игроков </i></p></td><td> <code> ог: название </code></td></tr><tr><td><p> <code> twitter: image </code></p><p> URL-адрес изображения для использования в карточке.Размер изображений не должен превышать 5 МБ. Поддерживаются форматы JPG, PNG, WEBP и GIF. Будет использоваться только первый кадр анимированного GIF. SVG не поддерживается.</p><p> <i> Используется с summary, summary_large_image, картами игроков </i></p></td><td> <code> ог: изображение </code></td></tr><tr><td><p> <code> twitter: image: alt </code></p><p> Текстовое описание изображения, передающее суть изображения пользователям с ослабленным зрением. Максимум 420 символов.</p><p> <i> Используется с summary, summary_large_image, картами игроков </i></p></td><td> <code> og: image: alt </code></td></tr><tr><td><p> <code> twitter: игрок </code></p><p> HTTPS URL-адрес iframe проигрывателя</p><p> <i> Используется с картой игрока </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: player: width </code></p><p> Ширина iframe в пикселях</p><p> <i> Используется с картой игрока </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: player: высота </code></p><p> Высота iframe в пикселях</p><p> <i> Используется с картой игрока </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: player: stream </code></p><p> URL-адрес необработанного видео или аудиопотока</p><p> <i> Используется с картой игрока </i></p></td><td> н / д</td></tr><tr><td><p> <code> твиттер: приложение: имя: iphone </code></p><p> Название вашего приложения для iPhone</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> твиттер: приложение: идентификатор: iphone </code></p><p> Ваш идентификатор приложения в iTunes App Store (Примечание: НЕ ваш идентификатор пакета)</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> твиттер: приложение: URL: iphone </code></p><p> Пользовательская схема URL-адреса вашего приложения (после названия схемы вы должны включить ": //")</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> твиттер: приложение: имя: ipad </code></p><p> Название вашего приложения, оптимизированного для iPad</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> твиттер: приложение: идентификатор: ipad </code></p><p> Идентификатор вашего приложения в iTunes App Store</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: app: url: ipad </code></p><p> Собственная схема URL вашего приложения</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: app: name: googleplay </code></p><p> Имя вашего Android-приложения</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: app: id: googleplay </code></p><p> Ваш идентификатор приложения в Google Play Store</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr><tr><td><p> <code> twitter: app: url: googleplay </code></p><p> Собственная схема URL вашего приложения</p><p> <i> Используется с картой приложения </i></p></td><td> н / д</td></tr></table>.</div><footer class="entry-footer"> <span><i class="fa fa-folder"></i> <a href="https://russia-dropshipping.ru/category/raznoe" rel="category tag">Разное</a></span><span><i class="fa fa-link"></i><a href="https://russia-dropshipping.ru/raznoe/meta-tegi-meta-tegi-dlya-sajta-chto-takoe-meta-tegi-kakie-byvayut-dlya-chego-propisyvat-klyuchevye-slova-v-meta-tegi-2.html" rel="bookmark"> permalink</a></span></footer></article><nav class="navigation post-navigation clearfix" role="navigation"><h1 class="screen-reader-text">Post navigation</h1><div class="nav-links"><div class="nav-previous"><a href="https://russia-dropshipping.ru/raznoe/na-chem-zarabotat-v-seo-kak-zarabotat-na-seo-v-internete-skolko-zarabatyvayut-na-prodvizhenii-sajtov.html" rel="prev"><i class="fa fa-long-arrow-left"></i> На чем заработать в сео: Как заработать на SEO в Интернете? Сколько зарабатывают на продвижении сайтов</a></div><div class="nav-next"><a href="https://russia-dropshipping.ru/raznoe/estafety-v-istoriyu-v-vk-estafety-v-vk-s-cziframi-estafety-v-instagrame-v-istorii.html" rel="next">Эстафеты в историю в вк: Эстафеты в вк с цифрами. Эстафеты в инстаграме в истории <i class="fa fa-long-arrow-right"></i></a></div></div></nav><div id="comments" class="comments-area"><div id="respond" class="comment-respond"><h3 id="reply-title" class="comment-reply-title">Добавить комментарий <small><a rel="nofollow" id="cancel-comment-reply-link" href="/raznoe/meta-tegi-meta-tegi-dlya-sajta-chto-takoe-meta-tegi-kakie-byvayut-dlya-chego-propisyvat-klyuchevye-slova-v-meta-tegi-2.html#respond" style="display:none;">Отменить ответ</a></small></h3><form action="https://russia-dropshipping.ru/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate><p class="comment-notes"><span id="email-notes">Ваш адрес email не будет опубликован.</span> <span class="required-field-message">Обязательные поля помечены <span class="required">*</span></span></p><p class="comment-form-comment"><label for="comment">Комментарий <span class="required">*</span></label><textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Имя <span class="required">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" autocomplete="name" required /></p><p class="comment-form-email"><label for="email">Email <span class="required">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" autocomplete="email" required /></p><p class="comment-form-url"><label for="url">Сайт</label> <input id="url" name="url" type="url" value="" size="30" maxlength="200" autocomplete="url" /></p><p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Отправить комментарий" /> <input type='hidden' name='comment_post_ID' value='28265' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /></p></form></div></div></main></div><div id="secondary" class="widget-area" role="complementary"><aside id="search-2" class="widget widget_search"><form role="search" method="get" class="search-form" action="https://russia-dropshipping.ru/"> <label> <span class="screen-reader-text">Найти:</span> <input type="search" class="search-field" placeholder="Поиск…" value="" name="s" /> </label> <input type="submit" class="search-submit" value="Поиск" /></form></aside><aside id="categories-3" class="widget widget_categories"><h3 class="widget-title">Рубрики</h3><ul><li class="cat-item cat-item-7"><a href="https://russia-dropshipping.ru/category/seo">Seo</a></li><li class="cat-item cat-item-15"><a href="https://russia-dropshipping.ru/category/instrument-2">Инструмент</a></li><li class="cat-item cat-item-9"><a href="https://russia-dropshipping.ru/category/instrument">Инструменты</a></li><li class="cat-item cat-item-16"><a href="https://russia-dropshipping.ru/category/program-2">Програм</a></li><li class="cat-item cat-item-4"><a href="https://russia-dropshipping.ru/category/program">Программы</a></li><li class="cat-item cat-item-14"><a href="https://russia-dropshipping.ru/category/prodvizh-2">Продвиж</a></li><li class="cat-item cat-item-5"><a href="https://russia-dropshipping.ru/category/prodvizh">Продвижение</a></li><li class="cat-item cat-item-3"><a href="https://russia-dropshipping.ru/category/raznoe">Разное</a></li><li class="cat-item cat-item-13"><a href="https://russia-dropshipping.ru/category/semant-2">Семант</a></li><li class="cat-item cat-item-8"><a href="https://russia-dropshipping.ru/category/semant">Семантика</a></li><li class="cat-item cat-item-17"><a href="https://russia-dropshipping.ru/category/sovet-2">Совет</a></li><li class="cat-item cat-item-11"><a href="https://russia-dropshipping.ru/category/sovet">Советы</a></li><li class="cat-item cat-item-12"><a href="https://russia-dropshipping.ru/category/sozdan-2">Создан</a></li><li class="cat-item cat-item-6"><a href="https://russia-dropshipping.ru/category/sozdan">Создание</a></li><li class="cat-item cat-item-18"><a href="https://russia-dropshipping.ru/category/sxem-2">Схем</a></li><li class="cat-item cat-item-10"><a href="https://russia-dropshipping.ru/category/sxem">Схемы</a></li></ul></aside></div></div><div id="sidebar-footer" class="footer-widget-area clearfix" role="complementary"><div class="container"></div></div><footer id="colophon" class="site-footer" role="contentinfo"><div class="site-info"><div class="container"> Copyright © 2024 <font style="text-align:left;font-size:15px;"><br> Дропшиппинг в России.<br> Сообщество поставщиков дропшипперов и интернет предпринимателей.<br>Все права защищены.<br>ИП Калмыков Семен Алексеевич. ОГРНИП: 313695209500032.<br>Адрес: ООО «Борец», г. Москва, ул. Складочная 6 к.4.<br>E-mail: mail@russia-dropshipping.ru. <span class="phone-none">Телефон: +7 (499) 348-21-17</span></font></div></div></footer></div> <noscript><style>.lazyload{display:none}</style></noscript><script data-noptimize="1">window.lazySizesConfig=window.lazySizesConfig||{};window.lazySizesConfig.loadMode=1;</script><script async data-noptimize="1" src='https://russia-dropshipping.ru/wp-content/plugins/autoptimize/classes/external/js/lazysizes.min.js'></script> </body></html>