CodeKitHubЗачем его использовать?
- 100 % локальное хранение: изображения никогда не покидают ваше устройство — это безопасно для личных фотографий и неопубликованных эскизов.
- Без ограничений: нет ограничений на максимальный размер файла, нет суточной квоты, нет водяных знаков, не требуется регистрация.
- Пакетный режим — загрузите сразу несколько изображений, каждое из которых будет скачиваться отдельно.
- Регулятор качества + изменение размера с фиксированной максимальной шириной + вывод в формате JPG/WebP — три настройки, которые действительно имеют значение.
- Показывает точную экономию на каждом изображении, чтобы вы могли оценить соотношение затрат и выгоды.
Часто задаваемые вопросы
Не ухудшится ли качество моих изображений из-за сжатия?
При качестве 70–85 % различия практически незаметны при просмотре фотографий на экране. Заметные артефакты появляются при качестве ниже ~50 %. Исключение составляют скриншоты с большим количеством текста — в формате JPG на них артефакты появляются раньше; для таких скриншотов попробуйте использовать формат WebP или устанавливайте качество выше 85 %.
Существуют ли ограничения по размеру или количеству файлов?
Нет. Поскольку сжатие выполняется на вашем устройстве, а не на сервере, никаких ограничений нет — можно сжать как изображение размером 50 МБ, так и 100 изображений за один раз. Обработка очень больших изображений просто займет чуть больше времени.
Мои изображения куда-нибудь загружаются?
Нет. Файлы полностью считываются и перекодируются вашим браузером с использованием API HTML5 canvas. Вы можете загрузить эту страницу, перейти в автономный режим и продолжить сжатие.
Что выбрать: формат JPG или WebP?
Формат WebP, как правило, на 25–35 % компактнее при том же качестве изображения и поддерживается всеми современными браузерами — это лучший выбор для веб-сайтов. Формат JPG открывается везде, включая устаревшее программное обеспечение и принтеры — это лучший выбор для обмена файлами и отправки по электронной почте. Если сомневаетесь — выбирайте JPG.
Почему размер моего файла PNG так сильно уменьшился?
Формат PNG не теряет качество, что обходится дорого при работе с фотографиями — размер фотографического файла в формате PNG часто в 5–10 раз превышает размер визуально идентичного файла в формате JPG. Преобразование фотографических файлов PNG в JPG/WebP позволяет добиться наибольшей экономии. Сохраняйте файлы в формате PNG только для графических элементов, которым требуется прозрачность или идеально четкие края.
Почему итоговый результат иногда оказывается больше исходного?
Если изображение и так было сильно сжато, перекодировка не поможет и может привести к увеличению объёма в байтах. Программа сообщит вам, когда это произойдёт — в таком случае просто сохраните исходный файл.
Что это за инструмент?
Программа для сжатия изображений уменьшает размер файла за счёт перекодирования изображения с использованием более эффективных (с потерями) настроек. Фотография, сделанная камерой телефона, часто занимает 3–8 МБ; для веб-сайта, сообщения в чате или электронного письма изображение размером 200–500 кБ обычно выглядит на экране точно так же. Более компактные изображения быстрее загружаются, быстрее отображаются и позволяют сэкономить место на диске и трафик.
Этот инструмент перекодирует изображения с помощью собственного кодека браузера с выбранным вами уровнем качества, а при необходимости также уменьшает размер очень больших изображений до разумной максимальной ширины — это два основных фактора, влияющих на размер файла. Между степенью сжатия и видимым качеством всегда существует компромисс; благодаря возможности в режиме реального времени сравнивать размеры «до» и «после» вы сможете найти оптимальный баланс для каждого изображения.
Сравнение форматов: JPG, WebP и PNG по размеру
Одно и то же фото, одинаковое качество изображения, три совершенно разных размера: PNG — «тяжеловес» (сжатие без потерь — размер файлов с фотографиями часто в 5–10 раз превышает размер файлов JPG), JPG — универсальный «золотой середины», а WebP, как правило, занимает место на 25–35 % ниже JPG. Таким образом, иерархия сжатия для фотографии выглядит следующим образом: сначала конвертируйте из PNG, затем выберите JPG для обеспечения совместимости или WebP для минимального размера.
Графика переворачивает ситуацию с ног на голову: в случае скриншотов, логотипов и изображений пользовательского интерфейса с однотонной расцветкой PNG с квантованием палитры обычно превосходит JPG как по размеру, так и по четкости — фотографическое сжатие JPG размывает острые края. Для этого случая ниже представлен отдельный инструмент.
| Тип содержимого | Оптимальный формат | Почему |
|---|---|---|
| Фотографии для веб-сайтов, электронной почты и чатов | WebP (или JPG для обеспечения совместимости) | Сжатие с потерями хорошо подходит для фотографических изображений; при одинаковом качестве файлы в формате WebP занимают на 25–35 % меньше места, чем файлы в формате JPG. |
| Скриншоты, логотипы, интерфейс с однотонной цветовой гаммой | PNG | Без потерь — фотографическое сжатие в формате JPG приводит к размыванию четкого текста и резких краев. |
| Изображения, требующие прозрачности | PNG или WebP | Формат JPG не имеет альфа-канала; форматы PNG и WebP поддерживают прозрачный фон. |
| Максимальная совместимость (старое программное обеспечение, принтеры) | JPG | Поддерживается практически всеми браузерами с 1990-х годов; поддержка формата WebP появилась позже, однако в настоящее время она также практически повсеместна в браузерах. |
Примечания по исполнению
- Измените размер перед сжатием с более высокой степенью сжатия: уменьшение размеров с 4000 пикселей до 1920 пикселей позволяет удалить около 77 % пикселей — ни один ползунок регулировки качества не сможет с этим сравниться.
- Пакетная обработка выполняется последовательно на вашем процессоре; обработка ста фотографий с телефона занимает пару минут на ноутбуке. На сервере ничего не ставится в очередь, поэтому этот способ, как правило, все равно быстрее, чем сайты, работающие по принципу загрузки, — да и работает он в автономном режиме.
- Число со знаком «−%» — это ваш индикатор обратной связи: если оно состоит из однозначных цифр, это означает, что изображение уже оптимизировано, и дальнейшее снижение качества ухудшит его внешний вид, прежде чем поможет уменьшить размер.
- При публикации веб-контента старайтесь, чтобы размер изображений в контенте не превышал 200 КБ, а размер полноразмерных баннеров — 500 КБ; при соблюдении этих ограничений показатели Core Web Vitals останутся на приемлемом уровне при подключении через мобильные сети.
По результатам наших собственных испытаний
Перед выпуском этого инструмента мы протестировали его на сгенерированных тестовых изображениях и проверили результат пиксель за пикселем, а не только на глаз. Размер многоцветного PNG-файла размером 3000×2000 пикселей уменьшился со 140 КБ до 94 КБ (−33 %) при качестве 75 % и ограничении в 1920 пикселей — и поскольку тестовое изображение было синтетическим, мы смогли убедиться, что ни один пиксель не сместился больше, чем допускает кодек JPG. Мы также подтвердили, что предупреждение о «уже оптимизированном файле» срабатывает правильно, а не приводит к молчаливому созданию файла большего размера: если подать на обработку сильно сжатый JPG, программа посоветует сохранить оригинал, а не будет делать вид, что помогла.
Как использовать
- Перетащите изображения в поле (или нажмите, чтобы выбрать) — поддерживаются форматы JPG, PNG и WebP.
- Установите качество: 75 % — это оптимальный вариант; для максимальной экономии снизьте его до 60 %.
- Выберите максимальную ширину — 1920 пикселей вполне достаточно для просмотра веб-страниц в полноэкранном режиме.
- Выберите формат вывода JPG (универсальный) или WebP (меньший размер, поддерживается всеми современными браузерами).
- Нажмите кнопку «Скачать» рядом с каждым результатом. Для каждого файла отображаются его размер и процент загрузки.
Пример
- Ввод
phone-photo.jpg — 4.20 MB, 4032×3024- Результат
phone-photo-compressed.jpg — 0.48 MB (−89%), 1920×1440
Изменение размера до 1920 пикселей и перекодировка с качеством 75 %: визуально одинаково выглядит на любом экране, размер уменьшается в 9 раз.