Агентство поискового маркетинга
Украины №1 с 2006 года

Спасибо! Ваша заявка успешно отправлена.
В ближайшее время с вами свяжется специалист.

Закрыть

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

Оптимизация изображений для привлечения трафика  - фото 1

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

Существует два широко известных факта об оптимизации изображений.
 
1. Изображения не должны быть слишком «тяжелыми».
2. Нужно прописывать alt-теги.
 

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

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


1. Заполнение alt-тегов

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

Правда, в связи с развитием машинного обучения и искусственных нейронных сетей может справедливо возникнуть сомнение: а нужно ли вообще сопровождать изображения текстом? Дело в том, что искусственный интеллект и без того способен с высокой точностью распознать, что именно изображено практически на любой фотографии или рисунке. Чтобы убедиться в этом, достаточно зайти на сервис «Google Cloud Vision API» и на главной странице попробовать загрузить любую иллюстрацию. Поразительно, что распознавание происходит почти с идеальной точностью.
Есть ли смысл в такой ситуации добавлять к иллюстрациям подписи с ключевыми словами, заполнять alt-теги и делать что-либо вообще? 

На самом деле делать это нужно обязательно! Во-первых, алгоритмы нейронной сети работают с вероятностями, поэтому у поисковой системы всегда остается некоторая неопределенность. Успешное распознавание изображения обычно означает, что объект определен с вероятностью более 80%. Таким образом, с вероятностью 20% это может быть что угодно другое. Ясное описание в alt-теге снимает эту неопределенность и в итоге поисковая система будет уверена, что данное изображение можно показывать пользователям по определенным ключевым словам.



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


2. Осмысленные названия для изображений

Названия файлов могут дать поисковой системе дополнительную информацию, которую можно использовать в алгоритмах ранжирования. Гораздо лучше назвать файл «black-phone», чем «image0023». Тем более что это не требует больших усилий или много времени.

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


3. Подходящий тип файла

Практически все изображения в сети делятся на три категории по типу файла:
 
  1. JPG (самый популярный формат);
  2. PNG (формат, поддерживающий прозрачность);
  3. GIF (формат, поддерживающий анимацию).

Собственно правило здесь очень простое. Если не требуется прозрачность или анимация – используется JPG. Другие форматы используются только по необходимости. Формат PNG также иногда используется для вывода текста или чертежей, когда нужно достичь высокой четкости.
Почему это имеет значение? Каждый из вышеперечисленных форматов имеет свой метод сжатия и, как следствие, разный «вес». Форматы PNG и GIF сжимаются значительно хуже JPG. Одно и то же изображение, сохраненное в разных форматах и одинакового качества, сильно отличаться по «весу». Например, если фото в JPG имеет размер 50 kb, GIF будет уже около 150 kb, а PNG – 250 kb. Это влияет на скорость загрузки страницы.


4. Оптимальный размер изображений

Любой браузер способен как сжимать, так и растягивать изображения. Это позволяет загружать на сайт фотографии и иллюстрации самых разных размеров. Например, если сайт имеет размер 1024 пикселя по ширине, ничто не мешает разместить на странице картинку размером в 8000 пикселей. Браузер уменьшит изображение автоматически (по крайней мере, на большинстве сайтов). Но при этом пользователю все-таки придется скачать полноразмерное изображение, шириной в 8000 пикселей. В этом случае загрузка сайта будет происходить значительно медленнее, чем она могла бы быть.

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


5. Сжатие изображений

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

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


6. Карта изображений

Помимо карты сайта (sitemap), в которой перечислены страницы с контентом, существует возможность создать карту изображений. Суть остается прежней. С помощью особой разметки в файле указываются все ресурсы, которые требуется проиндексировать и которые должны участвовать в поисковой выдаче. В данном случае – изображения.

Что интересно, такая карта может вполне легально содержать изображения, располагающиеся на разных доменах. Представители поисковых систем объясняют это тем, что тем самым сохраняется возможность использования CDN (сетей доставки контента).


7. Версии для разных устройств

Адаптивный сайт, который подстраивается под размер устройства, фактически стал стандартом. Но разработчики зачастую упускают важный момент, касающийся изображений. Размер изображения в шапке сайта может составлять 1024 пикселей по ширине. Если пользователь заходит на такой сайт с устройства размером в 320 пикселей, он все равно вынужден загружать полноразмерное изображение в 1024 пикселей, которое затем будет уменьшено браузером. Это замедляет загрузку, ухудшает производительность страницы и негативно влияет на SEO.

Решение заключается в том, чтобы использовать разные версии изображений для различных устройств. Разумеется, подготовительную работу по созданию файлов для разных устройств должен взять на себя скрипт, который все сделает автоматически. В идеальном случае для каждого изображения следует сделать пять версий:
 
  1. Миниатюра (150px);
  2. Средний размер (300px);
  3. Выше среднего (768px);
  4. Большой (1024px);
  5. Полноразмерная иллюстрация (максимальная);

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


8. Разметка изображений

Структурированные данные (shema.org) чаще всего применяются для разметки контента не связанного с изображениями. Однако существует возможность внедрить микроразметку и для картинок. Это помогает поисковым системам лучше понимать каждую иллюстрацию, что позитивно сказывается на SEO. Пользователи станут находить такие иллюстрации в поисковой выдаче значительно чаще, и соответственно иллюстрации будут приносить реальный трафик.

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


9. Отложенная загрузка

Отложенная или «ленивая» загрузка – это довольно изящный способ значительно ускорить загрузку сайта, даже в том случае, если он содержит огромное количество иллюстраций. Изображения загружаются не сразу, а постепенно, по мере того как пользователь прокручивает страницу.
Это решение рекомендуется поисковыми системами. В частности сервис Google PageSpeed иногда дает такую рекомендацию с подробными объяснениями, как лучше ее реализовать.


10. Кеширование

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

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

Оставить заявку