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

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

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

В данном материале я приведу пример как оптимизировать фото для загрузки в интернет. Статья будет полезна тем, кто впервые решил выставить на всеобщее обозрение свои фотографии.

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

Оптимизация фото для Web

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

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

д. (окно информации об авторских правах ищем в меню Файл > Сведения о файле > Описание), см. рис.10

Обратите внимание

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

В появившемся окне устанавливаем галочки как показано на фото внизу.

После этого необходимо установить разрешение. Я обычно устанавливаю значение 96 или 72.

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

Обычно я устанавливаю ширину от 800 пикселей до 1000, так как это оптимальный размер файла при котором качество и вес фото наиболее сбалансированы. Многие фоторесурсы не принимают фотографии весом свыше 250 Kb.

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

Интерполяцию оставляем бикубическую (по умолчанию).

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

Для оптимизации фотографии переходим в меню «Файл», в выпавшем меню выбираем пункт «Сохранить для Web и устройств…»

В открывшемся окне появляется наша фотография которую будем оптимизировать для веб страниц. Сначала выбираем формат файла, в данном случае – Jpeg. Метод оптимизации – «Оптимизация», хотя вы можете выбрать «Прогрессивный» метод.

Важно

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

При обычном методе «Оптимизация», файл открывается сразу в нормальном качестве, но не весь сразу а постепенно сверху вниз (построчно). Тут всё зависит от скорости интернета, чем выше скорость, тем быстрей этот процесс происходит.

После выбора метода оптимизации переходим к коррекции веса и качества фотографии. Ползунком «Качество» устанавливаем наиболее приемлемое для вас качество фото. Здесь я выставил 85, так как выбранное мной качество вмещается в 234 Kb., чего вполне достаточно… Скорость загрузки с сервера составила 43 секунды при довольно низкой скорости интернета – 56,6 кбит/с.

Вызвав меню «Выбрать скорость загрузки», можете выбрать любую из доступных вам скорость загрузки, но помните что не у каждого на сегодняшний день скорость интернета равна 2Mb/s.

Если возникла необходимость в дополнительной коррекции параметров фотографии, на панели «Размер изображения» есть уже знакомые нам инструменты…

Чтобы мир узнал какой камерой вы пользуетесь, и какие параметры настроек при съёмке используете – выбирайте пункт «Все» на панели «Метаданные».

Надеюсь, я достаточно подробно рассказал о процессе оптимизации, если нет – оставляйте ваши вопросы в комментариях. Удачи!

Источник: http://profoto.lviv.ua/foto-semka/optimizacija-foto-dlja-publikacii-v-internete.php

Зачем уменьшать фотографии для сайтов

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

Максимальные размеры фотографии

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

Для отображения картинки пиксель в пиксель, ее разрешение должно быть меньше разрешения монитора компьютера.

Сейчас большинство пользователей имеет мониторы с размерами экрана 17 или 19 дюймов, их разрешение составляет 1280×1024 точек.

А стало быть 1280×1024 пикселей и есть тот максимальный размер фотографии, который может отображаться на мониторе компьютера у большинства пользователей, без потери качества.

Совет

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

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

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

Обычно размер лучших фотографий для сайта следует ограничить 800 пикселей по длинной стороне кадра, а остальных 600 пикселей по длинной стороне кадра.

Почему нужно уменьшать картинки для сайта

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

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

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

И так, если все ваши снимки действительно шедевры, и это вам сказал кто-нибудь посторонний и знающий, то уменьшайте их до размеров 800×600 пикселей. Если они нравятся не только вам, а хотя бы жене и лучшему другу, то уменьшайте их до 600×450 пикселей.

Если же ваши фотоснимки нравятся пока только вам, то будьте самокритичны и уменьшайте их до 400×300 пикселей. Кроме уменьшения размеров фотографии, перед ее выкладыванием на сайт, нужно еще выбрать режим сжатия самого графического файла, проще всего это сделать через меню Фотошопа – “Save for Web…

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

Источник: https://www.i-foto-graf.com/zachem_umenshat_fotografiju_dlja_sajta

Как оптимизировать фотографии для интернет-магазина: пошаговая инструкция и обзор сервисов

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

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

Все примеры в статье сделаны в Фотошопе. Если у вас его нет, в конце мы предлагаем альтернативы.

Размеры и пропорции картинок

Размер

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

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

У картинки два размера:

  1. Пространство, которое она занимает на экране. Этот размер измеряется в пикселях (px) — точках, из которых состоит экран.
  2. В Эквид-магазин можно заливать картинки любого размера, они всегда оптимизируются под ширину окна браузера и загружаются одинаково быстро.

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

  3. Место, которое картинка занимает в памяти устройства. Память измеряется в килобайтах (kB).

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

Подходящий размер для фотографий товаров — 1000*1000 px на 200 kB

Однако сильное сжатие ухудшает «качество» картинки: появляется характерный шум или резкие переходы цветов. Чтобы такого не произошло, достаточно сохранить картинки в правильном формате. Для файла габаритов порядка 1000 px хорошим результатом будет вес в 200 kB. Как для этого выбрать формат, мы расскажем ниже.

Кадрирование

  • Картинка стала меньше, но пропали мелкие элементы, которые я хотел показать!

Вы правы! Детали важны. Откадрируйте важные детали товаров, вырезав их из основного изображения. Залейте дополнительные картинки в галерею.

Уменьшенное изображение и два кадра деталей с того же снимка

Миниатюры товаров

Мы разобрались с главным изображением товара, но для витрины нужны миниатюры. Об этом Эквид заботится сам. Миниатюры товаров создаются автоматически. Размер по умолчанию 230 px. Вы можете изменить его в настройках контрольной панели.

Если у вас не Эквид, сделайте миниатюры размером до 40-50 kB.

Пропорции

Исследования показали, что не любое соотношение сторон приятно глазу. С годами был определен «стандартный» набор пропорций, пользуюсь которыми вы всегда получите приятный результат: 1:1, 4:3, 3:2, 16:9.

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

Click To Tweet

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

Простой способ

В большинстве современных редакторов при сохранении для Web можно задать новые размеры снимка и алгоритм уменьшения, который напрямую влияет на резкость. В Фотошопе установив правильные параметры (Image Size не больше 1000 px и Quality = Bicubic Sharper), мы получим результат, не нуждающийся в последующей корректировке.

Если изначальное изображение было очень большим, например более 5000*5000 px, не уменьшайте его сразу до нужного. Сделайте это в 2-3 этапа, поправляя после каждого резкость.

Способ для опытных

  1. Уменьшите картинку до нужного размера: Image → Image Size + выберите Bicubic Sharper.
  2. Копируйте изображение на второй слой (Layer → Duplicate Layer).
  3. Повысьте резкость второго слоя (Filter → Sharpen → Sharpen).
  4. Откорректируйте прозрачность слоя, чтобы отрегулировать резкость (в окне Layer → Opacity), и готово.

Маленькие хитрости:

  • Второй слой наложите в режиме luminosity, это позволит избежать возникновения цветных ореолов.
  • Нежелательную резкость уберите протерев второй слой стёркой (или маской).

Итак, вот что у нас получилось в сравнении с оригинальным изображением:

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

Выбор формата

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

Самые популярные форматы:

  • GIF (англ. Graphics Interchange Format — «формат для обмена изображениями») способен хранить сжатые данные без потери качества в формате не более 256 цветов. Формат поддерживает анимационные изображения. Долгое время GIF был самым распространённым форматом в интернете, пока не был создан формат PNG.
  • PNG (англ. portable network graphics) использует сжатие без потерь и хранит неограниченное количество цветов.
  • JPEG (англ. Joint Photographic Experts Group, по названию разработчика) — самый распространенный формат для хранения фотографий и других изображений. Алгоритм JPEG позволяет сжимать изображение как с потерями, так и без потерь. Чем меньше потери, тем больше размер файла.
Читайте также:  Таймлапс что это такое: рекомендации как его правильно сделать

Фотография в формате JPEG с уменьшением степени сжатия слева направо. Источник: Wikipedia

Так что же выбрать?

Действуйте по следующему алгоритму:

  1. Если у вас фотография, выбирайте JPEG со значением качества порядка 50-80 единиц.
  2. Если иллюстрация с большими ровными заливками, JPEG не подойдет. На ровных поверхностях будут видны артефакты (искажения изображений). Выбирайте PNG.
  3. Анимированная картинка? Ваш выбор GIF.

И не используйте в интернете TIFF. Этот прекрасный формат создан для печати, но не подходит для web.

Сохранение фотографии в разных форматах. Файл JPEG самый «легкий»

А можно еще меньше? — Да!

Сжатие файлов без потери качества делают специальные сервисы: TinyJPG, JPEGmini, TinyPNG.

Если нет Фотошопа

У Фотошопа есть бесплатный онлайн редактор, в нем доступны базовые манипуляции с изображениями (например, обрезать картинку или изменить размер). Или можно купить минимальную версию за 644 рубля в месяц.

Для наших целей ничем не хуже бесплатные графические редакторы:

GIMP

Программа подходит для Windows, Mac и Linux. Есть всё необходимое для профессиональной обработки рисунков и фотографий: работа со слоями и масками, инструменты для цветокоррекции, ретуши и рисования. Gimp поддерживает все основные форматы графических файлов.

Paint.NET

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

PicMonkey

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

Большинство инструментов доступны бесплатно, но за некоторые продвинутые функции придется заплатить.

Pixlr

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

Pixlr Editor поддерживает все популярные форматы изображений, доступен на русском языке.

Больше онлайн-редакторов в этом обзоре.

***

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

Источник: https://www.ecwid.ru/blog/image-optimization-for-online-store.html

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

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

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

Обратите внимание

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

Правильно оптимизированная картинка на сайте это не только красиво и органично, но и бесплатный SEO способ привлечения трафика на Ваш сайт.

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

Я думаю, что Вы наверняка на некоторых сайтах наблюдали картину медленной (построчной) загрузки картинки. Такая медлительность загрузки страницы вызывает не только раздражение, но и желание уйти с сайта. Одной из наиболее вероятных причин является наличие на странице неоптимизированных изображений.

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

Использование правильного формата

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

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

Сразу отметем формат TIFF как наиболее громоздкий и тяжелый для загрузки сайта и остановим свой выбор на оставшихся.

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

Как правило для сайта используется формат JPEG, его алгоритм имеет наилучшую степень сжатия. Лично я на своем сайте использую именно этот формат.

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

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

Авторское фото

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

Естественно выкладывать картинки в таком качестве на свой блог очень неразумно.

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

Источник: https://leonov-do.ru/saitostroenie/dizajn-saitostroenie/optimizirovat-izobrazhenie-dlya-sajta.html

Оптимальный размер фото для сайтов: пошаговая инструкция с фото, как понять в пикселях размер для веб сайта

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

С чего все начинается?

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

Исходный формат RAW имеет слишком большой объем данных, хотя он и хранит максимум информации об изображении, о снятом кадре. Можно сказать, что это копия матрицы камеры на момент съемки.

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

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

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

Делать веб-страницы с такими фотками, при всем их качестве, – дело неблагодарное. Они медленно грузятся.

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

Давайте разберем по порядку.

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

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

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

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

Важно

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

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

Процесс обработки

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

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

Посмотрим на конкретном примере, как делается оптимизация фотографии, полученной с цифровой камеры, в редакторе Photoshop. В моей случае, я буду пользоваться Adobe Photoshop CS6 русской версией. Для тех шагов, которые мы с вами выполним, подойдет Photoshop любой версии. И так начнем.

1. Открываем фотографию в редакторе

ФайлОткрыть. В появившемся окне выбираем нужную фотографию.

На рисунке мы берем фото, имеющее размер около 4,5 Мб. Этот файл у нас в формате JPEG, полученную с зеркальной фотокамеры.

2. Уменьшаем размер фотографии

  • Разрешение, ставим 72 пикселя на дюйм, нам больше и не надо.
  • Размер. Ширину ставим 800 пикселей, он автоматически назначит высоту, в данном случае, он поставил 533 пикселей, согласно пропорций фотографии.

Важно! Ставим все галочки, картинки. Это:

  • Масштабировать стили;
  • Сохранить пропорции;
  • Интерполяция: Бикубическая автоматическая

3. Правильное сохранение

Здесь, мы будем сохранять, специально для веб публикаций. Для этого заходим, ФайлСохранить для Web.

4. Выставляем качество

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

Выбираем «Высокое» качество 60%. У нас получилось в этом примере 193.5 Кбайт при качестве 60%. Ну и ладно. На вид обработанное изображение почти неотличимо от оригинала. Вот в таком самом виде его и сохраняем. Готово!

5. Проверим в браузере

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

На этом и все. Теперь вы можете выкладывать фотографию куда угодно, веб-сайт, социальные сети и так далее.

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

Всех вам благ, Тимур Мустаев.

Источник: https://consultantpravo.ru/ooo130/optimalnyj-razmer-foto-dlya-sajtov-poshagovaya-instrukciya-s-foto-kak-ponyat-v-pikselyax-razmer-dlya-veb-sajta/

Какие форматы товаров изображений нужны для Интернет-магазина?



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

Как сделать качественную фото-сессию вы уже знаете — прочитайте цикл моих статей «Как организовать фотосессию товаров для Интернет-магазина? качественная фотография товара-залог успеха»

Конечно, если вы потратили время и ресурсы на организацию фотосъемки товаров для магазина, у вас возникает желание защитить, или хотя бы, усложнить копирование конкурентами ваших фото. Для этого используется «водяные знаки» – это полупрозрачные логотипы или копирайт-надписи магазина поверх фотографий, например: – адрес магазина www.Moy-Magazom.com или его название “Мой магазин название”

– логотип и УРЛ сайта (лого) + www.mymagazin.com

Ставят их так, чтобы было тяжело вырезать безболезненно. Обычно по центру, или так, чтобы «водяной знак» перекрывал сам товар.

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

Правильное расположение копирайта

Возможное расположение копирайта с лого магазина (позволяет и раскрутить вашу торговую марку, делает ее узнаваемую).

Копирайт очень просто вырезается различными графическими редакторами

Точно также, эта же рекомендация касается и обзоров продуктов. Можете поставить «водяной знак» и туда же.

Совет

Если уже у вас накопилось достаточное количество фотографий товаров для магазина — вы можете автоматизировать наложение «водяного знака» на них. Об этом я рассказывал в своей статье и видео-уроке «Как сделать копирайт на фото для 1000 картинок за 20 секунд для Вашего Интернет-магазина»

Читайте также:  Палка для селфи для фотоаппарата: как выбрать качественную

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

Точно такая же функция уже есть в программе для управления магазином – Store Manager for PrestaShop (что это такое — смотрите в моей статье – «Управление интернет магазином с помощью Store Manager» )

С этими важными моментами я прояснил ситуацию, а теперь перейдем к самому важному!

В каком формате сохранять фото товаров?

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

Формат JPG или JPEG – используется в 90% на всех магазинах. За счет того, что изображение сжимается при сохранении, позволяет существенно экономить размер графических файлов.

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

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

Оптимальным является качество сжатия равным70-85% для фотографий. Не ставьте 100 % – изображение будет очень большое по размеру, а разницы клиенты не почувствуют. При этом, магазин будет грузится дольше за счет больших размеров картинок в Кбайтах.

Размер файла — 92 Кб Размер файла — 48 Кб

Не ставьте качество сохранения 50 и меньше — размер в Кб будет мал, но качество картинки будет хуже. Обратите внимание на текст, он уже начал портиться.

Размер файла — 48 Кб Размер файла — 48 Кб

Экспериментируя со сжатием вы сможете ускорить работу (показ товаров) для вашего магазина.

Если же вы хотите добавить фото с прозрачным фоном — вам нужен другой графический формат — PNG.

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

Детальнее про формат PNG – на сайте Википедии

Минус этого формата — это форма сохранения данных с “без сжатия”. Хотя сжатие происходит по хитрому алгоритму Deflate. Размер фото продуктов для этого формата будет увеличиваться. За прозрачный фон и хорошую картинку придется расплачиваться.

Используйте формат PNG если вы должны показать четкие схемы или графически чертежи или логотипы. Этот формат не годится для показа товаров в виде фотографий.

Вы можете сами попробовать провести оптимизацию фото товаров через графические программы, например Adobe Photoshop (это платный редактор) или Pain.NET (это бесплатный редактор). Скачать Pain.NET вы можете по этой ссылке.

Смотрите видео пример, как забрать фон на фотографии товара.

Обратите внимание

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

Например XnViewer – www.xnview.org

у него тоже есть функции выбора качества сохранения изображения и русский интерфейс.

Для массовых операций с фото товаров я рекомендую IrFanViewer. Маленькая, но очень полезная и мощная программа.

Вы можете скачать ее на сайте разработчика — www.irfanview.com
Эта программа умеет добавлять «водяные знаки», массово меняет размеры фото, или меняет формат всех выбранных фотографий с нужной степенью сжатия за пару кликов.

Привожу краткий видео-пример, как изменить много товаров в формат jpg и при этом изменить размер фотографии. Вы можете увидеть работу программы в оригинальном английском интерфейсе. Также есть возможность добавить и русский язык. Просто скачайте язык и добавьте его в папку программы – IrfanViewLanguages

Какой размер фотографий нужен для Интернет-магазина?

Некоторые мои клиенты делали фото размером 2560 х 1400 пикселей. Конечно, такой формат сможет показать все детали товара.

Но будьте реалистами, как много пользователей имеют мониторы с таким расширением? Кроме того, такие файлы очень больше по размеру, следовательно занимают по 2-3 Мбайта даже в формате Jpg и не помещаются на монитор пользователей. Я бы рекомендовал для себя хранить минимально доступный размер фото товаров 1000 х 700 пикселей.

Почему так мало?

Во-первых, большинство современных ПК уже имеют подобные расширения экрана как оптимальные (1024 х 768). Добавьте сюда еще прокрутку, и панель закладок в броузере.
Этот размер фото позволит вам комфортно просматривать изображения всем клиентам. Хотя большинство движков магазинов позволяют масштабировать крупные изображения при загрузке, я бы держал 2 набора фотографий.

Важно

Набор 1 — для публикаций, для постеров, для дизайна — крупные фото, с высоким разрешением.

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

На текущий момент (2013-2014 года) это разрешение 1280 x 1024 пикселей. Вы можете узнать стандартные расширения мониторов и подстраиваться под них.

Резюмируем:

Для фото товаров магазина используем JPG с степенью сжатия изображения 75 – 80%

Размеры фото должны быть до 1000 х 700 пикселей.

Если вам нужны фото с прозрачным слоем — используем формат PNG-24

Если вам нужно изменить размеры 1000 фото — используем массовые преобразования IrFanViewer

Если вы хотите удобно просмотреть все свои фото — используем XnViewer

Если вы хотите учиться дальше — читаем мои статьи 🙂



Что еще почитать из цикла “Как открыть Интернет-магазин?”

 Колонка редактора сайта

Источник: https://www.emagazin.info/ru/format-foto-tovarov

Задаем фотографии оптимальный размер для интернета

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

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

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

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

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

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

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

Picture Manager – одна из самых простых утилит, широко используемая для решения данной задачи.

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

Совет

Вам предлагаются стандартная высота и ширина в каждом из перечисленных случаев. Для использования в интернете выбираете соответственно «веб», для отправки сообщения посредством электронной почты – «сообщение» и для использования фотографии для различных документов, например, для вашего curriculum vitae – «документ».

Для того, чтобы уменьшить размер фотографии в фотошопе, необходимо зайти в меню “Image” и выбрать опцию “Image Size”.

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

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

Если вы спросите, какой стандартный приемлемый размер фотографий используется в интернете, то мы ответим, что на сайтах социальных сетей используются фото размером до 700 пикселей, для пересылки по электронной почте допустимы размеры до 1000 пикселей.

Источник: Масштабирование фотографии для веб ресурсов

Источник: https://seregaborzov.wordpress.com/stateiki/razmer-photo/

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

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

Какая из этих картинок привлекает больше внимания?

Больше всего лайков собрала статья с первой картинкой.

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

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

Для чего нужны изображения

Давайте сначала определимся, что дают нам изображения:

  1. Помогают продвижению сайта
  2. При первом посещении страниц помогают понять тематику сайта и создать соответствующее настроение.
  3. Привлекают внимание к товарам или услугам, вызывают желание заказать.
  4. Становятся элементами навигации и помогают ориентироваться на сайте.
  5. Располагают к чтению текстов и облегчают их восприятие, так как позволяют разбавить длинные описания.
  6. Повышают доверие к компании и бренду, если речь идет о фотографиях офиса, процесса работы, сотрудников.
  7. Развлекают, особенно, если содержат юмор.

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

На каких страницах картинки необходимы

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

1. Главная страница

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

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

Плохой пример: изображение больше ассоциируется с турагентством или блогом о путешествиях, но не с ремонтом квартир:

Обратите внимание

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

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

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

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

Хороший пример: простой и понятный слайд на сайте Зоомагазина

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

Читайте также:  Софтбокс на вспышку: что это такое и зачем нужен

Картинки должны быть небольшого размера и полностью кликабельными.

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

Пример хорошо подобранных изображений для списка услуг:

В основном тексте на Главной лучше использовать иконки для выделения преимуществ компании.

Текст не должен быть длинным (рекомендуемый объём 1500-2000 символов), поэтому нет смысла «разделять» его изображениями.

Иконки следует выбирать в едином стиле и одного размера, тогда информация будет выглядеть аккуратно:

2. Страница о компании

Страница является продолжением Главной и закрепляет впечатление о компании.

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

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

Пример фотографии процесса работы:

Также хорошо повышают доверие фотографии сотрудников, которые можно дополнить контактами отделов.

Важно

Если компания большая, то покажите хотя бы основные лица компании:

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

3. Страницы товаров

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

Покажите товар с разных ракурсов (не более 10 штук, не менее трех), чтобы пользователи смогли рассмотреть его с разных сторон. Так клиент быстрее примет решение о заказе.

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

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

И хороший пример того, как подробно показать товар

4. Портфолио

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

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

Хороший вариант деления работ: можно отфильтровать проекты по виду дизайна:

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

Пример, как делать не нужно:

5. Блог

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

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

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

Пример непривлекательного раздела статей:

С изображениями анонсы выглядят ярче:

В тексте статьи лучше разместить изображение, как минимум каждые 2 экрана текста, чтобы визуально разгрузить текст.

Фрагмент статьи с правильным использованием изображений:

Какими должны быть изображения

Правила общие для всех страниц, некоторые из них уже указаны выше, а также в статье «Добавляем картинки и видео на сайт: на что обратить внимание?» – прочитайте обязательно, но повторим их для закрепления информации.

Изображения должны:

  1. Соответствовать тематике и аудитории сайта, а также тексту рядом. Не путайте пользователей.
  2. Быть качественными. Фотографии с потерей резкости, мутные и содержащие «шум» только испортят впечатление о сайте и помешают клиенту выбрать товар.
  3. Быть реальными. Изображения из фотобанков кочуют с сайта на сайт, и пользователи уже легко узнают их и не верят им. Для статьи в блоге, конечно же, можно взять шаблонную картинку, но ни в коем случае не добавляйте ее на страницу о компании или в портфолио, и уж тем более для карточки товара.
  4. Быть без водяных знаков. Они не спасают от копирования и только портят изображения. Как уберечь фото и видео от копирования, читайте здесь.
  5. Быть в едином стиле. Понимаем, что для всего сайта сложно выполнить данное условие, но хотя бы для одной страницы они должны быть похожими: одинаковой ширины и выровнены по одной линии.
  6. Иметь небольшой вес, то есть быть размером не более 80-100 килобайт, чтобы не увеличивать время загрузки сайта. Исключение составляют увеличенные версии изображения, которые могут быть тяжелее.
  7. Быть в формате GIF, PNG или JPEG. Не рекомендуем использовать форматы BMP и TIFF, чтобы не было проблем с корректной загрузкой контента.

В дополнение к правилам рекомендуем посмотреть статью «На что люди обращают внимание при просмотре сайта».

Где брать изображения для сайта?

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

1. Услуги фотографа

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

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

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

2. Фото производителей

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

3. Фотостоки и фотобанки

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

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

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

Название изображений

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

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

Примеры плохих названий:

  • Kniga065745932.png – непонятные цифры
  • IMG85416.jpg – неинформативный вариант
  • kupit-sumka-nedorogo-gucci.jpg – спам

Хорошие варианты:

  • kurtka-reebok-belaja-front.jpg
  • kartina-mone-soroka.jpg

Атрибут alt

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

Атрибут alt нужен поисковым системам и пользователям, у которых по каким-либо причинам не отобразилось картинка (на ее месте будет отображаться указанный текст).

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

Неудачные примеры alt:

  • alt=”туфли pollini белые, черные, красные, фото, цена, отзывы” – снова спам
  • alt=”блузка” – мало информации
  • alt=”78823094093″ – неинформативный вариант

Правильное заполнение alt:

  • alt=”кеды adidas зеленые”
  • alt=”Сальвадор Дали Пейзаж близ Алепурдана”

Индексация

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

Заключение

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

© 1PS.RU, при полном или частичном копировании материала ссылка на первоисточник обязательна.

Источник: https://1ps.ru/blog/sites/bad-design/

Как уменьшить размер фото для размещения в интернете

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

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

Для этого наш файл с фотографией щёлкаем правой мышкой, открывается меню: нажимаем левой мышкой “открыть с помощью”, открывается ещё меню: выбираем в меню программу Paint. Итак наше фото открыто програмой Paint.

(Кстати можно по другому сделать: сперва отрыть програму Paint, потом в верхнем меню Файл —> Открыть, ищем нашу фотку на компьютере и открываем её.

) Затем в верхнем меню нажимаем левой мышкой “Рисунок” далее в открывшемся меню “Растянуть/наклонить” или вместо этого нажимаем на клавиатуре одновременно две кнопки Ctrl W и открываются настройки “Растянуть” и ниже “Наклонить”. Нам нужно работать с настройками “растянуть”.

Совет

По умолчанию вы видите в настройках “100%” по горизонтали и вертикали. Уменьшаем фото, поставив на глазок 70% в окне “по горизонтали” и 70% в окне “по вертикали”. Затем нажимаем в этом окне “ОК” и смотрим на сколько уменьшилась фотка.

Если нас это уменьшение не устраивает, то в верхнем меню нажимаем “Правка”, затем отменить или вместо этого нажимаем на клавиатуре сразу две клавиши “Ctrl Z” и все ваши изменения в размере фото отменятся, т.е. фото будет прежнего размера. И теперь начинаем сначала подставлять цифры в процентах в окно “по горизонтали” и в окно “по вертикали. (В эти окна обязательно надо ставить одинаковые цифры, иначе изображение на фото исказится.)

После очередной попытки, когда вас размер фото устраивает, то в верхнем меню нажимаем “Файл” затем “Сохранить как”. У нас выскакивает окно сохранения файла.

Здесь надо внизу окна указать “имя файла” (латинскими буквами или цифрами) и тип файла, для интернета обычно подходит “JPG” или “JPEG”. Потом нажимаем кнопку справа “Сохранить”, предварительно запомнив в какую папку на компьютере вы сохранили своё фото.

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

Выше рассказано, как уменьшить фото у себя на компьютере, но это можно также сделать ниже в программе:
Для этого нажимаем Загрузить изображение с компьютера, выбираем изображение и нажимаем открыть. Теперь ваше фото находится в программе и с ним можно работать, в данном случае нам надо уменьшить размер.

Нажимаем в верхнем меню Изображение —> Размер изображения. В табличке уменьшаем ширину или высоту изображения, например ширину поставим 900 и высота соответственно уменьшится (галочка Сохранить пропорции должна стоять. Нажимаем Да и фото уменьшилось в размерах.

Затем в верхнем меню нажимаем Файл –> Сохранить, в появившемся окне можно немного изменить качество изображения, но лучше оставить по умолчанию 80, формат оставить JPEG, имя файла можно оставить как есть или переименовать латинскими буквами или цифрами, но обязательно в конце имени файла добавить .jpg ( например файл назовём fotka.

jpg ) и затем нажимаем Да и сохраняем уменьшенную фотку у себя на компьютере, который потом легко загружаем на сайт в интернете.

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

Если что-то непонятно ниже в комментариях задавайте вопросы.

Поделитесь этой страничкой со своими друзьями.

Источник: http://www.videostart.ru/page/umenshenie-razmera-podgotovka-foto-dlja-interneta

Ссылка на основную публикацию