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

Сниппет

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

У некоторых сайтов в поисковой выдаче Google и «Яндекс» иногда появляется не только заголовок и описание, но и дополнительная информация. Выдача конкретного сайта вместе title и description называется «сниппетом».

Сниппет (англ. snippet — отрывок, фрагмент) — фрагмент исходного текста или кода программы, применяемый в поисковых системах, текстовых редакторах и средах разработки.

На что влияет сниппет

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

Как повлияет на то что формируется в сниппете поисковиками

Как уже упоминалось выше: сниппет создается поисковыми роботами автоматически и зависит о того или иного введенного пользователем запроса. Система генерирует его по своим неизвестным никому правилам. Но известно что, сниппет состоит из заголовка, описания, ссылки url для перехода на сайт и Favicon. Это базовые элементы сниппета. 

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

Отличия выдачи Яндекса и Google которые стоит учесть при написании метатегов

Сниппеты «Яндекса» и «Google» различаются. В Google система чаще всего использует метатеги заголовка и описания. Особенно если они релевантны содержимому страницы. В ином случае система формирует их сама (возьмет отрывки текста из страницы и h1). «Яндекс» же добавляет к сниппету картинку Favicon и показывает чат. 

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

Все правила составления

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

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

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

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

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

Объем. Надо найти золотую середину. Короткие описания могут не восприниматься поисковиками, а слишком длинные — обрезаться. Оптимальная длина: 140-250 символов без пробелов.

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

Коммерческое предложение. Если вы продвигаете коммерческий ресурс, то включите в описание то, что выделяет вас среди конкурентов.

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

Использование цифр или символов

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

Правила написания метатегов

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

1. Прописать шаблоны генерации метатегов. Шаблоны используются в интернет магазинах для оптимизации мета-тегов:

• страниц категорий;
• страниц фильтров;
• карточек товаров;
• любых разделов с большим количеством однотипных страниц.

1. Вручную прописать метатеги:

• для главной страницы;

• для точечной оптимизации выбранных страниц;

• если невозможно применить шаблоны метатегов.

Как проверить мета-теги на странице:Существует огромное количество инструментов для просмотра метатегов страниц сайта. Рассмотрим самые известные.

Онлайн-инструменты

1.1. Расширения для браузера: SEO META in 1 CLICK

1.2. Букмарклеты: Мета теги страницы

Оба инструмента позволяют проверить основные on-page параметры нажатием одной кнопки;Однако не подходят для работы с более чем одной страницей.

Десктопная программа Netpeak Spider

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

Рекомендации от Google по использованию мета-тега Description

МЕТА-ТЕГ Description

Особый колонтитул для первой страницы не работает. word убрать колонтитулы с последней страницы документа Придумайте краткое описание для каждой страницы Метатег <description> дает поисковой системе краткое описание содержимого страницы. Если в теге <title> мы использовали одну фразу, то в <description> мы уже можем написать пару предложений или небольшой параграф. В наборе инструментов для веб-мастеров Google есть удобный инструмент для анализа контента, который поможет вам подсказкой, если ваши метатеги <description> слишком длинны/коротки или слишком часто повторяются (та же функция доступна для тегов <title>). Так же как и тег <title>, метатег <description> размещается внутри тега <head> html-страницы. Значение метатега <description> для оптимизации поиска Метатеги описания важны потому, что Google может использовать их при создании сниппетов к вашему сайту. Заметьте, мы говорим “может”, потому что Google может выбрать для сниппета другой подходящий текст с вашего сайта, если он более релевантен запросу пользователя. Так же Google может использовать описание вашего сайта из проекта Open Directory, если ваш сайт в него включен. Добавление метатегов <description> поможет Google и в том случае, если поисковый робот не может самостоятельно найти подходящий текст для сниппета. В центральном Блоге для Веб-мастеров есть полезная статья об улучшении сниппетов с помощью метатегов <description>. Слова в сниппете выделяются жирным, если они соответствуют поисковому запросу пользователя. Таким образом, пользователь получает представление о том, что ожидает его на вашей странице.

Кратко и точно опишите содержание страницы Постарайтесь сделать описание страницы интересным и содержательным для пользователей, которые увидят его в качестве сниппета на странице поиска. Не советуем: вставлять в тег <description> описание, не соответствующее содержимому страницы; использовать общие слова в описании, например “это моя страница” или “страница про открытки”; наполнять тег <description> ключевыми словами; вставлять в тег <description> полный текст страницы.  Создайте уникальное описание для каждой страницы Уникальное описание каждой страницы полезно как для поисковой системы, так и для пользователей: например, если в результатах поиска появятся несколько страниц вашего домена (в особенности при поиске с оператором site:). Если на вашем сайте тысячи и миллионы страниц, то проставить описания вручную чаще всего невозможно. В этом случае вы можете автоматически создать описание каждой страницы на основании ее содержимого. Не советуем: использовать одно и то же описание для всех или почти всех страниц вашего сайта. Используйте тег описания для того, чтобы предоставить краткое содержание ваших страниц как поисковым системам так и пользователям.

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

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

Alt и Title – атрибуты для картинок: как инструмент оптимизации контента

Для большинства вебмастеров размещение изображений на веб-сайте – процесс простой и привычный, однако существуют возможности, на которые некоторые предпочитают не обращать внимания. К примеру, атрибуты Title и Alt: что это такое, знают многие, но пользуются ими далеко не все. Тем не менее, это важные параметры, которые способны повлиять и на оптимизацию сайта, и на восприятие ресурса посетителями, особенно в случаях, когда скорость интернета не позволяет им посмотреть изображение. Этими атрибутами пользуются не только люди, но и поисковые алгоритмы, и их использование позволит улучшить позиции сайта в рейтинге «поисковиков».

Что такое Alt и Title для картинок

Атрибут Alt – это описание изображения в теге <img> в виде текста, представляющее собой альтернативный источник информации для пользователей, у которых в браузере отключено отображение картинок на странице. Текст атрибута появляется в том месте, где должно было быть изображение, которое не удалось загрузить. Также данный атрибут считывается роботами поисковых систем в процессе индексации страницы.

Атрибут title – это текст подсказки в теге <img>, предоставляющий пользователю дополнительную информацию об изображении. Текст картинки отобразится, если пользователь наведет на нее курсор мыши и задержит на несколько секунд.

Как правильно составить атрибут Alt для картинок

• Оптимальное количество слов – 3-5, но длина текста тега не более 75-80 символов. Мы рекомендуем использовать краткую и сжатую, но содержательную информацию.
• Обязательное условие – использование ключевых запросов.
• Ключевые слова лучше употреблять в именительном падеже, чтобы облегчить поиск.
• Избегайте спама: мы не рекомендуем перечислять большое количество ключей через запятую, как и в других тегах.
• Необходимо, чтобы Alt относился к тексту страницы и описывал то, что изображено на картинке.

Прописывать Alt для картинок есть смысл для привлечения посетителей из поиска по картинкам. Но думать, что такая оптимизация поможет взобраться сайту выше в поисковой выдаче – заблуждение. Стоит больше внимания уделять вхождению ключей непосредственно в текст страницы, если у вас оптимизированный сайт, но ему не удается попасть в ТОП. Добавление нескольких ключей в контент окажет больший эффект, нежели уникальные альтернативные описания.

Как правильно составлять Title для картинок

• Атрибут Title должен соответствовать изображению, т.е релевантным. Не следует писать в нем то, что не имеет к картинке никакого отношения. Иначе это оттолкнет пользователей.
• Лучше использовать небольшой по длине Title для удобства пользователей – никто не захочет читать километровую подсказку к картинке. Она должна состоять не более чем из 3-5 слов либо содержать до 250 символов.
• Желательно наличие ключевых слов. Не стоит употреблять такие слова, как «фото», «картинка» и т.д., ведь и так понятно, что это такое. Поисковым системам, по сути, все равно, что вы укажете в данном атрибуте ключевое слово. Но для пользователей это лишний сигнал о релевантности контента введенному запросу. Главное, чтобы ключи отвечали содержанию страницы и описывали изображение. Не допускайте переспама.
• Желательно, чтобы title картинки не повторял title страницы, h1, h2 и прочие подзаголовки. Да, добиться полной уникальность иногда сложно, однако разбавляющие слова добавить не так и сложно.
• Нет разницы, писать текст в теге с маленькой или с большой буквы. Со временем в поле title можно вносить изменения – когда боты переиндексируют страницу, измененные описания учтутся

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

Тем более, когда пользователь не может понять, что именно изображено на картинке. 

Правильно заполненные атрибуты Alt и Title к картинкам помогут в поисковой оптимизации сайта. Но не стоит забывать и про другие аспекты оптимизации картинок, такие как «вес», качество и название изображений. 

Что писать в теге meta description?

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

Как правильно заполнить meta description:

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

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

Релевантность. Meta description должен соответствовать той информации, которая находится на странице

Не стоит стараться привлечь внимание пользователей, использую в своих мета-описаниях заголовки из желтой прессы;

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

Делайте мета-описания размером не менее 100 символов;

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

Ключевые фразы. Ключевые слова не просто могут, они должны присутствовать в мета-описании каждой страницы. 1-3 ключевых слова в description — хорошая практика. Основное ключевое слово старайтесь разместить в первом предложении.

Обобщение. Мета-описание должно обобщать всю самую ценную информацию на странице. Систематизируйте информацию, разбросанную по странице. Например, для карточки товара это может быть краткое описание товара, цена, производитель, состав, доступные характеристики. Для информационной статьи: основная тема, автор, дата публикации;

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

Актуальность. Мета-описание должно соответствовать актуальной информации на странице. Если вы редактируете содержание странице, поддерживайте в актуальном состоянии и description.

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

Есть ли различия в составлении meta description для разных поисковых систем: Яндекс и Google? Давайте попробуем найти отличия в сниппетах и рекомендациях по составлению мета-описаний.

Примеры: хороший/плохой description

Для наглядности описанных выше правил и ошибок, давайте рассмотрим несколько примеров с корректными и некорректными meta description.

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

Плохой. Автоматически сформированное описание из отрывков текста на странице. Казалось бы, один из лидеров рынка электронной коммерции — компания OZON. Неграмотный description налицо.

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

Стоит отметить, что представленные данные актуальны на момент написания статьи.

Хороший. По запросу «курсы английского языка» можно увидеть достойный сниппет. Ключевое слово находится в начале описания. Указан метод обучение и первые сроки получения результатов. Описан формат прохождения курса. В конце описания Call to action (призыв к действию).

Плохой. Очень короткое, не содержательное описание, которое не дает пользователям никакого представления о  школе, кроме географической принадлежности.

Почему Яндекс и Гугл берет не description, а текст со страницы

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

В случае с Google есть два варианта
решения проблемы:

запрет для каталога на замену сниппетов. Для этого добавляют специальную директиву;
пересмотр описания сайта в каталоге

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

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

Указание на нужный фрагмент будет
проще при соблюдении таких требований:

1. Description дополняет title, но не может заменять его полностью;
2. Первое ключевое слово желательно ставить в первом предложении, ближе к абзацу;
3. В тексте нужен дополнительный абзац объёмом до 240 символов. Главное – чтобы он подходил по смыслу, не выделялся из структуры;
4. В этом абзаце тоже размещают КС.

15 great meta description examples to inspire you

Since you only have 160 characters to work with, writing a great meta description takes more than just throwing a few words together. To help you get your creative juices flowing, here are some meta description examples for your inspiration.

1. Tesla

Why it works: In just 22 words, Tesla’s description conveys what the company represents, what it produces, its brand values, and ambitions. Now, that’s great copywriting.

2. Lonely Planet

Why it works: Well, do you love travel? Starting with a question draws readers in, making the description personal. It goes on to explain exactly how Lonely Planet helps travelers, all within the 160 character count.

3. reddit

Why it works: reddit not only includes its company mantra – the best of the internet – in its description, but also provides a clear explanation of what it provides, along with the word “you” at the end for an added personal touch.

4. Wired

Why it works: For this article meta description, Wired teases readers, describing reddit as a former “dystopian Craigslist,” before going on to say it has grown up. Intrigued? Try not to click through, I dare you.

5. Travel Yosemite

Why it works: Brief and straight to the point, this meta description clearly explains the value of the Travel Yosemite site and what visitors can expect when they click the link.

6. GQ

Why it works: While the meta title is cut, this meta description examples perfectly fits the recommended character count, teasing visitors with a fun fact from the article.

7. LinkedIn

Why it works: This meta description is LinkedIn’s standard paragraph for all LinkedIn business pages, simply swapping out the company name. The first sentence clearly explains the page’s value while the rest of the description provides a call-to-action for LinkedIn.

8. The Verge

Why it works: Explaining a complex new story can be tough when you only have 160 characters to work with. But The Verge nails it with this succinct and descriptive tag.

9. Typenest

Why it works: Okay, disclaimer – I wrote this meta description for one of my clients. I’m going to toot my own horn and say this description is friendly – perfectly matching Typenest’s brand values – but also compelling. I mean, who wouldn’t want to click through to find out more?

10. Semplice

Why it works: Straightforward, descriptive, and no-nonsense, Semplice’s meta description tells you exactly what you’ll get when you click through.

11. Bendigo Bank

Why it works: Bendigo Bank embraces its brand identify, reaffirming its ethos and values while also telling visitors why they’re different from other banks.

12. Frito-Lay

Why it works: It’s hard not to crack a smile when you read Frito-Lay’s description. It’s short, sweet, and creative, telling visitors they’re in for something fun if they click through.

13. Taco Bell

Why it works: Emotion sells, and Taco Bell nails all the feels in its meta description. Plus, it includes a simple call-to-action, using visitors to click through for offers and even order food now.

14. Uber

Why it works: For a company that is basically a taxi service, Uber manages to slip in some aspirational words, explain what it offers to drivers, and what it offers to riders, all in 160 characters.

15. Hunting for George

Why it works: With the end of the financial year fast approaching in Australia, Hunting for George has done the smart thing and updated its meta description accordingly. The emojis as a nice touch and are eye-catching in search results.

Яндекс: рекоммендации по meta description

Яндекс рекомендует заполнять description, однако, использует его при формировании сниппета наравне с остальным текстом на странице.

Оптимальный description, который помещается в сниппет до 230 символов. В Яндексе он гораздо больше по объему, чем в Google.

В Яндексе есть еще одна особенность — расширенное описание, которое вмещает в себя до 465 символов.

Оно отображается по клику на кнопку «Читать еще», если пользователь хочет подробнее ознакомиться с описанием страницы.

Также стоит отметить, что описание может влиять на релевантность сниппета в коммерческой тематике. Именно сниппета, а не страницы. Это относится к расширенным сниппетам с адресом или, например, онлайн-чатом, которые начал поддерживать Яндекс еще до перехода пользователя на сайт.

Более подробно рекомендации яндекса по составлению мета-описаний можно прочитать в официальной справке.

Как заполнять Description в вордпресс? Прописываем дескрипшен…

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

или другой вариант, который подсмотрел на блоге Маргариты – Секреты домоводства:

“Наиболее полный пошаговый рецепт приготовления узбекского плова с говядиной. Подробное описание позволит с легкостью приготовить настоящий узбекский плов”

Знаете, здесь также можно упоминать пару ключевых фраз, но делать это агрессивно не рекомендуется. Опять же, это тот случай, если мета описание указываете вручную. А если оно у вас будет автоматом формироваться по открывку записи, то смысла о нем задумываться нету. Гораздо правильней задуматься о вступлении… Потому как, первые 120 символов пойдут на мета описание, и при этом… то как начинается ваша статья – весьма привлекательно для посетителя. И всегда в приоритете думать о контенте.

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

Например, так:

Рекомендации по заполнению мета description

Уникальность и полезность описания

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

Точное мета описание

Информация в этом поле, должна быть релевантной и не вводить заблуждение пользователей. Так, многие злоупотребляют этим полем, стараясь повысить кликабельность сниппета, намеренно применяя кричащие слова – Кликай, Здесь, Жми. Но злоупотреблять этим не нужно. Скорее даже – не делайте так. Информация должна быть емкой и точно соответсвовать странице. Если речь про пельмени, то описание соответсвующе. Указывать информацию про вареники в дескрипшен статьи о пельменях, будет не совсем правильно

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

Длина мета описания

Не используйте короткое описание в пару слов. Ведь в рамках короткого словосочетания – не получится изложить суть страницы, которую правильней рассмотреть в 1-3 предложений. Удобно, что в плагине Yost SEO имеется специальная зеленая шкала, помогающая определить оптимальную длину. Но брать это за точное правило – также не правильно. Каждый раз, длина мета описания может быть разной. Но если оно будет опредлеенной длины – это не является ошибкой. До 150 символов будет оптимально.

Не злоупотребляйте кричащими словами

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

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

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

Сказать, что так нужно делать обязательно – не думаю. Но если хотите, в некоторых случая можете проводить эксперименты со своими статьями. Например, находясь на 7 или 9 позиции, и получая трафик на статью, попробуйте указать метаописание с 1-2 спецсимволами, и проверить эффективость. Вдруг, статья поднимется на пару позиций выше.

Бонус. Иконки для мета тега Description

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

Правой кнопкой мыши…

Всем отличного настроения и до новых встреч!