Как сжимать изображения для сайта – программа FastStone Image Viewer

Здравствуйте уважаемые посетители и постоянные читатели блога Spectr-rv.ru. Все вы прекрасно понимаете значение изображений для сайта. Присутствие картинок оживляет любую статью и делает ее гораздо более привлекательной для читателей.

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

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

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

О программе FastStone Image Viewer

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

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

Главное окно программы выглядит следующим образом.

Сверху расположены панель меню и панель инструментов. Место в центре занимает окно просмотра, в которое помещаются просматриваемые или подлежащие оптимизации файлы.

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

В дальнейшем, я собираюсь подробно рассказать об этой замечательной программе. Сегодня же мы рассмотрим, как с помощью FastStone Image Viewer сжать изображение, не допуская при этом видимого ухудшения его качества.

Форматы изображений

Для лучшего понимания механизма сжатия, напомню читателям блога, что такое формат изображения. Формат изображения (графический формат) – это метод записи графической информации, предназначенный для хранения изображений (фотографий, рисунков и т. п.).

Наиболее распространенными форматами изображений являются JPEG и PNG, поэтому на них и будем ориентироваться.

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

Формат PNG – современный формат, обеспечивающий значительное сжатие изображения без потери качества. Кроме того, PNG позволяет сохранить прозрачность изображения, что немаловажно для веб-разработчиков.

За счет оптимального выбора формата можно добиться значительного снижения веса изображения. Программа FastStone позволяет оценить результаты сжатия фотографии непосредственно в процессе работы и выбрать наиболее подходящий для вас формат изображения.

От себя добавлю, что для скриншотов, где преобладает текст, более подходящим, скорее всего, будет формат  PNG. Для фотографий, предпочтение, возможно, придется отдать формату JPEG. А вообще, к выбору формата для сохранения каждого конкретного изображения нужно подходить осознанно, то есть с учетом конечных результатов.

Сжатие изображений с помощью FastStone Image Viewer

Для оптимизации (сжатия) изображения, в первую очередь, найдите с помощью проводника папку, в которой оно хранится. Выделите найденную папку, щелкнув по ней мышкой. После этого содержимое выбранной папки должно появиться в окне просмотра.

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

Выделите изображение, подлежащее сжатию, после чего оно откроется в панели предварительного просмотра. Щелкните по меню «Файл» и выделите пункт «Сохранить как…».

В открывшемся окне выберите имя изображения, если оно до этого не выбрано, и тип файла (формат) из выпадающего списка. Нажмите кнопку «Опции…».

При выборе формата JPEG, откроется окно «Параметры формата файла», показанное на приведенном ниже рисунке.

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

Контролируя изображение в правом окне, перемещайте указатель шкалы влево до момента, когда качество изображения начнет снижаться. Посмотрите, какой размер (вес) файла будет при этом указан под правым окном. Это и есть окончательный вес картинки после сжатия. Остальные органы настройки, имеющиеся в окне, трогать не нужно.

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

Если результат оптимизации изображения вас устраивает, щелкните по кнопке «ОК», а после этого нажмите кнопку «Сохранить». Сжатое изображение должно появиться в исходной папке.

При выборе для оптимизируемого изображения формата PNG, окно «Параметры формата файла» будет несколько другим.

Здесь сжатие изображения мы будем выполнять за счет снижения цветности, то есть преобразования PNG-24 (более миллиона цветов) в PNG-8 (256 цветов), что не вызывает ухудшения качества изображения.

Выберите в выпадающем списке «Цвета» пункт «256» и оцените вес сжатого изображения.  Если вы довольны полученным результатом, нажмите кнопки «ОК» и «Сохранить».

Вот так можно оптимизировать фотографии и картинки с помощью программы FastStone Image Viewer. На первый взгляд, сжатие изображений кажется достаточно сложным процессом. На самом деле, все очень просто. Вы сами убедитесь в этом после сжатия нескольких картинок.

На этом я заканчиваю. Очень надеюсь, что вы оцените программу FastStone Image Viewer и возьмете ее на вооружение. Спасибо за внимание. Удачи!