В этой статье расскажем о SEO-продвижении картинок сайта в Яндексе и Google. Изображения не только выполняют эстетическую функцию, улучшая восприятие информации, но и могут быть дополнительным источником трафика. Чтобы его получить, необходимо оптимизировать фото под требования поисковых систем.
-
Советы по SEO-оптимизации
- Используйте информативные изображения
- Не забывайте об авторских правах
- Уделяйте внимание названию файлов
- Оптимизируйте скорость загрузки страниц с помощью дополнительных инструментов
- Адаптируйте изображения для мобильных устройств
- Заполните ALT и Title
- Используйте модуль Custom ALT и Title, если на сайте большое количество товаров
- Делайте дополнительные описания
- Используйте инструменты Sitemap или Schema
- Отдайте предпочтение правильным форматам
- Задавайте размеры самостоятельно
- Защитите наполнение от кражи
- Анализ с помощью сервиса WebSite Auditor
- Заключение
- Вопрос-ответ
Советы по SEO-оптимизации
Пользователь не всегда успевает прочитать текст или заголовок, но иллюстрацию он заметит сразу. Если она его заинтересует, то он начнет читать ваш материал. Поэтому важным условием является не просто наличие графических единиц, но и их качество и соответствие тематики статьи или коммерческого текста.
Например, если вы продвигаете блог, подбирайте интересные дополнения к анонсам постов. Необычные и качественные визуальные элементы позволят привлечь внимание пользователей, улучшить кликабельность и глубину просмотров.
В зависимости от тематики бизнеса они могут содержать юмор, текст с значимой информацией, фотографию человека, о ком написан материал, предмет, о котором рассказывается в статьи и т.д.
Используйте информативные изображения
Отбирайте те, которые дополняют информацию, изложенную в тексте. Например, если вы пишете о банкротстве юридических лиц, то не стоит прикреплять пейзаж. Такое решение введет в заблуждение пользователей, а трафик, который будет идти с графики, на вряд ли будет целевым.
Также если вы пишете сложную техническую статью про устройство железнодорожных путей, следует подбирать или самостоятельно разрабатывать различные схемы, отображение маркировок, крепления. Так пользователю будет легче освоить материал, и если ему понравится ваше изложение, он обязательно подпишется на рассылку, чтобы не упустить публикацию новых постов.
Не забывайте об авторских правах
Используйте только уникальные иллюстрации. Для их поиска вы можете пользоваться бесплатными или платными стоками. Только обязательно необходимо скачивать помимо фото еще и лицензию. Также вы можете трудоустроить штатного дизайнера, который будет разрабатывать картинки, подходящие под дизайн портала.
Очень важно соблюдать закон об авторских правах. За его несоблюдение можно получить штраф. Если вы не хотите, чтобы и с вашего сайта копировали материал, добавляйте водяные знаки. Так вы быстрее докажите свое авторство и получите компенсацию.
Уделяйте внимание названию файлов
Очень часто они содержат набор различных цифр и букв (fgfhoto123.jpg), это происходит из-за того, что оптимизаторы их в спешке сохраняют на компьютер и также быстро размещают на площадке.
Но мы рекомендуем оптимизировать названия файлов, например, отражать суть того, что показано (modnye_tufli..jpg, sudebnoe_zasedanie.jpg и тд).
URL изображения в ЧПУ виде гораздо лучше проинформирует пользователя или поискового робота о том, что отображено на картинке. Что может хорошо сказаться на ранжировании.

Оптимизируйте скорость загрузки страниц с помощью дополнительных инструментов
Если вы обнаружили, что ваш портал очень долго загружается, то вам может помочь сжатие всех фото, особенно если они имеют очень высокое разрешение и весят больше 200 КБ. Для их сжатия подойдет сервис, например, Iloveimg.
Разберем инструкцию по использованию инструмента.
Добавляем файл, который необходимо сжать:

Ждем несколько секунд и получаем результат:

Также у Google есть собственный разработанный формат — WebP. Помимо того, что он имеет низкий размер файлов, он сохраняет хорошее разрешение. Поэтому для оптимизации скорости загрузки страниц можно попробовать изменить формат на WebP. Но стоит учесть то, что не все браузеры его поддерживают, поэтому стоит предусмотреть и резервные варианты — JPEG, PNG.
Указать нужный формат в инструменте.

Добавить элемент, который нам нужно переконвертировать.

Кликнуть на кнопку «Начать» и ждать результат.

Скачать в новом формате.

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

Заполните ALT и Title
Данные атрибуты помогают понять пользователям и поисковым системам, что демонстрируется. Правильно оптимизированный альт позволит вашим визуальным элементам участвовать в поиске по картинкам в Яндексе и Google. Этот атрибут нужен для того, чтобы роботы при обходе ресурса понимали, что присутствует на том или ином фото.
Яндекс




Title, наоборот, предназначен для пользователей. Он выводится при наведении курсора на объект и представляет собой краткое описание того, что изображено. В SEO этот тег не используется, но может быть полезен для юзеров, например, при плохой загрузке или при наличии в статье битых иллюстраций.
Как заполнить ALT
Так как это важный SEO-атрибут, то его нужно оптимизировать по требованиям поисковых систем.
- переспам (наличие одинаковых слов);
- ключевых слов (за их чрезмерное употребление можно попасть под санкции);
- орфографических ошибок.
Он должен описывать то, что происходит на картинке. Описание лучше не делать больше 3-4 слов.
Как заполнить Title
В идеале этот атрибут не должен пересекаться с альтом, чтобы минимизировать переспам на сайте. Он может содержать более общую информацию о фото.
- Alt: юрист смотрит документы;
- Title: юриспруденция.
Как найти страницы, где пропущен ALT или Title
Проанализировать иллюстрации, у которых отсутствуют атрибуты удобно через сервис «Лабрика». Это платный сервис, который выявляет технические ошибки и проблемы в оптимизации контента, а также проводит анализ коммерческих факторов.
Чтобы посмотреть информацию по Альту и Title необходимо запустить проверку портала, дождаться результатов и перейти в раздел «Свободный отчет»:

Затем листаем до раздела «Изображения» и анализируем информацию.

Используйте модуль Custom ALT и Title, если на сайте большое количество товаров
Очень времязатратно заполнять вручную атрибуты на нескольких тысячах товарных позиций. Поэтому, чтобы упростить эту работу, можно использовать специальный модуль. В нем задаются определенные правила, на основе которых автоматически генерируются альты и тайтлы для всех изображений товаров.
Делайте дополнительные описания
Это еще один вариант, как показать поисковым роботам, что графика соответствует содержанию текста. Заполнять описание особенно важно, если на странице мало текста, а картинок очень много.
Например, такое встречается в статьях, где описывается стиль интерьера, приводится топ модных вещей в этом сезоне и так далее. В описание можно добавлять продвигаемые ключевые слова, но советуем этим не злоупотреблять и вписывать их очень органично, чтобы не попасть под санкции поисковых систем.
Используйте инструменты Sitemap или Schema
Если вышеприведенные советы не работают и поисковые системы так и не проиндексировали большую часть визуала, рекомендуем воспользоваться следующими вариантами.
- Sitemap.xml — улучшит индексацию;
- Schema.org — подтянет изображение в сниппет.
Разберем данные способы продвижения более подробно.
Sitemap.xml
Данный файл предназначен для поисковых роботов. Туда добавляются ссылки на все важные страницы сайта, которые необходимо проиндексировать.
При обходе ресурса бот часто учитывает информацию из sitemap, поэтому помимо разделов, туда можно добавить и адреса всех иллюстраций портала. Это улучшит их индексацию.
Для реализации данной задачи лучше обратиться к техническим специалистам, они разместят ссылки на контент с помощью специального контейнера и внедрят для них отдельный файл sitemap. Такой способ позволит увеличить видимость площадки, а также привлечь дополнительный трафик за счет появления графики в поиске по картинкам в Яндексе и Google.

Schema.org
Это специальная микроразметка для страниц, в которую вы можете подтянуть всю информацию.
Например, у вас интернет-магазин и вам надо добавить в сниппет не только описание товаров, цены, но и их изображения. Тогда вам просто нужно будет в разметку добавить url элемента, и тогда после переиндексации в поисковой выдаче будут отображаться и ваши товарные позиции.
<div itemscope=»» itemtype=»http://schema.org/Product»>
<span itemprop=»name»>Наименование товара</span>
<span itemprop=»url» href=»ссылка»></span>
<a itemprop=»image» href=»ссылка-на-изображение.jpg»></a>
<div itemprop=»offers» itemscope=»» itemtype=»http://schema.org/Offer»>
<meta itemprop=»price» content=»Цена товара»>
<meta itemprop=»priceCurrency» content=»RUB»>
<link itemprop=»availability» href=»http://schema.org/InStock»> </div>
<span itemprop=»description»>Описание товара</span>
</div>
Как выглядит сниппет, где в разметке указана ссылка на фотографию товара:

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

Задавайте размеры самостоятельно
При добавлении картинки, важно самому задавать их ширину и высоту. Если не задать эти параметры самостоятельно, то браузер будет сам подбирать их. Из-за этого могут возникнуть проблемы с отображением верстки, а фото будет больше экрана и приводить к горизонтальной прокрутке.
Для размещения можно использовать следующий код.
<img src=»buket-chvetov.jpg» width=»600″ height=»400″ alt=»красивый букет цветов» />
Защитите наполнение от кражи
- author (указывает автора):
- copyrightNotice (прикрепляется ссылка на лицензию);
- source (подтягивается ссылка на сайт).
Данную задачу лучше поставить на технического специалиста.
Анализ с помощью сервиса WebSite Auditor
Это отличный инструмент, чтобы проанализировать всю графику портала и увидеть проблемы на одном дашборде.
- битые файлы;
- отсутствие ALT.

Заключение
В этой статье мы рассказали все о SEO-раскрутке картинок, а также разобрали, какие форматы фото бывают и какие в большей степени подходят для продвижения.
- Визуал должен соответствовать тематике контента.
- Заполнение Альта нужно для привлечения дополнительного трафика.
- Элементы не должны быть слишком высокого разрешения, так как это тормозит загрузку страницы.
- Для улучшения индексации используйте файл sitemap.xml.
- Для увеличения кликабельности оптимизируйте сниппет с помощью Schema.org.
- Задавайте параметры самостоятельно.
Вопрос-ответ
Если будет прописан ALT, то оно будет участвовать в нем автоматически. Следует дождаться только индексации.
Одним из важных факторов является соответствие изображения контенту страницы, на которой оно размещено. Также значимым критерием является наличие Альта.
WebP, однако следует учитывать, что не все браузеры поддерживают этот формат.
Это удобно делать через сервис Iloveimg , для сжатия достаточно добавить картинку и дождаться результата. Затем можно быстро скачать сжатое фото.