Автоматическая оптимизация изображений с помощью Hazel и ImageOptim

Автоматическая оптимизация изображений с помощью Hazel и ImageOptim

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

Лично для меня это означает, что нужно перетащить все изображения на сайт ImageOptim перед использованием их в сети. Монотонные повторяющиеся задачи – идеальная сфера для автоматизации. Так давайте же автоматизируем этот процесс.

Рабочий стол – моя промежуточная рабочая площадка

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

Для меня рабочий стол – удобное место для работы со всеми этими вещами.

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

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

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Один из способов – поставить таск раннер Grunt/Gulp/Webpack или любой другой, где можно создать задачу watch, которая будет следить за всеми изображениями. Если появилось новое изображение, запускается задача по оптимизации. Многие из нас, возможно, уже делают так в веб-проектах. Отличий будет немного.

Кроме… после каждой перезагрузки нам нужно будет запускать команду gulp watch (или другую в зависимости от таск раннера) из командной строки. Могу поспорить, есть какой-то способ не делать этого. Например, поместить команду в «~/.bash_profile» или что-то другое. Я толком не вдавался в это, так что…

Знакомство с Hazel

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

Это сильно упрощает нам задачу. Мы следим за папкой Рабочий стол, и если там есть файлы изображений, открываем их в ImageOptim.

Автоматическая оптимизация изображений с помощью Hazel и ImageOptim

Все очень просто

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

Автор: Chris Coyier

Источник: https://css-tricks.com/

Редакция: Команда webformyself.

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Верстка-Мастер. От теории до верстки популярных шаблонов

Изучите современную верстку сайтов с нуля

Подробнее

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Добавить комментарий