Такая работа с иллюстрациями и фотографиями важна для индексации и ранжирования всего сайта. Что сделать с картинками и на какой результат можно рассчитывать, расскажем в статье.
Как это работает?
Наличие или отсутствие иллюстраций само по себе не влияет на позиции в поисковой выдаче. Если только не портит впечатление и не мешает полноценно пользоваться сайтом. Как не сделать картинки лишними и даже вредными для продвижения, рассмотрим позже, а пока поговорим о положительном влиянии грамотно оптимизированных иллюстраций.
Уместные и правильно оформленные картинки и фотографии можно использовать для разных целей:
- попадание в поиск по картинкам в Яндексе и Google;
- размещение дополнительных ключевых слов на странице;
- повышение релевантности страницы;
- улучшение поведенческих факторов;
- автоматическое создание ссылок с картинкой при репостах в соцсетях.
И это не считая обычных функций иллюстраций — представление товаров, пояснение для текста, демонстрация чего-либо. К слову, видео тоже стоит оптимизировать с помощью описаний и понятного названия.
Проблема в том, что поисковые системы не так хорошо понимают изображенное на картинках, как обычный текст. И недостаточно просто выложить картинки. Нужно помочь роботам Яндекса и Google распознать и оценить иллюстрации. Разберем, как это сделать.
Выбор и оформление картинок
Изображения должны быть подходящими по смыслу и, по возможности, уникальными. Почему так? Первое понятно: размещать иные картинки бесполезно и бессмысленно. А уникальность не всегда достижима, например, при представлении товаров широкого потребления. Поэтому воровать чужие фотографии, конечно же, нельзя, но и гнаться за уникальностью любой ценой тоже не стоит.
Есть несколько самых простых способов показать поисковикам картинку и пояснить, для чего она здесь:
- Название. Не нужно оставлять имя файла вида «GFS1285757», замените его на понятное и описательное, например, «sobaka-na-sene». Это первый «намек» на содержание иллюстрации. Он же будет виден пользователям при наведении курсора на картинку. Но название не должно совпадать с заголовком страницы, если это не товар и не новостная публикация. При таких совпадениях роботы поисковиков могут решить, что картинка не нужна пользователям.
- Атрибут Alt. Это более полное описание картинки. Пользователи обычно его не видят, а поисковики читают. Достаточно нескольких слов (до 100-150 знаков в совокупности), не совпадающих с названием файла. Можно использовать ключевые слова, но осторожно и без вреда для смысла описания. И важно помнить, что этот текст появится на странице, если по каким-либо причинам не загрузилось само изображение.
- Подпись к картинке. Про нее не стоит забывать не только ради пользователей. Поисковики оценивают смысл и названия, и описания, и ближайшего к картинке текста. И этим стоит воспользоваться для придания странице большей релевантности.
Все это касается любых типов изображений — фотографий, рисунков, скриншотов. Но таких простых действий мало, если хочется использовать все возможности.
Техническая оптимизация
Это важно не только для взаимопонимания с поисковиками, но и для улучшения работы самого сайта. Что стоит сделать?
Уменьшение веса
Есть две причины использовать «легкие» файлы:
- роботы поисковых систем не тратят лишнее время при индексации и успевают проверить больше страниц и контента на них;
- посетители не ждут загрузки картинок.
Существуют разные программы для сжатия картинок, в том числе бесплатные сервисы. Оптимальным считается вес до 70 Кб.
Атрибут decoding=async
Если нужно еще больше уменьшить нагрузку при скачивании страницы, стоит использовать этот атрибут в базовой разметке для Lazy Load («ленивая загрузка»). Он указывает браузеру, что контент можно загружать асинхронно.
При последовательной загрузке вес картинок может существенно замедлить процесс, вплоть до того, что роботы поисковиков не успеют оценить всю страницу. И чтобы этого не произошло, стоит использовать указанный атрибут.
Атрибуты src и srcset
Они позволяют использовать картинки высокого качества без ущерба для скорости загрузки страниц:
- src — для самой крупной и качественной иллюстрации;
- srcset — для превью вариантов той же картинки других размеров.
В результате при открытии страницы браузер сможет выбрать подходящий вариант, исходя из типа устройства и скорости подключения пользователя. Это положительно скажется и на ранжировании, и на отношении посетителей к сайту.
Все рекомендованные варианты
Стоит позаботиться о выполнении рекомендаций по количеству вариаций размеров и соотношения сторон. Так картинки будут правильно отображаться при любых условиях. Если выполнить еще несколько действий.
Микроразметка
Стоит использовать все виды микроразметки, подходящие для картинок:
- Schema.org — для создания превью в сниппетах и корректного отображения фотографий в блоках быстрых ответов;
- Open Graph — для появления картинки при репосте в соцсеть (подробнее — в этой статье: https://m.promoteh.ru/articles/_aview_b787 )
URL картинки
Понятным может быть не только название и описание файла. Адрес картинки тоже стоит сделать читабельным на случай, если ей захотят поделиться. Это же касается иллюстраций, расположенных на других страницах.
Sitemap для картинок
Если иллюстраций много, удобно сделать для них отдельный файл Sitemap. Конечно, со всем вниманием, ничего не упустив. Новые картинки стоит добавлять сразу и в этот файл.
Когда ведение отдельной «карты» для картинок нецелесообразно, все равно не нужно забывать про общую «карту сайта». Картинки точно так же, как и другой контент, должны быть там.
Защита от воровства
Фактически защититься невозможно. Но есть способ сделать свой сайт первоисточником с помощью таких параметров стандарта IPTC (для Google):
- Artist или Creator (автор);
- CopyrightNotice (лицензия на использование картинки);
- Source, Credit (ссылки на источник).
Также можно использовать водяные знаки, но стоит убедиться, что они не мешают ранжированию из-за избытка текста на картинке.
Хранение на сервере
Наконец, все эти прекрасные оптимизированные картинки лучше хранить на собственном сервере или хостинге. Это исключает внезапные проблемы «на той стороне» и может ускорить работу сайта.
Как не навредить?
Все вышеперечисленные действия будут полезны, если выполнять их ответственно и аккуратно. Иначе можно получить такие неприятности:
- Переспам. Количество и качество ключевых слов в описаниях картинок оцениваются так же строго, как и при индексации текстов. Поэтому не стоит увлекаться. Лучше помнить, что содержимое тега Alt могут увидеть посетители сайта, причем, в любой момент.
- Лишний вес. Как уже говорилось, слишком «тяжелые» картинки могут помешать роботам поисковиков — времени на обход сайта у них немного, а такие иллюстрации грузятся долго. Как следствие, позиции страниц могут быть потеряны.
- Нарушение авторских прав. Просто не нужно брать чужие картинки без проверки лицензии на их использование. Благо, предложений на фотостоках более чем достаточно.
- Ошибки верстки. Чтобы картинки влияли на продвижение, стоит обсудить нюансы их размещения и с верстальщиком, и с оптимизатором. К примеру, без адаптации под мобильные устройства хороших позиций в поисковой выдаче не будет, а значит, нужно грамотно выложить и описать картинки с учетом Mobail-first indexing.
Также стоит не забывать про Sitemap и robots.txt, следить за скоростью загрузки новых картинок, проверять корректность ссылок на них и т. д. Словом, относиться к изображениям как к важной и очень нужной части контента.
Результаты для людей и поисковиков
Итак, если картинки правильно оптимизированы, они помогут:
- получить новый поток трафика из поиска по картинкам и соцсетей;
- улучшить ранжирование страниц с полезным и интересным контентом;
- улучшить поведенческие факторы сайта и, как следствие, позиции в поиске;
- и, конечно, повысить конверсию.
Поэтому стоит уделять картинкам больше времени и воспринимать их не только как украшение. Они могут быть полезны и с технической точки зрения.
