title и meta description - то, что человек видит в результатах поиска и в заголовке вкладки браузера. title влияет на позицию в поиске и может показываться иначе, чем ты написал - Google сам решает, когда его переписать. meta description НЕ влияет на позицию, только на то, кликнут ли по сниппету. Open Graph вообще не про Google - это протокол Facebook 2010 года для превью при шеринге в соцсетях.
В этом уроке
Оба превью читают ровно то, что написано в коде - это не картинка-заглушка. Попробуй изменить текст в <title> или в content у description - превью обновится вслед за твоей правкой.
Заголовок страницы в HTML: тег title для поиска и вкладки браузера
title - самый важный сигнал на странице для поиска: именно он становится кликабельным заголовком в результатах и текстом вкладки браузера. Но показанный в поиске текст не всегда совпадает с тем, что написано в коде - Google прямо документирует, что может переписать title, если сочтёт его неточным, наполовину пустым, обрезанным или не соответствующим содержимому страницы. Жёсткого лимита символов у Google нет - заголовок просто обрезается под ширину экрана, а часто советуемые "50-60 символов" - это практическая рекомендация сообщества, а не официальное правило.
<title>Как заварить чай пуэр: пошаговый рецепт</title> - уникальный, точно описывающий содержимое страницы заголовок.
<title>Главная страница</title> - если такой title стоит на десятках страниц сайта, Google не может их отличить друг от друга по заголовку.
Описание страницы в HTML: meta description и его влияние на клики
meta description НЕ влияет на позицию страницы в поиске - это прямо подтвердил представитель Google в 2022 году. Но он часто используется как текст сниппета под заголовком - хотя Google оставляет за собой право заменить его своим текстом, если сочтёт, что описание не отражает содержимое точнее, чем сам текст страницы. Официального лимита длины нет, но ~150-160 символов - практическая рекомендация, чтобы снизить риск обрезки.
<meta name="description" content="Рецепт пуэра: температура воды, количество заварки, время настаивания."> - конкретное описание именно этой страницы.
<meta name="description" content="Добро пожаловать на наш сайт!"> - общая фраза без пользы: Google скорее всего проигнорирует её и сгенерирует сниппет сам из текста страницы.
Превью для соцсетей в HTML: теги Open Graph
Теги og:title, og:description, og:image - это НЕ стандарт Google или W3C: они управляют тем, как ссылка выглядит при шеринге в Facebook, LinkedIn, Slack, Discord и похожих сервисах, а не ранжированием в поиске. og:image - обязательное свойство протокола: если его забыть, превью при шеринге останется без картинки или с произвольной подставленной.
<meta property="og:image" content="https://site.ru/cover.jpg"> - при шеринге ссылки соцсеть покажет карточку с картинкой.
<meta property="og:title" content="Статья"> (без og:image) - карточка при шеринге останется без превью-картинки, что заметно снижает кликабельность в ленте.
Частые ошибки новичков
| Ошибка | Что происходит | Как исправить |
|---|---|---|
| Одинаковый title на многих страницах сайта | Google не может отличить страницы друг от друга по заголовку - страдает кликабельность в поиске | Писать уникальный title под каждую страницу |
| Общее "Добро пожаловать на сайт" вместо описания | Google скорее всего проигнорирует такое description и сгенерирует сниппет сам | Писать конкретное описание содержимого именно этой страницы |
| Забыть og:image | Превью при шеринге в соцсетях останется без картинки или с произвольной подставленной | Всегда указывать og:image - это обязательное свойство протокола |
| Считать meta description и og:description одним и тем же тегом | Это два разных тега для разных получателей (поисковики и соцсети), у них могут быть разные тексты | Заполнять оба тега отдельно, с учётом разной аудитории каждого |
Шпаргалка
| Тег | За что отвечает |
|---|---|
| title | Заголовок в поиске и вкладке браузера; Google может переписать, если сочтёт неточным |
| meta description | Не влияет на позицию, влияет на клики; Google может заменить своим текстом |
| og:title / og:description | Текст превью при шеринге в соцсетях - не про ранжирование в Google |
| og:image | Обязательное свойство Open Graph - без него превью останется без картинки |
Коротко: отвечаем на вопросы
Показывает ли Google всегда именно тот title, который я написал?
Нет. Google прямо документирует, что может переписать заголовок в результатах поиска, если сочтёт его неточным, наполовину пустым, обрезанным или не отражающим содержимое страницы - иногда вместо него используется og:title или другой заметный текст со страницы.
Влияет ли meta description на позицию в поиске?
Нет. Представитель Google прямо подтвердил в 2022 году, что meta description используется только как текст сниппета в результатах поиска и не участвует в ранжировании страницы.
Нужны ли отдельные Twitter/X-теги, если уже есть Open Graph?
Не обязательно. Если на странице нет собственных тегов twitter:title, twitter:description и twitter:image, X подставляет вместо них данные из соответствующих og: тегов - полный набор Open Graph обычно даёт приемлемое превью и там.
Почему при шеринге ссылки в соцсети не показывается картинка?
Чаще всего забыт og:image - это обязательное свойство протокола Open Graph. Без него соцсеть либо не покажет картинку вообще, либо подставит случайное изображение со страницы.
