Html мета теги: что это такое, как их правильно указывать

Метатеги в HTML | Шнайдер блог

2994 Посещений

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

Метатеги для веб-портала находятся в HTML-коде между тегами <head>…</head>. Синтаксис метатега выглядит так:

<meta name=»атрибут» content=»слова»>

<meta http-equiv=»атрибут» content=»действие»>

Рассмотрим атрибуты тега <meta>:

  • content — устанавливает значение атрибута, которое было задано при помощи name и http-equiv.
  • http-equiv — отвечает за конвертацию меттега в заголовок HTTP.
  • name — атрибут, по которому определяется предназначение метатега. Обратите внимание на то, что в одном <meta> нельзя использовать и name, и http-equiv.
  • charset — кодировка документа.

Кроме того, метатеги разделены на две категории:

  • Name — категория, содержащая только текстовую информацию (ключевые слова, описание и пр.). В Name собраны данные, которые ищут поисковики.
  • HTTP-EQUIV — категория, которая влияет на формирование заголовка, а также дает понять браузеру, о каком режиме обрабтки идет речь.

Функций метатегов разбиты три группы:

  • Метатеги для “управления” браузером (в них содержатся советы/требования по отображению веб-страниц).
  • Метатеги, содержащие данные о контенте и авторе.
  • Метатеги, содержащие информацию для поисковиков.

Рассмотрим каждый пункт детальнее.

Метатеги для браузера

Для тегов данной категории характерно присутствие атрибута http-equiv:

  • Content-Type — кодировка и тип документа. Например, установим международную кодировку utf8, без использования которой русский текст на странице может отображаться в виде набора символов:

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

  • Content-Language —  задает язык документа, а также “уведомляет” о нем роботов, которые индексируют веб-портал. Например:

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

  • Cache-Control — информирует браузер о кэше:

<meta http-equiv=»Cache-Control» content =»[no-cache], [public], [private], [no-store], [must-revalidate], [proxy-revalidate], [max-age=n]»>

Значенич параметров:

[no-cache] — запрет на кэширование документа.

[public] — документ кэшируется во всех возможных случаях.

[private] — документ кэшируется в частном кэше, но не в proxy-сервере.

[no-store] —  документ кэшируется, но не хранится в архиве.

[must-revalidate] — максимальное время хранения кэша. Задается вместе с параметром max-age=n. Например:

<meta http-equiv=»Cache-Control» content=»max-age=3600, must-revalidate»>

[proxy-revalidate] — то же самое, что и в предыдущем случае, но в отношении proxy-сервера.

[max-age=n] — максимальное время кэширования (в секундах) .

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

<meta name=»expires» content=»Sat, 2 Apr 2016 08:00:00 GMT «>

  • Refresh — автоматическое обновление документа через указанное время (исчисляется в секундах). Также можно указать URL-адрес другой веб-страницы, и тогда будет загружена именно она. Например, через 10 секунд посетитель сайта окажется на указанной странице:

<meta http-equiv=»refresh» content=»10; url=http://URL-страницы»>

Метатеги для поисковиков

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

<meta name=»description» content=»Метатеги в HTML»>

<meta name=»keywords» content=»метатеги, html, keywords»>

Index — разрешение на индексацию страниц.

Noindex — запрет на индексацию страницы.

Follow — разрешение “ходить”  по ссылкам страницы.

Nofolllow — запрет на “хождение” по ссылкам страницы.

All — разрешено индексировать страницу + “ходить по ссылкам.

None — запрещено индексировать страницу + “ходить по ссылкам.

Например, полный запрет индексации страницы выглядит так:

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

<meta name=»revisit» content=»10 days»>

<meta name=»resource-type» content=»Document»>

Возможные значения: Document, Build, Classification, Creation, Formatter, Host, Operator, Random text, Rating, Site-languages, Subject, Template, Version.

<meta name=»Subject» content=»Метатеги в HTML»>

<meta name=»URL» content= «http://ваш-URL»>

Метатеги с информацией о содержимом странице и авторе

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

<meta name=»Generator» content=»cms/программа>

<meta name=»Reply-to» content=»e-mail»>

<meta name=»Author» content=»Имя автора»>

<meta name=»Copyright» content=»Название фирмы»>

Главные теги — Учебник HTML — schoolsw3.

com

❮ Назад Далее ❯


HTML элемент <head> контейнер для всех головных элементов: <title>, <style>, <meta>, <link>, <script>, и <base>.

HTML <head>

Элемент <head> представляет собой контейнер для метаданных (данных о данных) и помещается между ними. Тег <html> и тег <body>.

Метаданные HTML — это данные о документе HTML. Метаданные не отображаются.

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


HTML <title>

Элемент <title> определяет заголовок документа и является обязательным во всех HTML документах.

Элемент <title>:

  • Определяет заголовок на вкладке браузера
  • Предоставляет заголовок для страницы, когда она добавляется в избранное
  • Отображает заголовок страницы в результатах поиска

Простой HTML документ:

Пример

<!DOCTYPE html>
<html>

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

 <body>
  Содержание документа. …..
 </body>

</html>

Попробуйте сами »


HTML <style>

Элемент <style> используется для определения информации о стиле для одной HTML страницы:

Пример

<style>
 body {background-color: powderblue;}
 h2 {color: red;}
 p {color: blue;}
</style>

Попробуйте сами »



HTML <link>

Элемент <link>

используется для связи с внешними таблицами стилей:

Пример

<link rel=»stylesheet» href=»mystyle.css»>

Попробуйте сами »

Совет: Чтобы узнать все о CSS, посетите CSS Учебник.


HTML <meta>

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

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

Определение используемый набор символов:

<meta charset=»UTF-8″>

Определение описание вашей веб страницы:

<meta name=»description» content=»Бесплатные веб учебники»>

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

<meta name=»keywords» content=»HTML, CSS, XML, JavaScript»>

Определение автора страницы:

<meta name=»author» content=»Щипунов Андрей»>

Документ обновляется каждые 30 секунд:

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

Пример тега <meta>:

Пример

<meta charset=»UTF-8″>
<meta name=»description» content=»Бесплатные веб учебники»>
<meta name=»keywords» content=»HTML,CSS,XML,JavaScript»>
<meta name=»author» content=»Щипунов Андрей»>

Попробуйте сами »


Настройка области просмотра

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

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

Вы должны включить следующий элемент <meta> видового экрана на всех ваших веб страницах:

<meta name=»viewport» content=»width=device-width, initial-scale=1.0″>

В <meta> элемент viewport содержит инструкции для браузера о том, как управлять размерами страницы и масштабирование.

Часть width=device-width задает ширину страницы, соответствующую ширине экрана устройства (которая будет варьироваться в зависимости от устройства).

Часть initial-scale=1.0 устанавливает начальный уровень масштабирования при первой загрузке страницы браузером.

Вот пример веб страницы без мета-тега viewport и той же веб страницы с тегом viewport <meta>:

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


Без мета тега viewport

С помощью мета тега viewport


HTML <script>

Элемент <script> используется для определения клиентского Javascript.

JavaScript пишет «Привет JavaScript!» в HTML элемент с помощью:

Пример

<script>
function myFunction() {
  document.getElementById(«demo»).innerHTML = «Привет JavaScript!»;
}
</script>

Попробуйте сами »

Совет: Чтобы узнать все о JavaScript, посетите JavaScript Учебник.


HTML <base>

Элемент <base> задает базовый URL адрес и базовый целевой объект для всех относительных URL адресов на странице:

Пример

<base href=»https://schoolsw3.com/images/» target=»_blank»>

Попробуйте сами »


HTML Главные элементы

Тег Описание
<head> Определяет информацию о документе
<title> Определяет заголовок документа
<base> Определяет адрес по умолчанию или цель по умолчанию для всех ссылок на странице
<link> Определяет связь между документом и внешним ресурсом
<meta> Определяет метаданные о документе HTML
<script> Определяет сценарий на стороне клиента
<style> Найдете информацию о стиле документа

Для получения полного списка всех доступных HTML тегов посетите HTML Справочник тегов.


❮ Назад Далее ❯


Добавление метатегов HTML для поисковой оптимизации

Поисковая оптимизация (SEO) фокусируется на улучшении видимость страницы или сайта в результатах поиска. Базовый Техника SEO заключается в добавлении заголовка HTML и метатегов к источнику вашей страницы. Эти метатеги используются для определения информации описания и других метаданные, которые поисковые веб-системы и сканеры могут использовать при создании поисковые индексы и коллекции. Когда вы включаете контент на страницу с просмотрщиком веб-контента вы можете улучшить поисковую оптимизацию страницы, добавив заголовок и метатеги со значениями, полученными из сам веб-контент.

Об этой задаче

Примечание. Эта поддержка доступна с комбинированным накопительным исправлением 12 для HCL Web Content Manager версии 7.

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

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

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

Процедура

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

  1. Выберите одно средство просмотра веб-материалов в качестве основного средства просмотра на странице. Нажмите «Изменить общие настройки» и выберите значение для поля Отображаемый заголовок страницы в настройках портлета для вьювера.

    Переопределить заголовок HTML, необходимо выбрать значение, отличное от Использовать заголовок по умолчанию. Если вы хотите, чтобы значение заголовка пришло напрямую из веб-содержимого, отображаемого средством просмотра, выберите Выбрать от содержания. Этот параметр использует значение Display поле заголовка для элемента содержимого в Web Content Manager.

    После сохранения изменений заголовок страницы обновляется с новым значением заголовка. Например:

     <голова>
       Отображать заголовок отображаемого веб-контента
     
  2. Создайте настройки портлета для каждого желаемого метатега добавить в шапку страницы.
    1. Укажите предпочтение портала для имени мета ярлык.

      Например, чтобы добавить следующий метатег с именем keywords :

        

      Указать следующий параметр:

       meta.tag.name.1=keywords 

      Кому добавьте следующий метатег с атрибутом http-equiv :

        

      Указать следующее предпочтение:

       meta.tag.attribute.1=http-equiv 
    2. Укажите предпочтение портала для значения мета ярлык.
    3. Необязательно: Если значение метатега требует атрибут схемы, укажите атрибут схемы с помощью схема.мета.тегов. суффикс предпочтение.

      Например, чтобы добавить следующий атрибут схемы с значение W3CDTF :

        date" content="2000-01-01T12:00+00:00" схема="W3CDTF"/> 

      Указать следующее предпочтение:

       meta.tag.scheme.1=W3CDTF 

      формат и схема, которые используются для записи элементов даты и содержимого свойства, связанные с информацией о дате и времени, такие как LastModifiedDate свойство, зависит от мета имя атрибута тега. По умолчанию вся информация о дате и времени форматируется в соответствии с форматом даты, определенным спецификацией HTTP. формат, который используется для записи информации о дате и времени в других метаданных. tags — это формат данных и времени, рекомендуемый Всемирной Wide Web Consortium (W3C) по схеме W3CDTF.

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

Примеры

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

  • Установка значения метатега с пользователем, создавшим визуализированный содержание:
     meta.tag.name.1=DC.creator
    meta.tag.content.property.1=Создатель
     
    Результат:
      
  • Установка значения метатега с предустановленным текстом:
     meta.tag.name.1=DC.publisher
    meta.tag.content.text.1=IBM
     
    Результат:
      
  • Установка нескольких значений метатегов со значением по умолчанию для автор и значение текстового элемента descelement в отображаемый контент:
     meta.tag.name.1=автор
    meta.tag.name.2=описание
    meta.tag.content.element.2=descelement 
    Результат:
     
     
  • Установка метатега с атрибут http-equiv и значение дата, когда отображаемый контент был последним изменено:
     meta. tag.name.1=последнее изменение
    meta.tag.attribute.1=http-эквивалент
    meta.tag.content.property.1=LastModifiedDate 
    Результат:
     
     
  • Установка метатега с атрибутом схемы и значением даты рендеринга содержание было опубликовано:
     meta.tag.name.1=DC.date
    meta.tag.scheme.1=W3CDTF
    meta.tag.content.property.1=PublishDate 
    Результат:
     
     
  • Установка метатега и использование относительного URL-адреса для указания элемента содержимого изображения. Ты необходимо добавить `abs`, чтобы указать формат (например, meta.tag.content.element.format.x "=" abs ):
     meta.tag.content.element.1 TestImage
    meta.tag.content.element.format.1 абс
    meta.tag.name.1 CustomMetaTag 

    Примечание: полный URL должен быть включен в тег, начинающийся с ....> .

    Результат:

      

HTML (и мета) теги: какие из них важны для SEO?

HTML является краеугольным камнем Интернета.

Он определяет структуру веб-сайта и оживляет ваши страницы.

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

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

Поэтому в этом всеобъемлющем сообщении блога мы рассмотрим:

  • Что такое теги HTML (и как они работают)
  • Почему эти теги важны для SEO
  • 10 основных тегов HTML (+ атрибуты) и их использование

Давайте углубимся.

Что такое теги HTML в SEO?

Теги HTML — это короткие фрагменты кода на веб-странице, предоставляющие техническую информацию о ее содержании.

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

Вот как эти теги могут выглядеть в HTML-документе веб-страницы:

 
  Мой потрясающий тег title
  
  
 

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

HTML-теги, метатеги и атрибуты

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

1. Тег HTML — любой тег в HTML-документе, который предоставляет техническую информацию о странице и/или визуально настраивает ее содержимое для пользователей и поисковых систем. HTML-теги состоят из открывающих <> , закрывающих или пустых тегов (например, тег
) с определенной информацией между ними (например, заголовок h2):

 

Это заголовок моя веб-страница

2. Метатег — предоставляет контекстную информацию о странице в  раздел HTML-документа. Мета-теги видны только поисковым системам и веб-браузерам (например, мета-описание):

  

3. Атрибуты — предоставить дополнительную информацию о тегах HTML (или мета). Они состоят из специальных терминов внутри тега, которые могут влиять на его поведение, служить сигналом ранжирования или директивой для поисковых систем (например, alt=""  атрибут в теге ):

 

Почему HTML-теги важны для SEO?

HTML и метатеги (+ их атрибуты) указывают Google, о чем страница, как поисковый робот должен взаимодействовать с ее содержимым и следует ли (и как) отображать ее в поиске Google.

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

  1. Следует ли (и как) сканировать и индексировать страницу.
  2. Насколько релевантна (и оптимизирована) страница для определенных поисковых запросов.
  3. Как это должно отображаться в поисковой выдаче Google

Давайте немного разберем каждый из этих пунктов.

а) Сканирование и индексирование

Некоторые теги (например, метатеги роботов) управляют поведением поисковых систем и их процессом сканирования и индексирования.

Google поддерживает различные теги, которые могут указывать поисковым роботам ЕСЛИ или ЧТО следует сканировать, индексировать и ранжировать для поиска Google.

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

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

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

b) Релевантность и ранжирование

Теги в HTML-документе страницы помогают поисковым системам лучше понять содержание и его релевантность для определенных ключевых слов. Некоторые теги также служат факторами ранжирования в алгоритме Google.

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

Или, как сказал Гарри Иллиес (аналитик Google):

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

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

c) Видимость в поисковой выдаче

И последнее, но не менее важное: теги также могут влиять на внешний вид ваших страниц в поиске Google (а также на других платформах).

Например, тег заголовка и метаописание в заголовке страницы используются для создания простого фрагмента в поиске Google:

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

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

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

10 лучших HTML-тегов и атрибутов в SEO (+ лучшие практики)

1. Тег title

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

 
Что такое тег заголовка в SEO (и почему он важен)?
 

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

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

Добавление тегов заголовков в ваш страницы — это довольно простой процесс — если вы используете WordPress, вы можете просто установить один из популярных плагинов SEO (например, Yoast SEO) и создать тег заголовка для каждой страницы всего за несколько кликов:

Есть несколько вещей, которые вы должны помнить при написании (и оптимизации) тегов заголовков для поиска Google:

  • Будьте лаконичны – оптимальная длина тега заголовка должна быть в пределах 50 – 60 символов (или ~ 600 пикселей). Слишком длинные теги заголовков могут быть усечены (или полностью переписаны) Google.
  • Включить ключевое слово фокуса — постарайтесь естественным образом добавить ключевое слово фокуса в заголовок.
  • Сделайте привлекательный заголовок — создайте оригинальную и интересную копию с цифрами, специальными символами или сильными словами, которые могут привлечь больше людей на ваш сайт.
  • Добавьте свой бренд — не забудьте добавить название вашего бренда (или веб-сайта) в конце тега заголовка, отделив его дефисом (–) или вертикальной чертой (|) от остальной части копии.

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

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

 

 

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

Аналогично тегам заголовков, вы можете использовать один из популярных SEO-плагинов и создавать привлекательные описания для всех ваших важных страниц:

Вот несколько рекомендаций, которые следует учитывать при создании метаописаний:

  • Будьте краткими — рекомендуемая длина метаописаний составляет от 120 до 160 символов. Если описание слишком длинное, Google может обрезать ваш текст или создать собственное описание для страницы.
  • Будьте лаконичны (и описательны) — не забудьте предоставить метаописания, которые кратко суммировали бы ваш контент.
  • Создавайте уникальные копии — старайтесь создавать привлекательные метаописания, которые могут принести пользу пользователям Google и заставить их чаще нажимать на ваши страницы.
  • Включить основное ключевое слово — хотя это и не обязательно, вы можете попробовать включить ключевое слово в текст, чтобы оно выглядело более релевантным для пользователей.

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

Заголовки (h2, h3, h4 и т. д.) являются видимыми семантическими тегами HTML на странице, которые разбивают содержимое на отдельные разделы:

 

Это мой потрясающий главный заголовок страницы

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

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

«… когда дело доходит до текста на странице, заголовок является действительно сильным сигналом, говорящим нам: « Эта часть страницы посвящена этой теме…» (Джон Мюллер, Google Search Advocate)

Кроме того, хорошая структура заголовков на странице может влиять на объем органического трафика, поступающего из Google. Согласно исследованию, проведенному Semrush, страницы со сложными структурами заголовков (h3, h4, h5) оказываются более эффективными. лучше по сравнению с постами в блогах, в которых не было заголовков.

Правильно оптимизированные заголовки на странице также могут отображаться в виде избранного фрагмента (для определенных поисковых запросов):

При создании, редактировании и оптимизации вашего контента в текстовом редакторе WP обязательно придерживайтесь иерархической структура тегов заголовка:

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

4. Альтернативный атрибут изображения

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

  alt="маленький кусок пиццы на большой керамической тарелке"  > 

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

При правильно оптимизированных атрибутах alt="" некоторые из ваших изображений также могут появляться в поиске картинок Google – , что может привести к небольшому увеличению органического трафика для вашего веб-сайта :

В WordPress вы можете вручную добавлять альтернативные тексты ко всем вашим важным изображениям либо непосредственно в редакторе WP, либо в Медиа » Библиотека :

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

  • Будьте описательными — обязательно пишите актуальные и точные альтернативные тексты, которые четко описывают содержание ваших изображений.
  • Будьте лаконичны – замещающий текст не должен быть длиннее ∼125 символов. Поисковые системы и программы чтения с экрана могут игнорировать атрибуты alt, которые длиннее этого значения.
  • Включите ключевое слово фокуса — если это имеет смысл, вы можете осторожно добавить ключевое слово фокуса в свои самые важные альтернативные тексты. Однако не запихивайте ключевые слова в атрибуты alt просто так.

5. Атрибуты ссылки

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

 ссылающийся домен 

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

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

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

 KWFinder
KWFinder 

6. Метатег robots

Метатеги robots — это директивы, управляющие тем, как должна выглядеть страница просканированы и проиндексированы (и отображены) в поиске Google. Как и другие « метаданные », метатеги robots должны быть размещены в разделе страницы:

 
  
 

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

В зависимости от вашего веб-сайта вы можете применить метатеги robots к различным типам страниц и контента, например:

  • Дубликаты — вы можете применять метатеги robots к страницам, которые являются просто дубликатами друг друга.
  • Автоматически сгенерированный контент — в определенных ситуациях вы можете использовать какое-либо программное обеспечение, которое создает автоматически сгенерированный контент на вашем веб-сайте (например, для автоматических переводов, страниц результатов внутреннего поиска и т. д.). В подобных случаях важно заблокировать Google от посещения такого контента и избежать наказания со стороны алгоритма Google.
  • User-generated-content (UGC) — аналогично автоматически сгенерированному контенту, UG-контент может принести больше вреда, чем пользы, особенно если это просто низкокачественный контент, созданный случайными людьми в Интернете (например, длинные комментарии). , пользовательские ссылки и т. д.).
  • Пустые или недействительные страницы — последнее, но не менее важное: вы также можете запретить поисковым роботам посещать страницы, которые не представляют никакой ценности или просто не должны отображаться в поиске Google (например, страницы, находящиеся на обслуживании).

Метатег robots состоит из двух основных атрибутов: атрибут name=""  указывает, какие поисковые роботы должны «подчиняться» тегу (например, Googlebot), а атрибут content=""  указывает сканерам, как взаимодействовать с содержимым страницы.

В атрибут content="" можно поместить несколько важных значений (или правил): Поиск Гугл).

  • "nofollow"  – запрещает поисковым роботам посещать любые ссылки на веб-странице.
  • "noarchive"  – запрещает Google создавать кешированную ссылку на страницу в результатах поиска.
  • Вы можете разместить несколько метатегов роботов на одной странице или просто объединить их атрибуты в один тег:

     
     

    Метатеги Robots могут быть реализованы либо вручную, либо с помощью плагинов, таких как Yoast SEO:

    7. Тег Canonical

    Теги Canonical помогают поисковым системам, таким как Google, распознавать основные , каноническая версия страницы из остальных страниц, идентичных или просто очень похожих на нее:

       

    Например, у вас может быть страница продукта, которую можно посетить с нескольких URL-адресов (например, из-за параметров URL, которые используются для фильтрации):

     http://homepage.com/shoes/black-sneakers.html
    http://homepage.com/shoes/black-sneakers.html?Size=38
    http://homepage.com/shoes/black-sneakers.html??Size=38&color=black 

    В таких случаях важно сообщить Google, какой URL должен быть правильно проиндексирован и ранжирован как основной в поиске. (и какие версии следует полностью игнорировать).

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

    Rel=canonical теги приносят также несколько важных SEO-преимуществ, таких как:

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

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

    8.

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

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

      

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

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

    Для этого вы можете использовать такие инструменты, как Google Mobile-Friendly Test или Google Search Console, чтобы проверить, оптимизированы ли ваши страницы для мобильных устройств (и содержат ли они метатеги области просмотра):

    9.

    Структурированные данные

    Структурированные данные (или схематическая разметка) — это организованный набор тегов на странице, которые помечают контент дополнительной контекстной информацией:

    Внедрение структурированных данных на ваши страницы может обеспечить 2 основных преимущества SEO:

    • Это помогает Google лучше понимать содержание (и отображать его для более релевантных поисковых запросов).
    • Используется для расширенных фрагментов (которые могут повысить CTR ваших веб-страниц в поиске Google).

    Разметка Schema может применяться к различным типам контента (например, разметка « Рецепты », « HowTo », « События », « Продукт » и т. д.) и может значительно улучшить эффективность SEO.

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

    • Напишите разметку вручную — если у вас есть небольшой опыт кодирования, вы можете вручную написать и добавить структурированные данные на все свои страницы самостоятельно.
    • Используйте генераторы разметки — вы можете создавать структурированные данные с помощью помощника по разметке структурированных данных или средства выделения данных и размечать отдельные части вашего контента.
    • Плагины WordPress — плагины схемы, такие как Yoast SEO или Schema App, могут автоматически генерировать и внедрять структурированные данные для вас.

    10. Теги Open Graph и Twitter Card

    Open Graph (OG) и Twitter Card (TC) — это набор метатегов, которые используются для создания привлекательных фрагментов на платформах социальных сетей (например, Facebook, Twitter, LinkedIn и т. д.) :

     
     

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

    В зависимости от платформы, на которой вы продвигаете свой контент, вы можете рассмотреть возможность использования различных плагинов, таких как Yoast SEO или All-in-One SEO, для создания OG и TC.

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

    Ваш адрес email не будет опубликован. Обязательные поля помечены *