Жми пиксели!

Как готовить изображения, если ты заботливый дизайнер

Привет!

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

Оптимизируй!

Уровень 🙈

Save for web в фотошопе, Export в скетче. Можно подвигать ползунок компрессии. Уже лучше, чем ничего. Но гораздо хуже, чем могло бы быть.

Уровень 🤟

Tinypng — хорошее, а главное, шустрое решение для оптимизации с абсолютно рандомным процентом сжатия:

веб-интерфейс (не нужно ставить клиент);
довольно быстрый алгоритм;
обработка всей пачки изображений сразу.

Перетаскиваешь всё сразу в браузерное окно и скачиваешь архив сжатых изображений. Просто. Из минусов — отсутствие настроек. Иногда кот в мешке и видимые потери качества.

Уровень 💪💪

ImageOptim — как ТайниПнг, только настраивается. При чем, довольно гибко.

Поставляется в виде программы-клиента.
Настраивается под задачу.
Если потратить время и основательно поиграться с настройками — можно добиться хорошей компрессии 70-80% без видимых потерь качества.

Из минусов — тугодум. Иногда приходится довольно долго ждать.

Уровень 💎💎💎

WebP — формат изображений от Гугл. 70-80% сжатия вообще без потери качества.

Можно экспортировать в сжатом виде прямо из скетча.
Не нужно настраивать.
В комплекте идут обнимашки от фронтенд-разработчика.

Из минусов — не поддерживается старыми браузерами. Но они скоро отвалятся и все будет хорошо.

А чем жмешь ты? Обязательно расскажи в фейсбуке.