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

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

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

Оптимизацию изображений можно рассматривать в 2 аспектах:

  • уменьшение веса изображений для увеличения скорости загрузки страницы;
  • как составляющая SEO – о птимизации — в этом случае кроме уменьшения веса изображениям присваиваются подходящие названия и прописываются альт теги.

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

Введение: Для чего уменьшать вес изображений на сайте

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

Статистические исследования показывают, что посетители ждут загрузки сайта порядка 3 секунд на стационарных компьютерах и 5 — на телефоне!

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

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

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

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

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

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

Для уменьшения веса изображения:
  1. Определите размер изображения, которое будет отображаться на сайте.
    Не загружайте исходные картинки сразу. Если на сайте выводится изображение с размерами 500*600 пикселей, а загружается картинка в 3 раза большего размера, время загрузки будет такое же, как для исходной.

Уменьшите размеры.

1. Как уменьшить размер изображения в Paint

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

1. Открываем картинку в Paint и на верхней панели кликаем «Изменить размер».

2. В открывшемся окне вводим необходимые размеры (можно изменять в процентах, можно в пикселях. По умолчанию в Paint стоит галочка «Сохранять пропорции», это позволит уменьшить изображение без искажений), жмем «ОК».

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

Теперь сравним исходное изображение и итоговое:

исходное изображение с размерами 2184*1456 пк и весом 735 Кб после уменьшения до 750*500 пк стало весить 142 Кб — вес уменьшился в 5 раз!

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

2. Как уменьшить размер изображения в P hotoshop

1. Открываем файл в редакторе, в верхней панели выбираем вкладку Image (Изображение)Image Size (Размер изображения).

2. В открывшемся окне можно менять параметр ы ширины ( Width ), высоты ( Height ) и разрешения ( Resolution ). Причем, для сохранения пропорций должен быть отмечен флажок Сохранять пропорции ( Constrain Proportions ), в этом случае при изменении одного из параметров, другие меняются автоматически.
Для публикаций графики в вебе разрешени е составляет 72пк/дюйм.

Вводим необходимые параметры и жмем «ОК».

3. Сохраняем изображение.

Для сохранения изображения есть три варианта:

  • Сохранить ( Save (Ctrl+S) ) ;
  • Сохранить как ( Save As (Shift+Crtl+S) );
  • Сохранить для веб ( Save for Web (Shift+Ctrl+Alt+S) ).

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

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

    Формат ( как говорили выше, jpeg );

Качество ( Quality ) – этот параметр изменяется от 0 до 100, соответственно при этом итоговое изображение будет лучшего или худшего качества.
В окне слева от параметров на вкладках вы можете выбрать варианты отображения: Оригинал, Оптимизированное, 2 вари анта (одновременно отображается сохраняемое и итоговое изображение), 4 Варианта (отображаются оригинальное изображение, изображение с параметрами, которое вы задали, и 2 промежуточных).

Я обычно выбираю 2 Варианта ( 2-Up ) — меняя качество можно одновременно видеть изменения в изображении и подобрать оптимальное для конкретного случая. Для статьи меня устроило качество 50, но это не постоянная величина, чаще я сохраняю изображения в пределах 60-75.

Снизу под отображаемыми вариантами выводятся данные итогового изображения в зависимости от заданных настроек ;

Отмечаем галочку Прогрессивный ( Progressive ).
И тоговое изображение будет загружаться не построчно, а за несколько подходов.
Вам наверняка приходилось сталкиваться с такими случаями, когда вы видите не половину загруженной картинки, а сначала — полностью — плохого качества, потом — все лучше и лучше . Но с самого начала загрузки пользователь имеет представление о том, что на изображении. Вес прогрессивного может быть на несколько килобайт больше оптимизированного, но эта разница незначительна. Практика показывает, что прогрессивный джипег позитивнее воспринимается пользователями.

Размеры.
Если вы хотите изменить размеры изображения, они задаются в этом же окне снизу .

После выбора необходимых настроек жмем «Сохранить» ( Save ) и получаем оптимизированную для сайта картинку.

Анализируем результаты оптимизации изображения в Фотошопе:

исходное изображение все то же 2184*1456 пк, 735 Кб, после уменьшения до 750*500 пк: при обычном сохранении 1 59 Кб — вес больше, чем при уменьшении в Paint, Сохранение для Веб (при качестве 50) — 63,7 Кб. Сжатое изображение в есит 11.5 раз меньше. Не забываем, что ко всем прочим плюсам джипег еще и прогрессивный.

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

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

3. Онлайн-сервисы по оптимизации изображений

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

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

Форматы .jpg, .png, .gif. Предоставляет 3 варианта оптимизации:

  1. Сжатие с потерями Lossy — выбрано по умолчанию ;
  2. Сжатие без потерь — Lossless ;
  3. Expert – с выбором параметров оптимизации .

Загружаем файлы, которые надо оптимизировать.

По завершению оптимизации сервис выдает отчет о результатах. Для нагрузки файла жмем на кнопку « Do w nload File » — уменьшенная картинка открывается в соседней вкладке.

Если результат устраивает, сохраняем изображение (клик на фото правой кнопкой мыши — Сохранить как)

3. JPEG Mini

Простой интерфейс, результат оптимизации можно посмотреть сразу же. Работает только с форматом jpeg.

4. Puny PNG

Сервис сжатия изображений в JPG, PNG и GIF- ф орматах. Имеет ограничени е по весу в 500 Кб и количеству 20 одновременно.

4. Уменьшение размера с помощью плагинов сжатия изображений

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

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

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

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

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

А еще — задавайте вопросы, пишите в комментариях, оказалась ли статья полезной. Если да, ставьте лайки и делитесь с друзьями.
Удачи и хорошего настроения.

Как сжать фото онлайн

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

Что такое сжатие фото и где используется

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

  1. С сохранением качества.
  2. С потерей качества.

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

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

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

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

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

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

Инструкция:

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

Нажмите на кнопку «сжать изображения».

Ожидайте окончания конвертации. С медленным соединением времени требуется больше.

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

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

Основные преимущества:

  • Простота использования. Весь процесс автоматизирован.
  • Приемлемое качество изображений после сжатия.
  • Интеграция с облачными сервисами.
  • Возможность одновременного сжатия нескольких файлов.

Основные недостатки:

  • Поддержка только двух облачных хранилищ.

Imagecompressor

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

Инструкция:

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

Дождитесь загрузки фотографий на сайт. Оптимизация произойдет автоматически.

Если требуется увеличить или уменьшить сжатие, выберите соответствующий файл, после чего передвиньте регулятор в одну из сторон. Для сохранения настроек нажмите на кнопку «СОХР.»

Что бы загрузить обработанные файлы нажмите на кнопку «скачать все».

Основные преимущества:

  • Обработка до 20 файлов за один раз.
  • Регулировка качества для повышения сжатия.
  • Простота работы с сервисом.

Основные недостатки

  • Нет интеграции с облачными хранилищами.

websiteplanet

Бесплатный инструмент для сжатия PNG и JPG изображений в автоматическом режиме. За один раз разрешается добавить до 40 фотографий. Объем каждого снимка не должен превышать 50 МБ. Сжатие отдельных файлов достигает 90%, в частности на объемных файлах. При этом бывает и обратная ситуация, когда после сжатия снимок получается больше, чем исходный. Сжатые файлы разрешается скачать одним архивом или отправить в облачный диск Google Drive и DropBox.

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

Инструкция:

Перетащите в браузер до 40 изображений или кликните на картинку с загрузкой и укажите картинки.

Дождитесь окончания загрузки и конвертации.

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

Основные преимущества:

  • Обработка до 40 файлов за один раз, объемом до 50 МБ каждый.
  • Простота использования.
  • Отображение индивидуальной и общей статистики сжатия.
  • Интеграция с облачными дисками Google Drive и DropBox.

Основные недостатки

  • Фиолетовое оформление вызывает сильное утомление.
  • Некоторые фотографии при сжатии увеличиваются в размере.
  • Нельзя регулировать качество.
  • Поддерживаются только расширения PNG и JPG.

Бесплатный сервис без необходимости регистрации. Позволяет сжимать фото в формате PNG и JPG по стандартному алгоритму: чем выше установлено сжатие, тем хуже качество на выходе. Несомненное преимущество сервиса – простота работы и возможность загрузки больше 150 картинок за один раз.

Инструкция:

Перетащите в браузер необходимые для сжатия фотографии.

Установите предпочтительное качество. По умолчанию 85/4 для JPG и PNG соответственно.

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

Для начала конвертации нажмите «Получить».

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

Основные преимущества:

  • Простота работы с онлайн сервисом.
  • Возможность обработать за один раз более 150 картинок.
  • Доступна регулировка качества фотографий.

Основные недостатки

  • Нет интеграции с облачными сервисами.
  • Поддержка только двух форматов – PNG и JPG.

Теперь вы знаете, как сжать фото онлайн. Рассмотренные сетевые сервисы бесплатны, а так же актуальны на тот случай, если под рукой нет программ для сжатия или продвинутых графических редакторов. Качественными алгоритмами сжатия располагают сервисы Iloveimg и Imagecompressor, а img.seobro позволяет обрабатывать десятки и сотни изображений за один раз. А вот с websiteplanet при учете неплохих возможностей, лучше не работать. Жуткое фиолетовое оформление вызывает сильную усталость глаз и головную боль.

А какими способами вы сжимаете фотографии? Поделитесь мнением в комментариях под статьей.

Как уменьшить размер файла JPG без потери качества

Доброго времени суток! Если у Вас, сотни мегабайт в небольшой папке с фотками? Или же картинки отправляются по почте более 10 минут, даже при приличной скорости интернета? Или вот так, для отправки архива фотографий на флешку нужны полчаса? Добро пожаловать в нужное место, в статье я расскажу, в какой программе и как уменьшить размер файла JPG без потери качества.

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

Как уменьшить размер файла Jpg — немного нужной теории

Касательно формата JPG (и его разновидности JPEG), есть 3 способа изменения размера файлов. Размер PNG, BMP, GIF и прочих графических форматов можно регулировать лишь первым методом.

  1. Уменьшение разрешения картинки (количества пикселей) без потери качества;
  2. Снижение качества без уменьшения разрешения;
  3. Одновременное снижение и разрешения, и качества.

Любая фотография – набор пикселей. У современных фотоаппаратов их число превышает 2-4 тысячи по горизонтали и вертикали. Это много, от такого разрешения и «разрастаются» мегабайты. Улучшается ли при этом качество изображения? Практически нет, особенно у непрофессиональных фотографов при повседневной съёмке. Так как изменить разрешение фотографии можно практически безболезненно для качества, многие используют именно этот способ для того, чтобы уменьшить изображение.

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

Сжав изображение в 2 раза (на 50%, в терминах графических редакторов), мы уменьшим его площадь (и объём!) в 4 раза, школьная геометрия на практике.

Логично уменьшить количество точек, чтобы снизить размер фотографии – и не заметить изменений в качестве.

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

  • 100% — сжатие рисунка отсутствует;
  • 90% — настройка по умолчанию во многих программах – минимальное сжатие;
  • 80% — более глубокая степень: файлы сжимаются довольно сильно;
  • 70% — всё ещё приемлемая потеря качества, но в пределах разумного;
  • 50% и ниже – кардинальное снижение внешнего вида рисунка, заметное невооружённым взглядом.

к оглавлению ↑

Как сжать изображение: практикум в графических редакторах

Экспериментировать будем с этим «натюрмортом»: рядовая телефонная фотка, не претендующая на художественность, скорее – класса «страшно показать», но для семейного архива подойдёт.

Технические детали: формат JPG, разрешение 2560 на 1920 точек, вес файла-исходника – неприемлемые 2,44 Мб. Перед тем, как сжать фотографию, рекомендуем скопировать её в отдельную папку, чтобы не потерять рисунок в ходе процесса сжатия.

Исходный файл: 2,44 Мб, с расширением 2560×1920 пикселей

Сжатие изображения в Paint

Зря этот стандартный графический редактор из комплекта Windows считают несерьёзным инструментом. Во-первых, в нём очень интересно и полезно обучать «чайников» азам ПК-грамотности, во-вторых, он есть везде и всегда – и, когда на компьютере не установлена более мощная программа для работы с графикой, его возможности выручат не раз.

Открытие исходника в Пэйнт: количество точек потрясает, но их число вовсе не означает красоту или качество. Масштаб: 100%.

Чтобы открыть изображение в Paint, нужно щёлкнуть по файлу правой кнопкой и выбрать «Редактировать».

Этот редактор не позволяет вручную настроить уровень сжатия JPG, но, по ощущениям, устанавливает его примерно на 80%. Достаточно пересохранить файл, чтобы вместо исходных 2,44 Мб получить 1,83 Мб. На глазок уровень качества осталось практически тем же.

Изображение сжалось до 1,83 Мб после пересохранения в Paint за 2-3 клика и 10 секунд.

В арсенале Paint есть способ уменьшить размер картинки в пикселях. Это кнопка «Изменить размер» (Resize). При её нажатии выпадает диалоговое окно, где предлагается ввести новые размеры по горизонтали/вертикали в процентах от исходного количества точек.

Выберем 50 на 50: в 2 раза меньше длины и ширины означают площадь, меньшую в 4 раза. Кстати, разрешение нужно менять одинаково по обоим измерениям, иначе картинка деформируется.

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

Результат – 616 килобайт. Маловато для семейного архива, но – отлично для публикации на сайтах. Без лупы разница с исходником едва заметна.

616 килобайт при разрешении 1290×960 px.

Отметим, что 0,6 мегабайт получилось не только в результате изменения разрешения, а при помощи «комбинированного» метода – размер изображения в Paint корректируется ещё и снижением качества JPG на величину около 85%. Изменить значение параметра compress в нужную сторону невозможно. Пейнт делает это на автомате.

Уменьшаем размер изображения в Photoshop

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

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

Открыв файл в редакторе Photoshop, следует выбрать раздел «Изображение», в нём кликнуть на пункт «Размер изображения». Как показано на картинке ниже.

Откроется диалоговое окно, где можно вручную задать высоту и ширину рисунка. Кнопка ОК – сохраняем файл. Этот же диалог вызывается горячими клавишами «Ctrl+Alt+I», быстрое сохранение результата, сочетание клавиш– «Ctrl+S».

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

Открываете photoshop, далее кликаете на меню «Файл» выбираете «Сохранить для Web…» или используете сочетание клавиш «Alt+Shift+Ctrl+S», как Вам будет удобно.

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

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

Обратите внимание, Слева с верху — Исходник, далее идут уже с сжатием.

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

Перёд сохранением можно также выставить размер изображения. Которое нужно Вам. И нажать сохранить, выбрать путь для записи и все готово.

Лучшие программы для сжатия. Пакетная обработка

Paint под рукой всегда, но слишком примитивен. Фотошоп избыточно громоздкий и неповоротливый. Какие программы лучше подойдут, чтобы сжать JPG? Хорошие просмотрщики-вьюеры, они же – менеджеры изображений! Их достоинство – поддержка пакетного сжатия: одновременной обработки всех или нескольких выбранных файлов в любой папке вместо ручного изменения рисунков по одному.

ACDSee, XnView и IrfanView: лишь тройка из многочисленных программ для сжатия картинок всем скопом. Бесплатная, но вполне работоспособная версия есть даже у насквозь коммерческого «ЭйСиДиСи». Если программа не русифицирована, следует запомнить слово Compress – «Сжатие». Разберём технологию пакетного сжатия на примере графического обозревателя XnView.

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

Просмотрщик и редактор XnView говорит, что 9 файлов занимают почти 20 Мб. Непорядок!

  1. Выделив все файлы разом (Ctrl+A, либо мышкой), выбираем «Пакетная обработка» – кнопка выделена зелёной рамкой.
  2. Во вкладке «Преобразования» есть параметр «Изменение размера» – нам туда.

Вкладка пакетных преобразований в XnView: обратите внимание на десятки способов одновременной быстрой редакции картинок.

…Те же 9 фото, чей общий размер составляет менее 5 Мб. Программа смогла сократить файл-образец до 800 килобайт.

В арсенале просмотрщиков присутствуют и функция «Сжатие JPEG» без снижения разрешения.

Сжатие изображения в онлайн сервисах

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

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

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

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

TinyJPG.com — Забугорный сервис

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

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

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

IMGonline.com.ua — удобный и понятный

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

Один из бесплатных онлайн-сервисов.

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

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

Обработка рисунков в Mac OS

Давайте рассмотрим процесс работы с изображениями на Mac, к примеру, рисунки отлично сожмёт стандартное приложение «Просмотр»: установка дополнительного ПО ни к чему, даже для пакетной обработки. Программа «Просмотр» на Маке знает, как изменить размер сразу нескольких фото.

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

Заключение

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

Наши рекомендации о том, как уменьшить размер файла JPG:

  1. Установить и использовать повседневно любой качественный менеджер графических файлов.
  2. Забыть о Фотошопе: это слишком мощный и неповоротливый редактор для таких простых задач.
  3. Использовать онлайн-сервисы лишь когда под рукой нет других способов – а для одиночных файлов пользоваться Paint’ом.

Дисклеймер: ни одна собака в ходе художественных и программных экспериментов не пострадала. : )

Как уменьшить размер фото онлайн сервисами и софтом

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

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

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

Зачем менять размер картинки

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

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

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

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

Если же ресурс имеет функцию автомасштабирования, то это не значит, что не стоит изменять размер картинки. Дело в том, что чем больше разрешение изображения – тем больше оно весит.

И даже когда масштаб сжимается в миниатюру, при ее открытии вам все равно придется прогружать картинку.

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

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

Как работает изменение масштаба

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

Это очень простой процесс, который доступен всем фоторедакторам – как онлайн, так и обычным.

Немного другая ситуация обстоит с изменением размеров всей фотографии. Каждое цифровое изображение имеет в себе три переменных – высоту, ширину и разрешение.

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

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

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

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

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

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

Как бесплатно обрезать фото в онлайне

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

Croppiconline.com — пожалуй самый популярный сервис. Это элементарный онлайн-фоторедактор, в котором каждый сможет обрезать нужный ему кусок изображения, уменьшить его или подредактировать.

При этом внутри него одновременно можно работать сразу с десятью фотографиями.

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

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

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

Стоит так же сказать о том, что программа выдает данные о размере объекта, а также его весе.

Pixlr Editor — ещё одна полезная онлайн программа. Она является аналогом фотошопа, не требует установки, и обладает почти всем необходимым среднестатистическому пользователю функционалом.

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

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

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

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

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

Работа с графикой в фоторедакторах

Одной из самых простых программ для работы с любой графикой является Paint.NET.

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

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

Итак, для начала – загрузите нужную вам картинку в утилиту.

После этого выберите инструмент «Выделение». Он настроен на прямоугольную область, но вы можете выбрать ее форму при необходимости.

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

После этого откройте вкладку «Изображение» и выберите «Обрезать по выделению». После этого вы получите готовое изображение нужной вам формы.

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

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

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

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

Как изменить размер фото в Фотошопе

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

Здесь нужно сделать несколько оговорок:

  1. Во-первых, Фотошоп – платная программа, пиратской версии последних версий которой либо нет, либо ставятся через довольно сложные для рядового пользователя процессы. К счастью, всегда можно скачать пробную версию, либо воспользоваться портативной. В ней будет намного меньше функционала, однако она бесплатна, и даже не требует установки на компьютер.
  2. Во-вторых, не стоит ради одной этой функции устанавливать себе на компьютер такую вещь как «Фотошоп». Это профессиональный редактор, и обычному пользователю лучше воспользоваться онлайн-версиями, приведенными в статье выше.

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

После этого перейдите в меню «Изображение» далее «Размер Изображения», где вы увидите все данные картинки.

А можно сделать еще проще, по плашке окна с картинкой кликнуть правой кнопкой мыши и выбрать соответствующий пункт.

Что мы в итоге видим:

  • Размеры — здесь можно выбрать единицу измерения объекта (удобней всего работать в пикселях).
  • Подогнать под — из выпадающего списка можно выбрать готовые форматы, под которые картинка автоматически будет подогнана.
  • Ширина и Высота — именно вы этих окнах работаем со значениями отвечающими за высоту и ширину объекта, который вы хотите изменить.
  • Разрешение — это величина, определяющая количество точек на единицу площади.
  • Ресамплинг — отвечает за изменение объёма данных изображения при изменении его размеров.

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

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

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

Читать еще:  Аутентификация — что это такое и почему сейчас повсеместно используется двухфакторная аутентификация
Ссылка на основную публикацию
Adblock
detector