Как оптимизировать картинки или фотографии для публикации их в интернет? Этот вопрос часто задают себе люди увлекающиеся фотографиями или контент менеджеры, выкладывающие изображения в интернет магазины и прочие интернет ресурсы. Вы конечно же скажете, что можно открыть свой любимый редактор GIMP, Photoshop, Paint или любой другой и просто изменить размер и качество изображения. Все бы ничего, но есть одно маленькое НО. Когда в вашем арсенале находится не одна две картинки, а сотни или даже тысячи, то такой подход ручного подгона фото окажется весьма долгим и трудоемким процессом. И здесь нам на помощь приходит консольная программа convert
или mogrify
входящие в состав пакета imagemagick
. ImageMagick обладает весьма мощным функционалом, рассмотреть который в рамках коротенькой статьи увы не получится. Я затрону лишь несколько параметров утилиты mogrify, необходимых нам для наших целей.
Для чего нужно обрабатывать фотографии перед публикацией их на сайт? Здесь все очень просто. Обычно фотографии, сделанные фотоаппаратом или даже современным телефоном, имеют достаточно большой размер, как самого изображения так и соответственно размер файла.
Чем это все грозит? Публикация в сеть изображений, размер файла которых достаточно большой, может замедлить работу сайта, особенно пользователям, которые имеют медленный интернет или пользуются мобильным интернетом при просмотре сайта с телефона или планшета. Да и зачем пользователю фото огромного размера, когда он все равно не увидит его?
Есть и еще одна причина по которой вам следует сжимать ваши фотографии в размере. Если вы, например, занимаетесь фото и зарабатываете на этом себе на хлеб. То в целях рекламы и показа своего портфолио, вы публикуете свои работы в сети, но при этом вам не хотелось бы, чтобы вашими изображениями пользовались люди в коммерческих целях и уж тем более выдавали их за свои. Для избежания подобных ситуаций фото достаточно сжать до размера, когда ширина или высота не превышает 900 пикселей, а урезка качества всего на 10%, позволит сократить объем данных файла изображения. Здесь на помощь нам приходит инструмент под названием convert
из пакета ImageMagick или его брат mogrify
. Второй отличается лишь тем, что он изменяет само изображение, то есть переписывает файл изображения внося в указанные вами изменения. А convert
создает измененную копию оригинального файла. Синтаксис у них одинаковый. Лично меня больше устраивает mogrify
, так как логично перед публикацией отобрать подходящие фотки, скопировав их в отдельную папку.
Первое, что необходимо сделать - это установить пакет ImageMagick:
sudo apt-get install imagemagick
Описание основных возможностей я сделаю чуть позже, когда найду немного свободного времени. Сейчас я представлю вам скрипт, который можно скачать с моего github отсюда. И опишу в двух словах как им пользоваться. Скрипт довольно простой и содержит в себе всего несколько строк кода.
Скачав архив в нем вы найдете файл iwo.sh, который нужно будет скопировать в папку, куда вы скопировали изображения для своего сайта. Скрипт поддерживает несколько простых настроек, которые вы, при желании можете изменить под свои нужды. Настройки находятся между комментариями Script settings и End Script settings.
По умолчанию параметры выставлены в:
# Script settings =============
FILE_FORMAT='jpg'
IMG_MAX_WIDTH=900
IMG_MAX_HEIGHT=900
QUALITY=90
ROTATE_DEG=0
WATERMARK=
WATERMARK_FONT_SIZE=20
# End Script settings =========
В дальнейшем я планирую добавить возможность добавления водяных знаков на фото и еще несколько функций.
Описание параметров: FILE_FORMAT - Задает тип изображений по расширению (jpg, png и прочие). IMG_MAX_WIDTH и IMG_MAX_HEIGHT - задают размер (ширину и высоту) изображения. Если картинка имеет большую ширину или высоту, чем заданную, она будет уменьшена до указанного размера сохраняя пропорции изображения. QUALITY - задает качество (степень сжатия) изображения в процентах от оригинала (100%) 100 - 100% качества. 90 - 90% качества и так далее. ROTATE_DEG - задает на сколько градусов нужно повернуть изображения от 0 до 360 - поворот по часовой от 0 до -360 - поворот против часовой WATERMARK - Текст который будет наложен в виде водяного знака WATERMARK_FONT_SIZE - Размер шрифта водяного знака
Вот весь код скрипта, однако самая свежая версия всегда доступна на github. Скачать скрипт
#!/bin/bash
# Script settings ==================================================================================
FILE_FORMAT='jpg'
IMG_MAX_WIDTH=900
IMG_MAX_HEIGHT=900
QUALITY=90
ROTATE_DEG=0
WATERMARK=
WATERMARK_FONT_SIZE=20
# End Script settings ==============================================================================
for img in `ls *.$FILE_FORMAT`
do
# Change the QUALITY, if specified
if [[ $QUALITY -gt 0 ]]; then
`mogrify -quality $QUALITY $img`
fi
# Add the watermark, if specified
if [[ -n $WATERMARK ]]; then
`mogrify -fill white -box '#00770080' -gravity South \
-pointsize $WATERMARK_FONT_SIZE -annotate +0+5 " $WATERMARK " $img`
fi
# Rotate image, if specified
if [[ $ROTATE_DEG -ne 0 ]]; then
`mogrify -rotate $ROTATE_DEG $img`
fi
# Width
if [[ `identify -format "%w" $img` -gt $IMG_MAX_WIDTH ]]; then
`mogrify -resize $IMG_MAX_WIDTH $img`
fi
# Height
if [[ `identify -format "%h" $img` -gt $IMG_MAX_HEIGHT ]]; then
`mogrify -resize x$IMG_MAX_HEIGHT $img`
fi
done