Неоптимизированные изображения замедляют скорость сайта и отталкивают людей от вашего ювелирного онлайн-магазина. В этой статье мы расскажем об оптимизации изображений.

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

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

https://sunlight.net/catalog/necklaces221162.html

10 советов по оптимизации изображений ювелирного онлайн-магазина

Что такое оптимизация изображений?

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

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

Целью оптимизации изображений является создание высококачественных изображений с минимальным размером файла. Здесь играют роль три основных элемента:

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

Почему мы оптимизируем изображения?

Изображения вносят наибольший вклад в общий размер страницы, из-за чего страницы загружаются медленно. Данные HTTP Archive показывают, что неоптимизированные изображения составляют в среднем 75 % от общего веса веб-страницы. Это может негативно сказаться на производительности вашего сайта.

Оптимизация изображений помогает снизить вес веб-страницы, что дает следующие преимущества:

Повышение скорости работы сайта

Оптимизация изображений для компьютеров и мобильных устройств существует для того, чтобы веб-страницы загружались быстрее. Они создают лучший опыт просмотра для покупателей. Если скорость загрузки страницы задерживается всего на две секунды, показатель отказов может увеличиться на 103 %.

Скорость страницы – это скорость загрузки контента на вашей странице. Она часто описывается как:

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

Лучший опыт просмотра

Скорость страницы очень важна для восприятия посетителя. Люди могут заметить задержку всего в 1/10 секунды. Все, что дольше этого, не кажется «мгновенным». Задержки в одну секунду достаточно, чтобы прервать мыслительный процесс человека.

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

https://sunlight.net/catalog/neck_decoration_237747.html

Улучшение поисковых характеристик

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

Более того, визуальный поиск становится все более важным, о чем свидетельствует введение Google новой функции поиска, которая объединяет изображения и текст в один запрос. Около 62 % потребителей поколения Z и миллениалов хотят визуального поиска больше, чем любой другой новой технологии.

10 лучших методов оптимизации изображений

1. Используйте лаконичные и прямые названия изображений

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

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

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

https://sunlight.net/catalog/clock_311574.html

2. Тщательно оптимизируйте атрибуты alt

Атрибуты alt – это текстовая альтернатива изображениям, когда браузер не может правильно их отобразить. Они также используются для обеспечения веб-доступности. Даже когда изображение отображается, если навести на него курсор, вы увидите текст атрибута alt (в зависимости от настроек вашего браузера).

Атрибут alt также добавляет SEO-ценность вашему сайту. Добавление соответствующих атрибутов alt, включающих ключевые слова, к изображениям на вашем сайте может помочь вам лучше ранжироваться в поисковых системах. На самом деле, использование атрибутов alt – это, вероятно, лучший способ для ваших продуктов электронной коммерции отображаться в поиске изображений и веб-поиска Google.

Приоритетом номер один при оптимизации изображений является заполнение атрибута alt для каждого изображения товара на вашем сайте.

Вот несколько простых правил для атрибутов alt:

3. Выбирайте размеры изображений и углы обзора товара с умом

Обычно принято показывать несколько ракурсов вашего ювелирного продукта. Лучший способ использовать дополнительные фотографии – заполнить атрибуты alt. А сделать это можно, создав уникальные alt-атрибуты для каждого снимка товара.

Главное здесь – добавить описание к базовому атрибуту alt, чтобы потенциальные поисковики попадали на ваш сайт. Если вы проделаете дополнительную работу, Google вознаградит вас поисковиками.

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

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

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

4. Измените размер изображений

Подумайте вот о чем:

У вас есть изображения, которые загружаются более 15 секунд? Что ж, можете послать воздушный поцелуй потенциальному клиенту на прощание!

Итак, что же вы можете сделать?

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

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

Одним из способов уменьшения размера файлов изображений является использование команды Save for Web в Adobe Photoshop. При использовании этой команды вы сможете уменьшить размер изображения до минимально возможного при сохранении качества изображения.

Если у вас нет Adobe Photoshop, существует множество онлайн-инструментов, которые вы можете использовать для редактирования изображений. У Adobe даже есть бесплатное приложение для редактирования изображений для смартфонов и планшетов – Photoshop Express. Этот инструмент не обладает всеми возможностями полной версии Adobe Photoshop, но он охватывает все основы редактирования изображений и не стоит ни копейки.

https://sunlight.net/catalog/ring_247775.html

Вот некоторые другие впечатляющие онлайн-инструменты для редактирования изображений:

Наконец, всегда есть GIMP. GIMP – это бесплатное программное приложение для редактирования изображений с открытым исходным кодом, которое можно запускать на Windows, Mac или Linux. Он может делать все то же самое, что и Photoshop.

    Для изображений, предназначенных для электронной коммерции, хорошее эмпирическое правило – стараться, чтобы размер файла изображения не превышал 70 килобайт. Иногда это может быть сложно, особенно для больших изображений.

5. Выберите правильный формат изображения

Существует три распространенных типа файлов, которые используются для размещения изображений в Интернете: JPEG, GIF и PNG.

Давайте рассмотрим эти три типа:

JPEG (или .jpg) является де-факто стандартным типом файлов изображений для Интернета. Изображения JPEG могут быть значительно сжаты, что позволяет получить качественные изображения при небольшом размере файла.

Изображения GIF (.gif) имеют более низкое качество, чем изображения JPEG, и используются для более простых изображений, таких как иконки и декоративные изображения. GIF-изображения также поддерживают анимацию.

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

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

Вот несколько советов, которые следует помнить при выборе типов файлов:

  1. В большинстве случаев в электронной коммерции лучшим вариантом для вас будет JPEG. Они обеспечивают наилучшее качество изображения при наименьшем размере файла.
  2. Никогда не используйте GIF-файлы для больших изображений товаров. Размер файла будет очень большим, и нет хорошего способа уменьшить его. Используйте GIF только для миниатюр и декоративных изображений.
  3. PNG могут быть хорошей альтернативой как JPEG, так и GIF. Если вы можете получить фотографии товара только в формате PNG, попробуйте использовать PNG-8, а не PNG-24. PNG отлично подходят в качестве простых декоративных изображений благодаря своему чрезвычайно малому размеру файла.

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

6. Оптимизируйте миниатюры

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

Миниатюры – это здорово, но будьте осторожны: они могут стать тихим убийцей. Жертва? Скорость загрузки вашей страницы. Миниатюры обычно появляются в критические моменты процесса покупки. Если они мешают быстрой загрузке страниц категорий, вы можете потерять потенциального покупателя.

Итак, что вы можете сделать?

  1. Сделайте размер файлов миниатюр как можно меньше. Возможно, здесь стоит отказаться от качества в пользу меньшего размера файла. Помните, что совокупное воздействие ваших миниатюр будет иметь огромное влияние на время загрузки страницы.
  2. Варьируйте текст атрибута alt, чтобы не дублировать текст, который используется для больших версий одного и того же изображения. Более того, сделайте текст alt совершенно другим. Последнее, чего вы хотите, это чтобы миниатюра была проиндексирована вместо более крупного изображения. Можно сделать так, чтобы текст alt вообще отсутствовал.

https://sunlight.net/catalog/chains_25352.html

7. Используйте карты сайта изображений

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

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

Или вы можете отправить карту сайта в Google с помощью Search Console.

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

Использование карт сайта не гарантирует, что ваши изображения будут проиндексированы Google, но это, безусловно, положительный шаг в направлении SEO изображений. В Google Webmaster Tools есть много рекомендаций по правильному оформлению карты сайта.

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

8. Остерегайтесь декоративных изображений

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

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

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

9. Соблюдайте осторожность при использовании сетей доставки контента (CDN)

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

Единственный недостаток – это обратные ссылки. Как вы, возможно, знаете, обратные ссылки очень важны для SEO, и чем больше у вас обратных ссылок, тем лучше ваш сайт в поисковых системах.

Размещая свои изображения в CDN, вы, скорее всего, удаляете изображение со своего домена и помещаете его на домен CDN. Таким образом, когда кто-то ссылается на ваше изображение, он фактически ссылается на домен CDN.

10. Тестируйте свои изображения

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

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

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

    Проверьте, сколько товаров должно быть на страницах категорий. 10, 20, 100 продуктов? Протестируйте количество продуктов на страницах категорий, чтобы понять, что лучше всего подходит вашим клиентам.

Инструменты оптимизации изображений

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

AVADA SEO: Image Optimizer

AVADA SEO Image Optimizer является одним из лучших приложений в Shopify App Store. К числу интересных функций относятся:

TinyIMG SEO & Image Optimizer

TinyIMG SEO & Image Optimizer – еще один отличный инструмент оптимизации. Вы можете в любое время восстановить исходное изображение и оптимизировать его вручную.

TinyIMG также предлагает:

TinyPNG

TinyPNG – это самый популярный инструмент оптимизации изображений в Интернете. Он использует интеллектуальные методы сжатия с потерями для уменьшения размера файлов изображений для ваших веб-страниц (WEBP), JPEG и PNG файлов. Вы можете уменьшать изображения для ваших приложений или ювелирного онлайн-магазина, а также уменьшать анимированные изображения.

API TinyPNG автоматически изменяет размер изображений для миниатюр, удаляя ненужные части и добавляя больше фона. Он доступен как плагин для WordPress, если ваш сайт работает на WordPress.

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

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

Желаем удачи вашему ювелирному онлайн-бизнесу!

Автор статьи Марк Хайес.

Все фотографии любезно предоставлены SUNLIGHT.