Оптимизация изображений для поисковых систем

Продвижение и оптимизация изображений

Некоторые сайты получают практически весь свой трафик с картиночного поиска Яндекса и Гугла. Но этот трафик вполне может доставаться не только картиночным сайтам, но и информационным и даже коммерческим. Главное — это правильно понимать все принципы продвижения.

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

Как действует поиск по картинкам

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

Алгоритмы анализа изображений Гугла и Яндекса в работе мало отличаются друг от друга. Первым шагом к продвижению картинок является соответствие содержания изображения и описания. Не стоит называть картинку «Зеленым слоником», если на ней изображена розовая пантера. Стоит отметить, что поисковые системы обладают продвинутыми системами сканирования картинок. Они были созданы для фильтрации нежелательного контента, в первую очередь с адалт-сайтов.

Вот вам пожалуйста небольшой отрывок:

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

Атрибуты тега img

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

Что такое атрибут alt

Атрибут alt — это часть html-кода, которая отвечает за альтернативный текст для изображения. И если изображение по каким-то причинам не загрузилось (например, в браузере отключены изображения), пользователю показывается текст из альта. Тег alt выводит текст раньше загрузки самого изображения, т.е. при медленной загрузке содержимого страницы пользователь также вначале увидит альт текст, который сменится самой картинкой.

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

Если подписать картинку «image_1», то атрибут alt будет иметь формальный, так сказать технический, характер, от которого в плане оптимизации картинки будет мало толку. Можно описать фото по чисто визуальным признакам — «парень в красной футболке». Alt текст вполне безобиден, но не подходит для коммерческого продвижения. Все-таки покупатель ищет не парней. Если учитывать, что в ассортимента магазина одежды могут присутствовать тысячи футболок разных брендов, текст «красная футболка» не совсем конкретен и врядли поисковик правильно определит вид запроса.

Старайтесь конкретизировать содержимое alt для картинок, указав необходимые характеристики для коммерческой привлекательности. Описание «мужская футболка адидас» вполне сгодится. Естественно, можно добавить модель. Укажите цвет, если их несколько для данной модели.

Оптимальное содержание атрибута alt должно состоять из 3-4 слов. В общем не более 250 символов. Не нужно занимать переоптимизацией, наподобие «мужская футболка адидас, красная футболка adidas для парней, купить недорого одежду адидаса». Поисковые машины не любят слишком длинный альт.

Что такое атрибут title для картинок

Атрибут title служит для картинки дополнительным описанием. Если alt предназначен больше для поисковых ботов, то в img title следует составлять текст, предназначенный для человека. У изображения ниже alt подписан как «айвазовский 9 вал». Чтобы увидеть описание title, следует навести мышку на изображение.

Если задача alt текста — предоставить роботу картинку под запрос, то title дает более полное представление об изображении. В описание тайтла можно написать больше слов, лишь бы это помогало пользователям. Присутствие alt и title учитываются поисковыми системами при ранжировании картинок.

Не следует использовать для альт и тайтл одинаковое описание. Поисковики не одобряют данное действие и могут наложить фильтр за такое «убийство двух зайцев».

Также не советую тупо писать ключи в стиле «спортивная одежда купить москва». Пишите всегда корректно с точки зрения русского языка — то есть в стиле «Купить спортивную одежду в Москве».

Оптимизация изображений

Помимо alt и title, важным элементом является текст, среди которого размещена картинка. Релевантность оптимизированного текста даст эффективный результат. Как вариант, можно составить описание сразу под картинкой. Если перейти по ссылке картинки примера, рассматриваемого в начале статьи, можно увидеть, что Гугл составил выдачу как раз по описанию, расположенном под изображением.

Некоторые оптимизаторы и вовсе не верят в силу продвижения картинок через alt и title, а делают ставку на оптимизированное описание, следующее сразу за изображением.

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

По моему опыту, самое эффективное действие для получения трафика к картинкам — это прописывание к ним подписей.

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

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

Согласно исследованию, которое мы проводили в Пиксель Плюсе, Яндексу пофиг на урл, но Гугл его вполне учитывает.

Особенности продвижения картинок

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

• [дом у моря фото];
• [логотип нефтегазовой компании];
• [политические карикатуры];
• [картины Айвазовского].

Также получить трафик с картинок можно при помощи общих запросов. Играют роль и праздники, а также прочие увеселительные мероприятия (Новый год, День святого Патрика, Хэллоуин, день студента), во время которых растет трафик через заходы по изображениям.

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

• Соберите большое количество картинок, в идеале уникальных и высококачественных. Пропишите ключевые слова как имена файлов для них, добавьте водяные знаки;
• Разместите у себя на сайте, причем без хотлинкинга;
• Пропишите ключи в alt, title, в подпись картинок, в текст, окружающий их;
• Убедитесь, что у вас работают лайтбоксы. В идеале, чтобы в раскрывающемся окне лайтбокса была возможность увеличения, поворота и других возможностей взаимодействия.

Обычно этих действий хватает, чтобы получить картиночный трафик.

Рабочие и нерабочие способы уникализации

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

Рассмотрим нерабочие способы уникализации картинок:

1. Изменение цветовой гаммы — в анализе поисковые системы не учитывают цвет картинки;
2. Масштабирование, растяжение-сжатие, обрезание — тоже не работают;
3. Рамка — в некоторых случаях рамка только помогает найти поисковикам дубли изображений;
4. Водяные знаки для придания уникальности также бесполезно ставить;
5. Контрастность/размытие — тоже не то;
6. Другой формат опять же не работает.

Технология проверки уникальности представляет собой определенную последовательность действий. Вначале снимается стандарт EXIF . Затем изображение преобразуется в черно-белый формат. Края обрезаются для отделения возможной рамки. Накладывается специальный DoG-фильтр, который проводит математические вычисления для определения уникальности. В финальной стадии осуществляется валидация.

Для закоса картинки под уникальность можно выполнить такие операции:

• сделать скриншот изображения;
• поворот картинки как минимум на 15-20 градусов;
• обрезание краев.

Поворот и обрезание краев без проблем осуществляется через Фотошоп. В результате любая заюзанная картинка превратится для ПС в уникальное изображение.

Чтобы проверить уникальность картинки, можно воспользоваться сервисом TinEye . Для примера возьмем url «Девятого вала» и вставим в графу поиска.

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

Как узнать, получает ли сайт трафик по изображениям

Получить статистику трафика по картинкам можно через панель вебмастера Гугла, а также с помощью Яндекс.Картинки.

Трафик по изображениям Гугла

Зайдя в панель вебмастера, следует нажать в меню «Поисковый трафик», а затем «Поисковые запросы». Выбираем фильтр «Изображение» для получения информации по конкретному трафику.

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

Если картинки закрыты от индексации, отчет будет отсутствовать.

Трафик по изображениям Яндекса

Что касается слежки за трафиком Яндекса, то мониторинг следует проводить через Метрику. Жмем “Источники” — “Поисковые системы”, раскрываем дерево меню.

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

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

Можно ли продвигать интернет-магазины картинками

Когда пользователь хочет купить материальный предмет, который важно увидеть для полноты оценки, на помощь приходят картинки. Мебель, одежда, техника, дома, предметы интерьера, авто… список можно продолжать и продолжать. В большинстве случаев потенциальный покупатель, в первую очередь, обращает внимание на картинку.

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

Проблемы с авторским правом

Защита авторских прав в рунете находится в подвешенном состоянии, технические способы защиты фотографий малоэффективны против более-менее прошаренных юзеров. Если вы хотите массово приобрести уникальные изображения, то стоит поискать в фотостоках. Фотостоки бывают бесплатные и платные. Хорошие изображения можно найти и там, и там. Поиск зависит от тематики, качества и бюджета. Приведу семь бесплатных популярных фотостоков, где можно найти нужные картинки:

• Pexels — множество фоток с лицензией ССО;
• Stocksnap — изображения ПК, ноутов, мобильных гаджетов;
• Unsplash — когда играет качество, а не количество;
• The Pattern Library — сток паттернов;
• ISO Republic — множество интересных фоток;
• Getrefe — изображения природы, городские пейзажи;
• Foodies Feed — фотографии еды.

А также некоторые платные базы с качественными фотографиями:

1. Death to the Stock Photo — как бесплатный, так и платный сервис. Все зависит от подписки. Бесплатная ограничена 10 фотками в месяц. За $15 лимит исчезает и предоставляется облако для быстрого скачивания.
2. DepositPhotos — более трех миллионов фотографий. Сайт поддерживает русский язык и принимает к оплате Вебмани и Яндекс.Деньги.
3. Fotolia — также имеет русский интерфейс, но не поддерживает популярные в рунете Вебмани. Можно оплатить через PayPal или банковскую карту/перевод.
4. Istockphoto — считается лучшим в мире фотостоком. Изображения проходят жесткую модерацию. В базе содержится больше восьми миллионов изображений в высоком качестве. Ситуация с оплатой аналогична с Fotolia.

Оптимизация изображений для поисковых систем

Фотографии и картинки — не только способ сделать сайт красивым визуально или представить контент в формате инфографики. Уделив внимание поисковой оптимизации изображений, можно получать дополнительный трафик из поиска по картинкам в Яндексе и Google.

1. Пункт 1. Заполните атрибут alt для всех изображений
2. Пункт 2. Добавьте подписи к фотографиям по возможности
3. Пункт 3. Создайте sitemap для изображений
4. Пункт 4. Используйте релевантные картинки
5. Пункт 5. Называйте файлы с изображениями осмысленно
6. Пункт 6. Используйте поддерживаемые расширения файлов
7. Пункт 7. Оптимизируйте вес изображений для быстрой загрузки
8. Пункт 8. Изображение должно быть качественным на всех типах устройств
9. Пункт 9. Создавайте оригинальный контент
10. Пункт 10. Микроразметка в поиске по картинкам
11. Пункт 11. Храните изображения на своем хостинге
12. Как посмотреть трафик с картинок
13. Кейс по оптимизации изображений

Смысл оптимизации фото в том, чтобы поисковики могли понимать, что изображено на картинке и ранжировать ее в поиске по соответствующему запросу. Продвижение в Яндекс.Картинках и Google Images особенно важно в тех тематиках, где пользователи часто прибегают к поиску фото для решения своего вопроса — например, Одежда, Мебель, Ландшафтный дизайн и т.д. В этой статье мы приведем 11 пунктов, необходимых для оптимизации изображений — чтобы поисковики «полюбили» ваши картинки. А также покажем, как анализировать трафик с картинок и поделимся своим кейсом.

Пункт 1. Заполните атрибут alt для всех изображений

Поисковые системы все еще не умеют хорошо распознавать графическую информацию, поэтому альтернативная подпись — значение атрибута Alt — помогает им лучше понять, что изображено на картинке. Этот атрибут также поможет пользователям при веб-серфинге с отключенными изображениями или если картинка не смогла быть загружена из-за низкой скорости соединения. Кроме того, люди с нарушениями зрения при просмотре сайтов часто используют программы-дикторы с экрана. Они зачитывают именно содержимое Alt, поэтому, если хотите обеспечить комфортный доступ к своему сайту, наличие этого атрибута необходимо. Если у вас много ссылок-картинок, то текст в Alt будет считаться текстом этой ссылки. Это важно для перелинковки страниц внутри сайта. Что писать в альте? Его содержимое должно кратко описывать изображение и не быть переспамлено ключевыми словами, как когда-то было очень популярно в SEO продвижении картинок. Подсказки по заполнению Alt Гугл дает в своих рекомендациях по работе с Google Картинками. Пример:

Неудачный вариант (злоупотребление ключевыми словами):
Более удачный вариант:
Лучший вариант:

Пункт 2. Добавьте подписи к фотографиям по возможности

На ранжирование картинок в Яндекс и Гугл влияет не только замещающий текст в alt, но и весь остальной текст со страницы. При этом наиболее важным будет тот, что расположен ближе всего к тегу . Для этого сделайте подписи к фотографиям, если это вписывается в дизайн. К некоторым картинкам — например, в слайдере — добавить поясняющую надпись будет сложно, поэтому сосредоточьтесь на важных изображениях в контенте. Визуально отделяйте подпись от текста страницы. В подписи можно не только описать изображенное, но и предоставить пользователям дополнительную информацию. Не стоит делать одинаковыми alt и подпись к фотографии.

Пункт 3. Создайте sitemap для изображений

Поисковый робот точно найдет и проиндексирует все нужные изображения, если указать ссылки на них с помощью файла sitemap.xml. Удобнее делать сайтмап для картинок отдельным файлом, но можно добавить ссылки на изображения и в существующий со своим пространством имен xmlns_image=»http://www.google.com/schemas/sitemap-image/1.1″. Оно одинаковое для Яндекс и Google, соответственно, достаточно сделать один sitemap, который будут понимать оба поисковика. Больше про формирование файла и описание тегов читайте в инструкции Яндекса или Google.

Пример кода

   http://example.com/primer.html http://example.com/kartinka.jpg Место съемки Заголовок Подпись к изображению  http://example.com/photo.jpg   

Если вы создаете отдельный файл, на который нет ссылки в корневом sitemap, то укажите ссылку на него в файле robots.txt с помощью директивы Sitemap или воспользуйтесь инструментами Яндекс.Вебмастер и Google Search Console — сообщите роботу о картиночном sitemap.

Пункт 4. Используйте релевантные картинки

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

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

Пункт 5. Называйте файлы с изображениями осмысленно

Google также советует давать файлам имена в соответствии с тем, что изображено на картинке. Например, если на детальной картинке на странице товара изображен миксер определенной модели, то лучшим названием для картинки будет “миксер-бренд-название модели.jpg”, а не “detail_photo.jpg” или ”big_image.jpg”. Значение имеет и структура хранения файлов. В руководстве по оптимизации изображений Google заявляет:

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

Пункт 6. Используйте поддерживаемые расширения файлов

Чтобы и поисковики, и пользователи не испытывали проблем с доступом к графическим файлам, используйте распространенные типы файлов. Для веб-сайтов это JPG, GIF, PNG, SVG или WebP. JPG — самый распространенный растровый формат, подходит для большинства изображений: фото товаров, сотрудников и т.д. GIF и PNG — чаще используются в случаях, когда нужно изображение с прозрачным фоном. При этом более современный PNG позволяет делать яркие и четкие изображения, но не поддерживает анимацию, в отличие от GIF. Для баннеров PNG может быть предпочтительнее JPG за счет особенностей сжатия изображения. SVG — формат векторной графики, используемый обычно для размещения логотипов и иконок. WebP — самый новый из перечисленных формат, предложенный компанией Google в 2010 году. Он обеспечивает то же качество картинки, что и JPEG и PNG, при гораздо более легком весе файла. При очевидных достоинствах, минус данного формата в том, что он пока не поддерживается браузером Safari.

Пункт 7. Оптимизируйте вес изображений для быстрой загрузки

• используйте сжатие: файлы в формате JPG могут быть уменьшены на 60-80% без визуальной потери качества. Для этого существует множество сервисов, в том числе бесплатных.
• настройте превью: например, для листинга товаров сделайте маленькие изображения 300х300 пикселей, а большие картинки загружайте только в карточках по клику.
• загружайте картинки по размерам: не ресайзьте одно и то же огромное изображение средствами HTML и CSS, а создавайте несколько размеров изображений под разные типы страниц.
• используйте скрипт отложенной загрузки: для страниц с большими изображениями при медленной скорости подойдет скрипт lazy load (“ленивая загрузка”). В этом случае картинки будут подгружаться с сервера только в том случае, если будет выполнено событие, инициирующее загрузку: клик, скролл или фоновая загрузка. Данный способ позволяет уменьшить начальный вес страницы, время загрузки, использование системных ресурсов и расход трафика у пользователя, что в целом положительно сказывается на производительности. При внедрении Lazy Load убедитесь, что контент будет доступен роботу.

Пункт 8. Изображение должно быть качественным на всех типах устройств

Одна и та же картинка будет выглядеть по-разному в зависимости от того устройства, с которого пользователь просматривает сайт: маленькое разрешение, отлично подходящее для смартфонов, будет смотреться значительно хуже на десктопах. Чтобы решить эту проблему, используйте адаптивные изображения.

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

Атрибут srcset позволяет указывать несколько версий одного изображения для экранов разных размеров.

Источник https://znet.ru/raskrutka/prodvigaem-kartinki-v-yandekse-i-google/

Источник https://liderpoiska.ru/blog/top-poiska-po-kartinkam/