Компания
  • О компании
  • Лицензии
  • Партнеры
  • Отзывы
  • Вакансии
  • Вопрос ответ
  • Скидка на 1С Битрикс
Новости
Магазин
  • 1С-Битрикс: Управление сайтом
    • Лицензия 1С Битрикс
    • Обычное продление
    • Переходы редакций
  • CRM системы
    • Битрикс24 в облаке
    • Битрикс24 в коробке
  • 1С-Битрикс: Мобильное приложение
Услуги
  • Разработка
    • Разработка сайтов на 1С Битрикс в Анапе и Краснодарском крае
    • Разработка посадочных страниц (Landing Page)
    • Разработка сайтов на 1С-Битрикс
    • Разработка сайтов под ключ
    • Разработка мобильной версии сайта
    • Техническая поддержка сайта
    • Адаптивный дизайн сайта
    • Разработка технического задания на сайт
    • Интернет порталы и социальные сервисы
    • Корпоративные сайты
    • Интернет-магазины
    • Мобильные приложения
  • Повышаем эффективность
    • Битрикс24
    • Сопровождение и поддержка сайтов
    • 1C-интеграция
    • A/B-тестирование
    • Аудит сайта
    • Композитный сайт
    • Ускорение сайтов
    • Настройка HTTPS
    • Внедрение CRM
    • Внедрение систем учета
  • Продвижение сайтов
    • SEO продвижение
    • SMM и партизанский маркетинг
    • Контекстная реклама
    • Интернет маркетинг
  • Дизайн
    • Дизайн сайтов
    • Логотипы и фирменный стиль
    • Брендбук
    • Дизайн интерфейсов
Проекты
  • Интернет-магазины
  • Корпоративные сайты
  • Порталы и социальные сервисы
  • Логотипы и фирменный стили
Блог
Контакты
Ещё
    Студия DENISOV
    Разработка и развитие
    сайтов на CMS 1С-Битрикс
    ₽
    • ₽
    • ₸
    +7 (909) 450-40-30
    Звоните с 10:00 до 18:00
    Заказать звонок
    Студия DENISOV
    Компания
    • О компании
    • Лицензии
    • Партнеры
    • Отзывы
    • Вакансии
    • Вопрос ответ
    • Скидка на 1С Битрикс
    Новости
    Магазин
    • 1С-Битрикс: Управление сайтом
      • Лицензия 1С Битрикс
      • Обычное продление
      • Переходы редакций
    • CRM системы
      • Битрикс24 в облаке
      • Битрикс24 в коробке
    • 1С-Битрикс: Мобильное приложение
    Услуги
    • Разработка
      • Разработка сайтов на 1С Битрикс в Анапе и Краснодарском крае
      • Разработка посадочных страниц (Landing Page)
      • Разработка сайтов на 1С-Битрикс
      • Разработка сайтов под ключ
      • Разработка мобильной версии сайта
      • Техническая поддержка сайта
      • Адаптивный дизайн сайта
      • Разработка технического задания на сайт
      • Интернет порталы и социальные сервисы
      • Корпоративные сайты
      • Интернет-магазины
      • Мобильные приложения
    • Повышаем эффективность
      • Битрикс24
      • Сопровождение и поддержка сайтов
      • 1C-интеграция
      • A/B-тестирование
      • Аудит сайта
      • Композитный сайт
      • Ускорение сайтов
      • Настройка HTTPS
      • Внедрение CRM
      • Внедрение систем учета
    • Продвижение сайтов
      • SEO продвижение
      • SMM и партизанский маркетинг
      • Контекстная реклама
      • Интернет маркетинг
    • Дизайн
      • Дизайн сайтов
      • Логотипы и фирменный стиль
      • Брендбук
      • Дизайн интерфейсов
    Проекты
    • Интернет-магазины
    • Корпоративные сайты
    • Порталы и социальные сервисы
    • Логотипы и фирменный стили
    Блог
    Контакты
    Ещё
      ₽
      • ₽
      • ₸
      Студия DENISOV
      ₽
      • ₽
      • ₸
      • Компания
        • Назад
        • Компания
        • О компании
        • Лицензии
        • Партнеры
        • Отзывы
        • Вакансии
        • Вопрос ответ
        • Скидка на 1С Битрикс
      • Новости
      • Магазин
        • Назад
        • Магазин
        • 1С-Битрикс: Управление сайтом
          • Назад
          • 1С-Битрикс: Управление сайтом
          • Лицензия 1С Битрикс
          • Обычное продление
          • Переходы редакций
        • CRM системы
          • Назад
          • CRM системы
          • Битрикс24 в облаке
          • Битрикс24 в коробке
        • 1С-Битрикс: Мобильное приложение
      • Услуги
        • Назад
        • Услуги
        • Разработка
          • Назад
          • Разработка
          • Разработка сайтов на 1С Битрикс в Анапе и Краснодарском крае
          • Разработка посадочных страниц (Landing Page)
          • Разработка сайтов на 1С-Битрикс
          • Разработка сайтов под ключ
          • Разработка мобильной версии сайта
          • Техническая поддержка сайта
          • Адаптивный дизайн сайта
          • Разработка технического задания на сайт
          • Интернет порталы и социальные сервисы
          • Корпоративные сайты
          • Интернет-магазины
          • Мобильные приложения
        • Повышаем эффективность
          • Назад
          • Повышаем эффективность
          • Битрикс24
          • Сопровождение и поддержка сайтов
          • 1C-интеграция
          • A/B-тестирование
          • Аудит сайта
          • Композитный сайт
          • Ускорение сайтов
          • Настройка HTTPS
          • Внедрение CRM
          • Внедрение систем учета
        • Продвижение сайтов
          • Назад
          • Продвижение сайтов
          • SEO продвижение
          • SMM и партизанский маркетинг
          • Контекстная реклама
          • Интернет маркетинг
        • Дизайн
          • Назад
          • Дизайн
          • Дизайн сайтов
          • Логотипы и фирменный стиль
          • Брендбук
          • Дизайн интерфейсов
      • Проекты
        • Назад
        • Проекты
        • Интернет-магазины
        • Корпоративные сайты
        • Порталы и социальные сервисы
        • Логотипы и фирменный стили
      • Блог
      • Контакты
      • Мой кабинет
      • Корзина0
      • +7 (909) 450-40-30
      Будьте на связи
      Россия и Казахстан
      support@sdvv.ru

      Оптимизация изображений для интернет-магазина: полное руководство

      • Главная
      • Блог
      • Оптимизация изображений для интернет-магазина: полное руководство
      25 Марта 2018 4669
      // Электронная коммерция

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

      Сколько внимания вы уделяете оптимизации изображений для интернет-магазина?


      Изображения в электронной коммерции – настоящий катализатор продаж.

      Это мощный инструмент, благодаря которому люди понимают ценность предоставляемых товаров и услуг.

      В этом отношении только видео может сравниться с картинками по эффективности.

      Предприниматели используют фотографии товара повсюду:

      ·         На страницах товаров

      ·         На страницах категорий

      ·         На главной странице магазина

      ·         В сообщениях с брошенной корзиной

      ·         Для рекламы в социальных сетях

      ·         В корпоративном блоге

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

      Пользователи любят скорость, а Google любит пользователей.

      Поисковик №1 – первый критик, кто заинтересован в оптимизации изображений.

      В январе 2018 года компания анонсировала, что мобильные поисковые алгоритмы начнут учитывать скорость загрузки веб-страниц уже с июля – через 3 месяца!

      Между тем, картинки – это один из важнейших активов любого интернет-магазина.

      И все же ими часто пренебрегают, забывая о размерах, качестве и скорости.

      Почему так происходит?

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

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

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

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

      Зачем нужны изображения для интернет-магазина

      Прежде чем приступить к практике, давайте разберемся: зачем все это нужно?

      1.      Первое впечатление клиента

      Картинка – это первая вещь, которую потенциальный покупатель видит на сайте.

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

      Исследование Comprehensive Modern Consumer Shopping Habits Study, проведенное в 2017 году среди американских онлайн-покупателей, дало весьма любопытные результаты:

      Что вы хотите видеть на сайте интернет-магазина?

      ·         Фотографии товара – 78%

      ·         Подробные обзоры – 69%

      ·         Сравнение продуктов – 46%

      ·         Отзывы пользователей – 42%

      ·         Видео обзор (распаковка) – 30%

      ·         Онлайн-консультант – 22%

      ·         Ссылки на соцсети – 9%

      Учитывая среднегодовой рост электронной коммерции в 20-25%, успешное внедрение перечисленных элементов принесет вам впечатляющие преимущества и дивиденды!

      2.      Картинка стоит тысячи слов

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

      Онлайн нельзя «пощупать» вещь, как в традиционном магазине, поэтому фотография стала продолжением витрины. А кто будет покупать товар, который нельзя рассмотреть?

      Что вам не нравится в онлайн-торговле?

      ·         Оплата за доставку – 58%

      ·         Покупка товара вслепую – 49%

      ·         Проблемы с возвратом – 34%

      ·         Ожидание доставки – 34%

      ·         Нарушение приватности – 29%

      ·         Проблемы с навигацией по сайту – 21%

      ·         Ввод платежных данных – 19%

      ·         Избыток товаров – 10%

      ·         Плохой поиск – 9%

      В подтверждение приводим вторую часть результатов упомянутого исследования Square и BigCommerce, где 49% покупателей жалуются на невозможность посмотреть товар.

      3.      Мобильные покупки

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

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

      Четкие и привлекательные образы – залог высоких продаж.

      4.      Изображения могут навредить сайту

      Некоторые наивно полагают, что любая фотография на сайте – это здорово.

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

      ·         Ваши изображения загружаются медленно?

      ·         Вы не добавляете релевантные мета-описания?

      ·         Посетители быстро покидают страницу?

      Если хотя бы на один вопрос ответ «Да» - пересмотрите визуальные элементы!

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

      ·         Профессиональное качество

      ·         Грамотная поисковая оптимизация

      ·         Высокая уникальность

      ·         Разумный объем

      фотографии-товара-с-разных-ракурсов

      Руководство по оптимизации веб-изображений

      Оптимизация изображений дает стратегические преимущества в UX и ранжировании.

      Это означает больше кликов, больше поискового трафика, больше продаж.

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

      1.      Делайте качественные снимки

      Успешная электронная коммерция начинается с фотоаппарата.

      Вам не обязательно покупать навороченную профессиональную фотокамеру за $3000.

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

      ·         Цифровой зеркальный фотоаппарат (DSLR) или смартфон. Сегодня у большинства смартфонов есть камера, которой более чем достаточно для получения стандартных фотографий продукта на первых этапах работы интернет-магазина.

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

      ·         Белый фон для фотографирования. Установка фона – белоснежной ткани или рулона бумаги – поможет равномерно распределить освещение и упросит редактирование.

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

      2.      Покажите продукт под разными углами

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

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

      Разные снимки товара демонстрируют разные аспекты:

      ·         Фотографии на дальней дистанции показывают вещь на модели, помогая клиенту представить ее в различных жизненных ситуациях (применение)

      ·         Фотографии на средней дистанции акцентируют внимание на общем виде товара

      ·         Снимки с увеличением демонстрируют качество изделия (ткань, пошив)

      3.      Используйте белый фон для фотографирования

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

      ·         Товары выглядят более привлекательно

      ·         Вы можете составлять серии однотипных снимков

      ·         Вы экономите деньги и время на редактировании

      ·         Вы можете легко заменять фон любой фотографии

      ·         Многие площадки сегодня требуют белый фон

      ·         На белом проще сравнивать вещи

      Чтобы вручную заменить фон изображения, вы можете воспользоваться стандартными программами вроде Photoshop или Pixlr.

      4.      Выбирайте подходящий размер

      Размер изображения имеет ключевое значение для вашего бизнеса:

      ·         Слишком тяжелые картинки замедляют загрузку и повышают отказы

      ·         Слишком маленькие картинки не внушают доверия покупателям

      Для оценки размеров изображений ориентируйтесь на пиксели.

      Камера вашего iPhone имеет разрешение около 12 мегапикселей, то есть сделанные ею фотоснимки состоят из 12 000 000 условных точек, или 3000 х 4000 пикселей.

      Много это или мало? Для сайтов электронной коммерции это с головой.

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

      Кстати, делая снимки «квадратными», вы способствуете их корректному отображению.

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

      5.      Выбирайте формат для быстрой загрузки

      При сохранении файла проще выбрать формат по умолчанию, но за привычными расширениями gif, png и jpeg стоят существенные отличия. Каждый из этих форматов обладает своими плюсами и минусами, определяющими сферу его использования:

      ·         Файлы GIF ниже по качеству, но и занимают меньше места. Если вам нужно создать изображение специально для небольших значков или миниатюр, стоит использовать GIF. Это также единственный формат, который поддерживает анимацию (не забудьте APNG). По мере увеличения размера обработка цветов GIF становится менее эффективной.

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

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

      6.      Экспериментируйте с качеством изображений

      В большинстве случаев интернет-магазины используют формат JPEG.

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

      Когда не нужно использовать JPEG на сайте:

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

      ·         Когда картинка – это в основном линии, значки или резкие контуры: сжатие JPEG может размыть линию между изображением и фоном, сделав контраст менее отчетливым.

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

      7.      Оптимизируйте объем

      Типичный размер файла фотографий iPhone 7 составляет примерно 3 МБ, что соответствует тридцати веб-изображениям оптимального размера! Теперь представьте, что в интернет-магазине появилась галерея из 10-15 снимков такого размера. Начинаете понимать, почему размер решает?

      Отрегулировать уровень сжатия файлов JPEG несложно – для этого используются многочисленные платные графические редакторы и бесплатные онлайн-сервисы. Например, оптимизатор TinyJPG, который производит интеллектуальное сжатие снимков в JPG и PNG.

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

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

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

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

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

      1.      Используйте информативные имена файлов

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

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

      2.      Включите alt изображений

      Alt текст представляет собой альтернативное описание картинки.

      Если у человека слабое зрение или файл невозможно загрузить, на экране появится alt текст.

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

      3.      Окружите картинку контентом

      Релевантное окружение графического объекта необходимо и людям, и машинам.

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

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

      4.      Продумывайте размер и положение

      Стремитесь максимально усилить пользовательский опыт:

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

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

      ·         Установите высоту и ширину каждого веб-изображения. Если браузер знает, какого размера должно быть фото, он расставит остальной контент на свои места, пока ждет завершения загрузки массивного файла. Скорость – это продажи!

      5.      Настройте Open Graph для социальных сетей

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

      Теги
      интернет-магазин оптимизация бизнес
      Поделиться
      Назад к списку
      Сверху под шапкой

      Категории
      • Бизнес-советы12
      • Из мира технологий15
      • Интернет-маркетинг66
      • Интернет-менеджмент40
      • Повышение продаж5
      • Управление проектами57
      • Электронная коммерция52

      Это интересно
      • Причины низкой конверсии интернет-магазина
        Причины низкой конверсии интернет-магазина
        10 Ноября 2020
      • Статистика Интернета 2020: сайты, домены, хостинг, трафик
        Статистика Интернета 2020: сайты, домены, хостинг, трафик
        3 Октября 2020
      • Веб-аналитика для интернет-магазина: какие показатели измерять?
        Веб-аналитика для интернет-магазина: какие показатели измерять?
        28 Сентября 2020
      • Как должна выглядеть карточка товара в интернет-магазине
        Как должна выглядеть карточка товара в интернет-магазине
        26 Августа 2020
      • Самые большие торговые площадки в Интернете
        Самые большие торговые площадки в Интернете
        24 Июля 2020
      Облако тегов
      1С-Битрикс AdWords bounce rate Chrome CMS CRM CTR digital-маркетинг Google GUI https mobile-first Pinterest schema SEM SEO Slideshare SMM SMO SSL UI UX VUI Youtube А/В тестирование Анапа аудит сайта безопасность бизнес блог бриф веб-аналитика веб-дизайн веб-разработка веб-формы вебмастер видеомаркетинг выделенный сервер главная страница голосовая коммерция голосовой поиск гостевые посты дизайн сайта домен заработок интернет интернет-магазин интернет-маркетинг интерфейс пользователя инфлюенсер-маркетинг искусственный интеллект карточка товара клиент ключевое слово ключевые слова конверсия контактная страница контент контент-анализ копирайт корпоративный сайт Краснодарский край лендинг медицинский сайт меню ресторана микросайт мобильная коммерция мобильное приложение мобильные приложения мобильный трафик монетизация облачное хранилище онлайн-консультант оптимизация параллакс партизанский маркетинг перенос сайта переход на новую CRM поисковая выдача поисковая оптимизация поисковые системы показатель отказов посадочная страница призыв к действию программирование продвижение Производительность разработка разработка приложений разработка сайта ранжирование ранжирование сайта расширенные сниппеты ребрендинг редизайн рейтинг реклама руководство ручные санкции рыночная ниша сайт система управления сайтом скорость загрузки советы социальные сети сплит-тестирование стартап статистика страница о нас студия веб-дизайна Счета тенденции товар торговая площадка трафик тренды уникальное торговое предложение факторы ранжирования формат изображения формат файла футер хедер хостинг цветовое оформление целевая аудитория цифровой маркетинг шапка сайта электронная коммерция Яндекс
      Боковой баннер
      Подписывайтесь на наши новости и акции!
      Компания
      О компании
      Лицензии
      Партнеры
      Отзывы
      Вакансии
      Вопрос ответ
      Скидка на 1С Битрикс
      Продукты
      1С-Битрикс: Управление сайтом
      CRM системы
      1С-Битрикс: Мобильное приложение
      Услуги
      Разработка
      Повышаем эффективность
      Продвижение сайтов
      Дизайн
      Наши контакты


      +7 (909) 450-40-30
      support@sdvv.ru
      Россия и Казахстан
      © 2021 Все права защищены.
      0

      Корзина

      Ваша корзина пуста

      Исправить это просто: выберите в каталоге интересующий товар и нажмите кнопку «В корзину»
      В каталог