Ни для кого не секрет, что использование картинок для сайта не только позволяет продемонстрировать товар или услугу, но и качественно продвинуть ваш сайт и его контент в поисковиках. На сайтах-каталогах посетитель сможет рассмотреть предложенный товар, и если картинка всецело представляет продукт, его купят или как минимум рассмотрят для покупки. Для статей важно пояснение к тексту, так как визуально предоставленная информация воспринимается лучше. Но, а что же с SEO? Уникальная картинка, подобранная по всем правилам в сервисах показа картинок сможет собрать достаточное количество трафика. В статье рассмотрим основные приемы по оптимизации изображения и размещения его на сайте.
1. Релевантные изображения с хорошим качеством
Естественно, картинка на сайте должна соответствовать представляемой информации. Если вы продаёте одежду, а в каталоге фотографии мебели, то едва ли кто-то перейдет к вам через поиск картинок. Только если какой-нибудь сумасшедший захочет примерить на себе кресло. Пример нереалистичный, но показательный. Конечно же, потенциальный покупатель хочет видеть конкретное изображение предмета одежды. В идеале фотография должна быть на человеке, таким образом клиент может представить, как бы примерно данная вещь смотрелась на нем. Если фото размытое, нечеткое, то в данном случае его тоже обойдут стороной.
Для статей и социальных сетей важно привлечь внимание, поэтому картинка должна быть яркой, запоминающейся. Кроме того, она должна раскрывать основную тему или призывать к основной идее. Например, для статей с программным обеспечением неплохо было бы в скриншотах отобразить интерфейс и настройки. Также для некоторых услуг (финансовая сфера, SEO продвижение и т. д.) важно показать инфографику, в которой отображались статистические материалы.
Для абстрактных тем можно использовать призывающие иллюстрации, способные в человеке вызвать определенные эмоции. Для примера, в мотивирующей статье использовать фото человека, который выглядит успешным или наоборот. Любая эмоция, положительная или отрицательная, может побудить человека кликнуть на статью и даже заставить прочитать.
2. Оригинальность и уникальность изображения
Поисковые роботы способны определить где изначально была картинка, является ли она дублем или же она уникальна, поэтому изображение стоит сделать самостоятельно или переработать стоковое за счёт различных средств и приемов. Поисковики хорошо ранжируют уникальный контент, в том числе и картинки. Для проверки уникальности есть специализированные сервисы. Одним из них является TinyEye. Ресурс бесплатный, если картинка уже где-то имеется, то будет указано где. Также можно осуществить поиск по картинке в Google или Яндекс, если результатов 0, то изображение уникально.
Хоть и в Рунете не особо бережно относятся к авторским правам, всё же не стоит использовать чужие фотографии. Если правообладатель обнаружит использование его контента, он сможет вам навредить. Для сайта, продающего товары, можно использовать услуги фотографа. Товар, который поступил на склад, можно сфотографировать, при этом использовать какие-то уникальные детали, конкретно связанные с вашим интернет-магазином. Такой контент априори будет уникальным. Скриншоты работы в программе или инфографика также будут уникальными. Для коммерческих целей обязательно используйте свой контент, или хотя бы тот, который распространяется с открытой лицензией. В Google поиске картинок можно поставить настройку, с помощью которой будут отображаться контент с лицензией. Таким образом можно проверить, лицензионная картинка или нет.
Если же без стоковой картинки не обойтись, то стоит использовать средства корректировки и изменения. Хорошими примерами являются сервисы Canva и Crello. Здесь вы сможете сделать коллаж, добавить надпись, обрезать фото, добавить элементы. Конечно же можно преобразовать всё в фотошопе, но в данном случае понадобятся определенные знания. Также есть много других сервисов, в которых также можно сделать цветокоррекцию и другие изменения.
3. Читабельное название фото
Рассмотрим два варианта названия: DCN34467.jpg и komplekt_nizhnego_bel’ya.jpg. Поисковые роботы смотрят на название, поэтому на латинице оно должно соответствовать содержимому. Человекопонятный URL позитивно влияет на SEO оптимизацию. Для названия использую латиницу, так как Google не сможет принять другой вариант, к тому же некоторые CMS некорректно воспринимают буквы кириллицы.
Также стоит в название добавлять ключевые слова. Например в изображении товара использовать бренд и название модели.
4. Формат и размер
При выборе формата важно получить минимальный размер при максимально допустимом качестве. Фотография не должна слишком много весить, так как она будет сильно подгружать сайт, в итоге посетителю надоесть ждать загрузку и он перейдет на другой ресурс. Это особо заметно на сайтах с каталогом товаров. Также важно качество, если покупатель не сможет нормально рассмотреть товар, будет такой же результат, он уйдет к конкурентам. В интернете используют такие форматы как jpg, png, svg, gif, webP. JPEG самый популярный из них, так как при минимальных размерах фото будет качественнее по сравнению с другими вариантами. PNG используется, где требуется изображение с прозрачным фоном. Иногда такой формат немного выигрывает и по размерам относительно JPEG. Если требуется небольшая анимация, используют GIF. В качестве логотипов и иконок используют изображения с расширением SVG. С помощью средств JS и CSS, можно без потерь качества уменьшать размер. WebP является новым форматом, который может еще более сильно сжимать изображения. Но скорость потери качества заметно быстрее чем у других. Также, не все браузеры поддерживают данный формат.
Время загрузки изображения является одним из факторов ранжирования в Google, поэтому к сжатию также стоит трепетно отнестись. В данном случае можно либо уменьшить размер, либо сделать отображение в качестве превью. Для интернет-каталогов оптимальный размер – до 90 Кб. Превью используют для интернет-магазинов: первоначальное изображение невысокого качества с маленьким размером, по нажатию на фото открывается полная версия фото более высокого качества.
Для уменьшения размеров существует множество средств и ресурсов. Во-первых, при сохранении в Photoshop можно указать качество и нужный формат.
В качестве сервисов сжатия перечислим простые онлайн-варианты, отличающиеся простотой использования: JpegMini, Compressor, tinypng, ImageOptimizer, imagecompressor. Последний способен сжимать изображения фактически выбирая количество Кб. Для таких сервисов важно потом посмотреть на начальный и конечный результат, для того чтобы определить, не сильно ли исказилось изображение.
Также обратите внимание на размер фотографии. Не стоит загружать на сайт фото размером 2600х2000, лучше уменьшить ширину и высоту с помощью дополнительных сервисов или непосредственно в фотошопе.
5. Картинки для разных дисплеев и устройств
Не стоит забывать, что устройства для, с помощью которых просматривают контент различаются по размеру, качеству дисплея и т. д. Для этого стоит загружать изображения в различных вариантах в соответствии с разрешением экрана и дисплеем. В параметрах изображения можно указать все варианты. Адаптивность иллюстрации – важный критерий в поведенческих факторах.
6. Заполните атрибуты title и alt
Поисковые системы также обращают внимание на другие атрибуты картинки. Такими атрибутами являются title и alt. Title отвечает за выведение текста при наведении курсора на картинку. Alt описывает содержимое картинки, и в случае когда загрузки не произошло (медленный интернет или браузер не прогрузил), в поле будет написан этот текст. В атрибутах стоит использовать ключевые слова, поисковые роботы в таком случае будут показывать ваш контент по релевантным запросам. Не стоит злоупотреблять количеством используемых ключей, достаточно будет 1-2 слова. Для кроссовок, например, можно будет написать так: …alt=”кроссовки найк айрмакс”… . Здесь понятен и вид продукции, и бренд, и модель. Этого будет достаточно.
7. Создайте Sitemap-файл для изображений
Для того, чтобы все картинки заметил Google и стал её индексировать, необходимо создать Sitemap-файл. Данный метод указывает на картинки, которые обычным путем поисковые роботы не в состоянии заметить, например загруженные с помощью JS.
В некоторых CMS есть специальные плагины, позволяющие автоматически создать такой файл. Использование такого метода не даёт 100% гарантии, что фото будут индексироваться, но это является важным шагом на пути к полной оптимизации контента.
8. Добавьте подписи к изображениям
В качестве комментария добавьте надпись под фото. При быстром пролистывании или же при медленной загрузке, эта надпись укажет на содержимое иллюстрации и позволит обратить на себя внимание, если это интересно посетителю. В надписи можно:
• добавить ключевые слова;
• разместить описание содержимого, краткое пояснения;
• указать дополнительную информацию.
Стоит понимать, что размещение картинки на «своём» месте, то есть в абзаце, в котором написано что-либо о содержимом фото, воспринимается крайне положительно поисковыми роботами. Соответственно, наиболее прилегающий к визуальному контенту текст будет участвовать в рассмотрении. В большинстве CMS есть средства, позволяющие указывать такой текст именно как описание, ведь в противном случае он будет восприниматься как обычный кусок текста.
9. Микроразметка
Если ваша статья интересна посетителям, многие захотят как-нибудь сохранить её для себя. А какие способы сейчас наиболее подходят для таких целей? Конечно же репосты в социальные сети. Поэтому для оптимизации необходимо использовать микроразметку. Она позволит настроить внешний вид поста в социальных сетях, сделать его более презентабельным, с правильным размером фотографии и со ссылками на ваш сайт. В итоге, все подписчики и друзья репостнувшего, станут вашими потенциальными посетителями и возможно покупателями.
В качестве инструментов микроразметки выделяют Open Graph, Twitter Card, Schema.org.
• Open Graph применяется для Facebook, Google+, Twitter, Pinterest и т. д.
• Twitter Card применим для постов твиттера.
• Schema.org появился относительно недавно в качестве совместной работы Google, Яндекс, Bing, Yahoo!. Данный словарь влияет на внешний вид сниппетов и указывает на тип контента. Кроме того, такая разметка позволяет в поиске картинок указать товар со спец. значком «Продукт».
10. Размещение изображения на хостинге
Иногда в связи с долгой загрузкой сайта, визуальный контент размещают на сторонних хостингах. В таком случае загрузка страниц и картинок происходит быстрее. Но делая такую новомодную вещь, стоит знать, что при этом вы сможете потерять в трафике. Поэтому рекомендуется размещать все на своем хостинге. Конечно бывают случаи когда трафик очень большой, и для быстрой загрузки придётся воспользоваться сторонней помощью. В таком случае используют сети доставки контента (CDN). Главным минусом является фактическое нерентабельное использование обратных ссылок, ведь теперь посетитель будет ссылаться именно на CDN.
Критерии для изображений от Google и Яндекс:
• Качественный, оригинальный и релевантный контент;
• Соответствие контекста изображения и текста;
• обязательное заполнения атрибутов;
• оптимизация для различных устройств и др.
Не идите по пути шаблонности и однообразия. Старайтесь привнести яркость и разнообразие в визуальное отображение контента. Тогда ваши изображения будут не только хорошо восприниматься поисковыми роботами, но и привлекать внимание посетителей.
