Сжатие картинок для web — обзор инструментов

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

сжатия картинок сайта

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

В данной статье я расскажу вам о графических форматах, онлайн сервисах TinyJPG и TinyPNG, программе для сжатия картинок FileOptimizer и результатах проведённых исследований.

GIF, JPEG или PNG?

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

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

Совете: выбирая тот или иного формат, смотрите на конечное качество и размер файла конкретной картинки.

Сжатие картинок онлайн

Онлайн сервисы сжатия картинок TinyJPG и TinyPNG созданы нидерландской студией Voormedia. Их простой и понятный интерфейс на английском языке не вызывает трудностей даже у начинающих пользователей.

Предлагаемый онлайн сервисами API позволяет сжимать картинки буквально «налету». Сжатие до 500 картинок в месяц – бесплатно. Для блогов на движке WordPress есть и готовый плагин.

Если же вам нужен Photoshop плагин, доступный для Mac и Windows, придётся раскошелиться. Цена вопроса – $50.

TinyJPG

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

TinyJPG
Сжатия JPEG картинок онлайн в TinyJPG

За раз добавляется до 20 картинок, но размером не более 5 Мб каждая. Сервис автоматически анализирует и выбирает оптимальный вариант сжатия, а результат скачивается или сохраняется на Dropbox.

Для проверки сервиса взята фотография, сохранённая в Photoshop в формате JPEG с Hight качеством (60%) и установленной галочкой «Optimized». Исходный размер файла составил 121 Кб. После обработки картинки в TinyJPG получен файл на 6% меньше оригинала. Его размер составил 113 Кб.

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

TinyPNG

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

TinyPNG
Сжатия PNG картинок онлайн в TinyPNG

Для проверки сервиса взята фотография, сохранённая в Photoshop в формате PNG-24 с отключенной прозрачностью. Исходный размер файла составил 727 Кб. После обработки картинки в TinyJPG получен файл на 75% меньше оригинала. Его размер составил 179 Кб.

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

Программа FileOptimizer для сжатия картинок

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

Примечание: FileOptimizer сжимает файлы без потери качества разных форматов: 3GP, .APNG, .BMP, .CHM, .CSS, .DOC, .EPUB, .FB2, .GIF, .HTML, .ICO, .JAR, .JPEG, .JPG, .JS, .MP3, .MP4, .PDF, .PNG, .PSD, .SVG, .SWF, .TIF, .TIFF, .ZIP и т.д.

Бесплатно скачать последнюю версию FileOptimizer вы можете из репозитария на SourceForge, проследовав по этой ссылке. Там есть все её версии, но нас интересует ссылка на инсталлятор последней версии.

Программа FileOptimizer для сжатия картинок
Программа FileOptimizer для сжатия картинок

Сжатие изображений в программе FileOptimizer

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

Сжатие изображений в программе FileOptimizer
Сжатие изображений в программе FileOptimizer

Кликните пункт «Add files…» и (в отрывшемся окне) выберите файлы для сжатия.
Кликните пункт «Optimize all files» и дождитесь, когда статус в столбце «Status» добавленных в список файлов изменится на «Done» (с англ. сделано).

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

Для проверки программы взята фотография, сохранённая в Photoshop в формате JPEG с Hight качеством (60%) и установленной галочкой «Optimized». Исходный размер файла составил 121 Кб. После обработки картинки в FileOptimizer получен файл на 4% меньше оригинала. Его размер составил 116 Кб.

Для проверки программы взята фотография, сохранённая в Photoshop в формате PNG-24 с отключенной прозрачностью. Исходный размер файла составил 727 Кб. После обработки картинки в FileOptimizer получен файл на 5% меньше оригинала. Его размер составил 696 Кб.

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

Примечание: Google онлайн сервис анализа сайтов PageSpeed Insights считает картинки сжатые в FileOptimizer приемлемыми. Да и качественные картинки должны ранжироваться в поисковиках лучше.

Короткая ссылка: http://goo.gl/M6SDVe