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

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

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

Где взять фотографии для сайта

У вас всего три варианта: скачать готовые фото бесплатно, купить их или организовать фотосессию.

Готовый фотоконтент можно использовать для иллюстрации услуг и публикаций в блоге. Для коммерческого применения подходят иллюстрации по лицензии Creative Commons, фотографии категории Public Domain и Creative Commons Zero. Бесплатно фото с этими лицензиями можно скачать на фотостоках:

  • Unsplash,
  • Pexels,
  • Pixabay,
  • Freeimages,
  • Freestocks.org,
  • StartUp Stock Photos,
  • Streetwill,
  • Publicdomainpictures,
  • SplitShire.

Под Public Domain подпадают репродукции живописи, фотографии времен Первой и Второй мировой, скриншоты архивных материалов — любые произведения, через 70 лет после смерти автора перешедшие в список материалов общественного достояния.

Из платных фотоматериалов самые дешевые — фотографии Stock. Это постановочные фото, раскладки, векторные и метафорические иллюстрации, мало чем отличающиеся от изображений с бесплатных фотостоков. Разница только в широте ассортимента. В базовый список ресурсов для покупки stock-фото входят:

  • Depositphotos,
  • Shutterstock,
  • Istockphoto,
  • Stock.adobe,
  • Fotolia, 
  • Dreamstime.

Creative — более дорогостоящий вариант. Те же постановочные фото, но естественные, приближенные к реальной жизни: интересные ракурсы, разные фактуры, типажи, нестандартные компоновки. Они подходят для глянца и рекламной продукции, покупаются по лицензиям Rights-Managed или Rights-Ready.

Картинки для сайта категории Creative

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

Интернет-магазинам, сервисным компаниям, B2B предприятиям, предлагающим определенные услуги или товар, вариант со стоковыми фото не подходит. Нужны свои. Вариантов два: заказать фотосессию у профессионального фотографа и снимать самим.

Фотограф, конечно, дороже, зато профессионально снимет процесс строительства, совещание бригады у буровой установки, швею, кроящую ткань, повара над чадящей сковородой…Средняя стоимость предметной фотосъемки в столице — 90 рублей за 1 фото. Уже с ретушью. Репортажная съемка, которая покажет работу персонала, корпоратив, конференцию, процесс разгрузки или упаковки продукции, обойдется в 3 000 руб. за 1 час.

Если есть время, терпение и желание, фотографий для сайта можно наделать и самостоятельно. Даже на смартфон. В интернете масса советов по самостоятельной предметной и репортажной съемке — смотрите и делайте.

Качество и размер

Главный критерий качества фотографии — разрешение. Среднее разрешение, которое позволит подогнать иллюстрацию под страницу любого сайта, находится в диапазоне 1200-2000 px по длинной стороне. Есть еще вес. В зависимости от детализации и цветности, фото 1200x900 px может «весить» как 300КБ, так и 2МБ. Чем тяжелее, тем дольше будет грузиться страница, что категорически не приветствуют ни Google, ни Яндекс.

Тяжелые изображения нужно сжимать. Большинство админок сайтов самостоятельно оптимизируют изображение, но не всегда делают это качественно — страдает детализация, резкость. Лучше потратить 5-10 минут, но перед загрузкой на сайт уменьшить «вес» фотографий вручную или программно. В помощь вам ImageOptim, MozJPEG, pngquant.org, Photoshop.

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

Качественные фото для сайта

Формат, название и тэги

 Jpg, png, svg

Загружайте на сайт иллюстрации в jpg или png. Если фото неоднократно редактируется перед загрузкой — png лучше. При многократном сохранении у png не образуется артефактов, ухудшающих качество изображения. Для логотипов, иконок и др. векторной графики подходит формат svg. Без потери качества он сжимается на 50% и занимает мало места.

Название

Нечитабельное название иллюстрации, например, vhfhkl468l.jpg не пробьет брешь в SEO, но ухудшит информативность выдачи. Название должно быть на латинице, но понятным и очевидным, с 1-2 ключевыми словами. Если это иллюстрация женской сумки, то sumka-jenskaya-zara.jpg, если триммер для газона, то trimmer-sadoviy-huter.jpg.

Атрибуты

Обязательные атрибуты фотографии на сайте — теги alt и title. Alt описывает иллюстрацию, title показывается при наведении курсора на картинку. И тот и другой улучшают поведенческие факторы, помогают в поисковом продвижении. Не так давно важность alt признал даже Instagram, добавив этот тэг в атрибуты изображений.

Хороший alt — это 75-80 знаков из 3-5 слов с разбавленной ключевой фразой. Правильный title — тематичный, небольшой, тоже с разбавленным запросом.
Если все сделано, как надо, изображения сайта будут выводиться по релевантному запросу в Яндекс и Google Картинках. Для некоторых ресурсов, например, магазинов карнавальных костюмов или свадебной атрибутики, садовых центров, агентств ландшафтного дизайна и дизайна интерьеров Яндекса и Гугл Картинки могут стать источниками первых конверсий.

Есть проект? Свяжитесь с нами.
Дальше: Бесплатные клиенты. Из сервисов отзывов. Ч 2
Напишите нам
Загрузка...
Спасибо
Загрузка...