Как оптимизировать изображения для сайта

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

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

В статье расскажем, как картинки влияют на SEO, а также как их правильно оптимизировать.

Принципы оптимизации

Для того, чтобы картинки правильно воспринимались поисковиком и индексировались, учитывают:

1. Качество и разрешение.

Высокое качество, разрешение 1200х800 пикселей в среднем – оптимальные критерии для ранжирования. Также, вставляют картинку в сжатом виде, чтобы пользователь открыл ее, а потом рассмотрел в улучшенном качестве.

2. Наличие alt-атрибута.

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

3. «Окружение».

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

4. Нет плагиату.

Уникальные фотографии для статьи – сигнал поисковику поднять вас в выдаче, как релевантный ресурс.

5. Скорость загрузки, адаптация изображений.

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

Что сделать, чтобы картинки сканировались и индексировались

Как улучшить SEO за счет визуальных элементов:

• Создайте ценность в медиа для посетителей при релевантном тексте, которому они соответствуют.

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

• Не забывайте о структурированных данных. Это помогает обозначать тип контента – товар, услуга или рецепт.

• Безопасный поиск. Функция, скрывающая материалы сексуального или жесткого характера. Если есть вероятность, что контент распознается так, то отделите их в структуре URL метаданными <meta name=»rating» content=»adult» />.

• Заполняйте атрибуты alt, title, подписывайте, называйте файлы.

Тексты в таких элементах влияют на ранжирование поисковиком, поэтому при заполнении проверяйте их тщательно.

• Создайте карту сайта для картинок.

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

БАННЕР SEO ПРОДВИЖЕНИЕ

Как влияет формат на SEO

Медиа в среднем занимает 21% веса страницы, поэтому стоит оптимизировать их размер.

Форматы бывают:

1. JPEG. Распространенный тип файлов, при сжатии сохраняет качество.

2. PNG. Качество сохраняет лучше, весит больше. Чаще используют для инфографики и для элементов дизайна.

3. BMP. Передает высокое качество, но не сжимает изображения.

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

5. SVG. Логотипы, значки и самые мелкие визуальные элементы. Универсальный, проблемы в стилях шрифтов. Не используйте встраиваемый формат, чтобы картинка легче индексировалась.

6. GIF. Весят много. Добавляет контенту привлекательности и увеличивает трафик. Сканируются также, как и прочие графические файлы.

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

Почему важен уникальный контент

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

Но иногда можно обойтись готовыми медиа, если знать, как сделать из них уникальные.

Распространенное наполнения сайта – стоковые изображения. Они не вредят ранжированию сайта, при выборе такого пути. Учитывайте, насколько органично такой контент впишется в ваш сайт и как такие картинки покажутся в сниппете.

Как сделать не похоже на оригинал:

• отразить зеркально, часто поисковик понимает, что контент не уникален;

• обрезка с изменением композиции;

• корректировка яркости, контрастности;

• применить фильтры и эффекты;

• удалить элементы на изображении.

Но, если вы все-таки создали контент для сайта, стоит его защитить. Для того, чтобы картинку не скопировали, используют метаданные. Также, существует общепринятый стандарт копирайта - IPTC Photo Standard.

С помощью него указывают:

• Имя автора, название компании. Кому принадлежит контент.

• Источник изображения.

• Значок копирайта. Для заявления об авторских правах.

• Права в интернете. URL с информацией о лицензии.

• Лицензиар. URL, где можно покупать право на использование медиа.

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

Атрибуты, структурированные данные

Что касается технической оптимизации, существуют следующие возможности:

• Загружать весь контент по мере прокрутки страницы. С помощью техники lazy load картинки могут загружаться асинхронно. Также можно хранить изображения в кэше, с помощью атрибута decoding, показывать так же по мере прокрутки.

• Пропишите несколько пропорций для каждого элемента для корректного отображения на любом экране. Понадобится атрибут srcset, где также можно указать миниатюры.

Сейчас многие CMS, например WordPress, включают встроенную адаптивность изображений. Атрибуты srcset и sizes автоматически заполняются после загрузки. Где такой возможности нет – нужно вручную задавать параметры.

• Связывайте текст в атрибуте alt с релевантными запросами. Текст понадобится для доступности контента, короткий и понятный, для отображения сути медиа. В alt добавляют ключи, но главное сделать это органично.

• Заполняйте title. Текст, который показывается при наведении курсора на элемент. Текст может быть больше, так как будет описываться контекст изображения. Не спамьте ключами.

• Подписывайте картинки. Туда можно добавить дополнительную информацию.

• URL делайте соответственным структуре сайта и его иерархии.

• Называйте файлы. Это тоже сканируется поисковиками. Поэтому такие названия должны быть информативными, не длинными, а слова разделяться дефисом.

• С помощью семантической разметки пометьте изображение как определенный тип контента – товар, услуга или видео. В поиске они будут отображены с различимым бейджем.

Оптимизация визуальных элементов улучшает поисковую видимость сайта и облегчает «общение» пользователя с контентом.