Wordpress уменьшение изображения. Расширения для Joomla. Типы изображений и форматы

Одной из основных причин популярности WordPress является поистине огромный набор плагинов на все случаи жизни. На сегодняшний день существуют плагины, позволяющие сделать практически все, что угодно: вставить кнопки социальных сетей, управлять списками рассылки, создавать статические HTML файлы и т.д. Есть отдельная категория плагинов, предназначенных для оптимизации работы вашего блога, конкретно для увеличения скорости загрузки и производительности.

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

Hammy . Hammy оптимизирует графическое содержимое вашей страницы. Плагин генерирует изображения различных размеров на основе заданных Вами параметров. Когда пользователь обращается к вашему сайту, Hammy автоматически отображает картинки, исходя из заданных настроек размера изображения (иногда минимально допустимого).
Это способствует тому, чтобы ваш сайт загружался быстрее. Особенно актуально для пользователей, заходящих с мобильных устройств. Hammy прост в настройке — он может работать в одном из трех доступных режимов.
Lazy Load . С помощью плагина Lazy Load (Ленивая загрузка) процесс загрузки страницы осуществляется следующим образом: изображения подгружаются только тогда, когда пользователь их видит (из видимой на экране части страницы).
Lazy Load – это один из самых простых в настройке плагинов. Просто установите его и активируйте.Он ускоряет загрузку сайта, при этом, не создавая лишнюю нагрузку на сервер.
Imsanity . Imsanity изменяет размер загружаемых изображений, если они больше, чем задано в настройках плагина. Единственный параметр, который нужно установить при настройке плагина – это размер и разрешение загружаемых изображений. Imsanity оптимизирует изображения непосредственно в процессе загрузки на сервер. Также возможна обработка картинок, загруженных до этого.
. HTTP 1.0 позволяет устанавливать до двух соединений с одного домена. WP-PLS создает дополнительные поддомены, что позволяет скачивать из них файлы параллельно. Браузеры получают больше хостов для загрузки контента. Это позволяет скачивать одновременно больше файлов, и ваш сайт работает быстрее!
CW Image Optimizer . Хотите уменьшить размеры изображения без потери качества? Эта работа для плагина Image Optimizer. Хотя он не так прост в установке и настройке. Также CW Image Optimizer позволяет массовую обработку, если у вас на сайте есть много изображений, которые нужно оптимизировать.
EWWW Image Optimizer . Этот плагин также уменьшает размер изображения без потери качества. Он прост в использовании, — на странице плагина приведена подробная и понятная пошаговая инструкция по его установке. EWWW Image Optimizer также включает функцию групповой обработки изображений.
PB Responsive Images . PB Responsive Images интерактивно настраивает изображения в соответствии с разрешением монитора пользователя. Дополнительно никакие коды прописывать не нужно. Вы можете настроить размер картинок, и плагин автоматически будет редактировать синтаксис кода изображения. Это поможет оптимизировать страницу для пользователей, которые заходят на ваш сайт с мобильных устройств.
WP Smush.it . Плагин, который использует сервисы Smush.it Yahoo, чтобы оптимизировать ваши изображения и уменьшать их размер. Smush.it – довольно популярный плагин, он не нуждается в дополнительной настройке.
Просто установите и активируйте его. После чего Smush.it будет оптимизировать каждую загружаемую картинку автоматически. Также существует возможность обработки сразу нескольких изображений.
Parallelize . В соответствии с названием плагин позволяет осуществлять параллельную загрузку с одного ресурса. Это предоставляет браузеру сразу несколько доменов для скачивания файла. Таким образом, увеличивается скорость загрузки страницы.Parallelize довольно прост в настройке, однако, если вы не уверенны в каких-либо функциях, лучше внимательно ознакомиться с инструкцией.

Перевод статьи «9 WordPress Plugins to Improve Images Performance » был подготовлен дружной командой проекта .

Хорошо Плохо

Здравствуйте, уважаемые коллеги! В этой статье на сайт вы откроете для себя довольно полезный плагин для оптимизации изображений на WP , здорово облегчающий работу по внутренней оптимизации сайта в этой части.

Начну издалека. На днях, я проводил анализ одного клиентского сайта. И, как оказалось, все картинки на этом проекте не были оптимизированы совсем или не в полной мере, что и подтвердил инструмент .

Казалось бы, открывай графический файл в Photoshop, жми "Файл "→"Сохранить для Web " и дело в шляпе. Но, картинок на этом сайте накопилось немало. Вот тут-то и возник вопрос:"А можно ли оптимизировать картинки все за раз, при помощи какого-нибудь плагина WordPress например?".

Как нельзя кстати и подвернулось под руку расширение WP Smush. Что примечательно, оно обработало все изображения библиотеки медиафайлов (картинки шаблона (шапка, подвал, фон и так далее оптимизировались отдельно) оптимально и на полном автомате. остался доволен.

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

Установка и использование плагина WP Smush для оптимизации изображений на WordPress

- Скачайте расширение с официального депозитария WP по адресу https://wordpress.org/plugins/wp-smushit/ ;
- Установите и активируйте его.

В меню "Медиафайлы " появится новый пункт " ", кликните по нему.

Тут вам сразу предложат "проабгрэйдить" версию до профессиональной, не за бесплатно конечно. В WP Smush Pro, после этого, добавятся новые функции:

- "интеллектуальное сжатие", картинка потеряет в весе в 2 раза больше без потери качества (даже очень интересно, но верится с трудом, даже фотошоп так не умеет);
- возможность бэкапа, возврата первоначальных изображений из (мы и сами с усами, резервную копию умеем делать);
- обработка файлов размером более 1 Мб (мало кому приходится загружать на сайт картинки такого размера?);
- нет ограничений скорости обработки (пусть лучше помедленнее, нам спешить некуда, будет меньше нагрузка на сайт);
- работает служба поддержки (а зачем она нужна?);
- доступ к другим премиум плагинам и темам (ну, этого добра и так навалом).

Я денег буржуинам не дал. Если кто, все же опробовал про версию, просьба оставить свой отзыв на нее в комментариях.

Если поставить галочку у опции "Auto-Smush images on upload ", то плагин будет автоматически оптимизировать все новые изображения, загружаемые на сайт. Опции интеллектуального сжатия и бэкапа в бесплатной версии неактивны.
Нажатием кнопки "Bulk Smush 50 Attachments ", вы запустите процесс оптимизации всех, ранее загруженных изображений на сайт, по 50 штук за раз. По окончании обработки порции из 50-ти изображений, нажмите кнопку повторно.
В конце процесса, кнопка поменяется на зеленую "All Done ". Нажмите на нее для завершения.
Вы можете уменьшать вес отдельных картинок, по выбору. Для этого перейдите в библиотеку медиафайлов по ссылке "Media Library " или по ссылке "Библиотека " в панели администратора.

Нажатием кнопки "Smush Now! ", напротив изображения, вы его оптимизируете.

Плагин для оптимизации изображений на wordpress обновлено: Март 14, 2017 автором: Роман Ваховский

Так уж повелось, что SEO диктует свои условия для развития, что послужило распространению плагинов для оптимизации изображения. Оптимизация изображения — это всего лишь уменьшение размера изображения в килобайтах и его сторон, что является результатом сжатия изображений wordpress, причем без потери качества для визуального просмотра (как правило). Кроме этого еще можно оптимизировать качество самого изображения без видимого ухудшения самого изображения. Это своего рода ухудшение качества картинки, но на глаз его не видно, а вот размер изображения в килобайтах уменьшается, что может влиять на скорость работы сайта и это один из параметров . Таким образом вы уменьшаете вес изображения, тем самым изображение становится меньше и быстрее грузится. Если у вас на сайте много изображений, то для этой работы предназначены плагины оптимизации изображений. Давайте далее рассмотрим обзор плагинов оптимизации изображений в WordPress.

Почему происходят потери качества изображения

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

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

На что влияет размер или как говорят вес изображения?

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

Сжатие изображения с помощью плагинов

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

Давайте для примера возьмем сервис оптимизации изображений на сайте https://optipic.io , где можно сразу проверить оптимизированы ли у вас картинки на сайте. И если сжатия нет, то вам обязательно нужно его установить. Пройдя по ссылке, вы увидите строчку для ввода сайта, где можете проверить сжатие изображений, но пользуясь случаем сразу добавлю, что сервис имеет хорошее сжатие изображений без потери качества и он сможет помочь вам независимо от того какой на сайте вы используете.

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

1. WP Smush или Smush Image Compression and Optimization

Его использование очень простое, достаточно зайти в его настройки и вы увидите:

Где слева видно, что плагин для сжатия изображений wordpress предлагает оптимизировать все изображения, которые требуют этого и просто нажав ОПТИМИЗИРОВАТЬ ВСЁ вы решаете проблему раз и навсегда, а последующие загрузки будут сжимать автоматически. Ну если конечно вы желаете заранее сами сжимать и загружать уже готовую картинку, то это будет лучшим решением.

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

2. ShortPixel Image Optimizer

Легкий в использовании, всеобъемлющий, стабильный и часто обновляемый плагин сжатия изображений, поддерживаемый дружественной командой, которая его создала и прочая многострочная лабуда от производителей… Но изюминка данного плагина в том, что он сжимает всего лишь 100 изображений в месяц, а потом уже стоимость $5 за 5000 изображений. Нужно сразу понимать, что если у вас на сайте много изображений, то этот плагин не для вас, а так в малых объемах плагин достойный.

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

3. TinyPNG / TinyJPG

Данный плагин для оптимизации изображений wordpress очень простой, я даже сказал бы упрощенный, никаких изысков, просто сжимает и всё. Активируется и работает по коду API. Бесплатный и легко справляется со своей целью. Но есть пару минусов, что сжимается бесплатно 500 изображений, а далее уже платно (по запросу эл. почты); и ещё он очень редко обновляется (более 2 лет), о чем его разработчик сразу предупреждает.

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

4. Resize Image After Upload

По названию вроде всё понятно, но почему то он сжимает изображения как раз при загрузке, а не уже загруженные. Почему такая несуразность? пусть отвечают разработчики. Кстати, этот проект поддержали разработчики от плагина ShortPixel, что делает продукт именитым.

А если по сути, то плагин для сжатия изображений wordpress не содержит ничего лишнего, достаточно в настройках указать необходимые параметры (включение/выключение сжатия, максимальны размер изображения, уровень сжатия). Сохраняете настройки и поехали работать.

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

5. EWWW Image Optimizer

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

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

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

6. CW image optimizer

По заявлениям разработчика этот плагин похож на WP Smush.it, а по сути это тоже простой плагин, может сжать уже загруженные изображения, обработка здесь же, а не на удаленном сервере, у него минимум настроек направленные на сжатие и всё тут. Так что тем, кто хочет просто сжать и забыть, то это он самый.

Конечно не без минусов, последний раз обновлялась более 3 лет назад, ну наверняка и поддержки никакой, но если у вас работает как надо, то на этот фактор можно не смотреть, а так достойный вариант любителям простоты.

7. Imagify

Этот вариант имеет 3 уровня сжатия, сжимает на этом же сервере, так что довольно простой, но имеет ограничение в 25Мб — примерно 250 изображений в месяц, а всё что свыше нужно платить, поэтому данный вариант будет удобен для маленьких сайтов. А в остальном этот плагин прост и доступен, для тех, кто не любит заморачиваться с настройками, то можете смело ставить.

8. Optimus

Этот плагин уже для сжатия отправляет изображения на свой сервер, который находится в Германии, далее сжимает и отправляет обратно. Может сжимать во время загрузки, сохраняет данные EXIF, сжимает даже миниатюры, может даже преобразовать в новый формат WEbP. У него достаточно функции и сжимает он без потери качества, но у каждой достойной вещи есть один минус — денег хотят.

Поэтому он предлагается в 3 вариантах:

Бесплатный — сжатие изображении только до 100кб
Optimis HQ — премиум версия для личного использования, с расширенными возможностями.
Optimus HQ PRO — для полного профессионального использования, для множества сайтов.

9. Kraken Image Optimizer

Плагин сжимает изображения как новые, так и существующие и при желаний может сжимать без интеллектуальных потерь. Плагин без заморочек и лишних настроек, но есть косячок))), в бесплатной версии ограничение в 100 мб. А если платите, то за $5 можно обработать 500Мб в месяц. Таким образом, если чуть стоящая вещь, то обязательно будет денежный барьер.

10. SEO Image Optimizer

Помимо сжатия изображений wordpress он может динамически менять ALT и метку. Обладает действительно простыми и понятными настройками и интуитивный интерфейс. Плагин ничего не хранит в базе данных, ведь некоторые гурманы не хотят засорять свою БД. Есть тех.поддержка, что иногда помогает решить проблемы. Так что в целом этот простачок тоже способен выручить вас.

11. Lazy load

А этот плагин не сжимает изображения. Тогда нахер он нужен?))) Отвечу, даже из назания видно, что это ленивая загрузка, что значит картинки будут загружаться ещё до того как вы прокрутили страницу и картинка попала в видимую часть экрана. То есть картинки попросту загружаются заранее, что будет удобно при открытии. Но важно отметить, что этот плагин будет необходим для большого числа картинок на просматриваемых страницах.

Но тем не менее он очень важен для SEO показателей, поэтому он тоже в теме и помогает ускорить загрузку изображений, как бы там ни было.

12. Compress JPEG and PNG images

Данный плагин для сжатия изображений wordpress обеспечит автоматическое сжатие всех ваших картинок, даже анимированных PNG файлов. Поддерживает многоузловой режим через API. Настройки минимальны: достаточно поставить галочки какие форматы изображений нужно сжать, максимальный обрабатываемый размер, далее получаем ключ API у разработчика и готово.

Но опять обламываем кайф, у данного плагина есть ограничение бесплатного сжатия до 500 картинок в месяц. А всё что свыше, то нужны мани, причем выпендрились: следующие 9500 изображений по $0,009 за каждое изображение. Понятно, что он пойдет для малых потребностей.

13. Prizm Image

Плагин сжимает картинки JPEG, PNG и GIF, причем до 70%. Сразу отмечу, что сжатие происходит на другом сервере и работа идет по ключу API, который нужно получить после установки плагина. Для начала работы нужно выбрать из 3 качество сжатия, выбираете нужный режим работы и тайминг и готово.

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

14. BJ Lazy Load

Этот плагин сжатия изображений удобен тем, что выполняет предзагрузку, т.е. он может загружать изображения до прокрутки видимой части экрана, так же может сжимать изображения. И вот всё бы хорошо, но плагин использует JQuery и JavaScript, поэтому если у клиента не установлен JavaScript, то вместо картинки будет отображаться код вывода картинки, что конечно зачтем как минус.

Настройки незатейливые и всем понятные: выбрать какие изображения подвергнуть сжатию, поддержка FRAME и ещё парочку и готово. Но нужно тут добавить, что по отзывам некоторые не видят сильной прибавки скорости, наверно потому, что используется JS, а в остальном работает у большинства без проблем.

15. Imsanity

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

Этот плагин идеально подойдет для тех, кто не знает как сжимать и не хочет даже вникать, легче поставил этот бесплатный плагин и забыл.

16. Hammy

Нужно начать, что этот плагин на сегодняшний день (конец 2017) не обновлялся уже 4 года, но если до сих пор находятся те, кто его ставит, значит он делает свою работу.

Как для меня, так этот плагин для оптимизации изображений wordpress немного муторный. Суть его работы такова, что он делает замену тегов img на figure, работает только с записями и страницами, но никак не с пользовательскими изображениями. Он работает на jQuery, но если jQuery недоступен, он возвращается к обычному изображению, в котором вы были там, в первую очередь. Но главное в том, что плагин из ваших изображений создает ряд изображений с разными размерами и потом показывает наиболее подходящий размер. Это на мой взгляд удобно для мобильных устройств, что напрямую связано со скоростью загрузки.

17. PB Responsive Images

Этот пациент тоже не обновлялся более 4 лет. Но плагин интересен тем, что он использует шорт-коды, если вы захотите поднастроить по конкретные фотки индивидуальные параметры, то это легко. Более того, плагин обладает некоей логикой, если у вас экран менее чем 700 пикселей, то плагин выдает уже меньшее по размеру изображение, что является хорошей адаптивностью и большим плюсом.

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

18. CheetahO Image Compression and Optimizer

Плагин для сжатия изображений wordpress работает через удаленный сервер по API (на несколько сайтов), причем сервера быстрые, поддерживает форматы JPEG, PNG, GIF. Используют свой запатентованный алгоритм сжатия и полностью подходит под WOOCOMMERCE. Но как всегда есть ограничение для бесплатной версии — это 500 изображений в месяц, а это значит только для небольших сайтов. ну да этот плагин тоже подойдет для тех, кто ничего не шарит в сжатии и обрезании.

В данной записи мы раскроем различные моменты оптимизации изображений в WordPress, про которые обычно незаслуженно забывают или упускают из внимания.

Не загружайте изображения на сайт, которые весят по 3 Mb, напрямую со своей камеры

Одна из проблем, с которой сталкивались все мои клиенты в течение первых тридцати дней с момента запуска сайта на WordPress – как работать с изображениями. Несмотря все прекрасные стороны WordPress, которые доступны пользователям, изображения по-прежнему продолжают выступать для большинства людей камнем преткновения. Как правило, вопросы касаются обрезки изображений, загрузки их с камеры, выполнения базовой цветокоррекции или увеличения резкости, а также многих других проблем, которые происходят еще до входа на свой сайт. Современные цифровые фотоаппараты делают снимки, которые весят примерно в 20 раз больше, чем те, в которых вы нуждаетесь для своего сайта (за исключением тех случаев, когда вам требуется провести оптимизацию под ретина-дисплеи, однако об этом в другой раз).

Есть некоторые базовые шаги, которые вы должны выполнить, чтобы получить изображения, готовые для использования на своем сайте. В этой статье я покажу вам самый простой способ работы с изображениями на своем веб-ресурсе. Мы также рассмотрим некоторые сервисы и инструменты, которые многие веб-разработчики незаслуженно игнорируют, но которые помогают добиться более высокой скорости загрузки сайта.

В чем состоит проблема?

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

Причина, по которой изображения становятся камнем преткновения для многих посетителей веб-сайтов, заключается в том, что работа с ними охватывает несколько иное пространство, выходящее за пределы WordPress, в котором требуются свои навыки и свои умения. WordPress ни в коем случае не является ограничивающим фактором, когда дело доходит до изображений; проблема состоит в самой природе дисплеев и камер, форматов файлов и DPI, что усложняет использование изображений в сети.

Естественно, вы должны понимать, что камеры разработаны для печати, которая требует гораздо большего разрешения, чем могут предложить ваши мониторы и дисплеи. Отсюда следует, что если поместить изображение с вашей камеры прямо на веб-страницу, то оно превысит ширину дисплея как минимум в два раза. Даже если вы измените DPI до 72 (разрешение обычного монитора), изображение все равно будет слишком большим, чтобы уместиться в области контента с шириной 800 пикселей.

Если же вы хотите применить прозрачность в вашем изображении, то вы должны знать о альфа-прозрачности и 24-битных png-файлах. Давайте учитывать и то, что даже маленький JPG с шириной 800 пикселей может занимать 1 или 2 Mb, если его должным образом не оптимизировать. И не просто «оптимизировать», а оптимизировать без потерь.

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

Действительно ли я должен покупать Photoshop?!

Нет, это делать не обязательно. Photoshop, конечно, великолепен, но предназначен он далеко не для простого редактирования изображений. Photoshop – то, чем я пользуюсь, как и любой другой приличный веб-дизайнер/разработчик. Однако если вы хотите провести продвинутое редактирование фотографий, вы можете воспользоваться старой версией CS2, которая теперь доступна бесплатно. Она наполнена всеми удивительными функциями Photoshop, просто в ней нет некоторых более свежих возможностей. Скачать CS2 вы можете .

Небольшое примечание: загрузить Photoshop CS2 бесплатно вы можете лишь в том случае, если вы уже заказывали его или Acrobat 7 ранее. Ничто не мешает пользователю создать аккаунт в Adobe и скачать себе Photoshop, но в техническом плане он свободно распространяемым не является.

Устанавливаем IrfanView

Photoshop – это программа-зверь. Она загружается достаточно долго и обладает серьезной кривой обучения, в ней тяжело делать некоторые кажущиеся интуитивными действия. Вместо Photoshop я предпочитаю использовать IrfanView . Это великолепный инструмент с ужасным названием.

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

Другие полезные инструменты:

GIMP . Бесплатный инструмент, который является альтернативой (с натяжкой) Photoshop. Я считаю его менее удобным, и поскольку Photoshop CS2 теперь распространяется бесплатно, то я не вижу смысла в дальнейшем обращении к Gimp, однако многим пользователям он нравится. Попробуйте его — возможно, он вам понравится.
Picasa . Инструмент для организации фотографий, которым я пользуюсь. Он также обладает, как выяснилось, прекрасными инструментами для редактирования фотографий. Я не думаю, что Picasa подходит для оптимизации ваших изображений для использования в web, однако она достойна того, чтобы упомянуть ее здесь.
Greenshot . Если вам нужны снимки экрана для вашего сайта, то вы можете воспользоваться удобным инструментом Greenshot. Я использую его практически каждый день. Мне он приглянулся.

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

Скачиваем и устанавливаем IrfanView

Обычно это никто не читает, но все же:

Помните, что WordPress создает 3 дополнительных изображения из одного загруженного. Поскольку мы провели уже оптимизацию, плагин SmushIt не может еще сильнее оптимизировать 400×300 изображение. Однако помимо него в WordPress имеются и другие размеры изображений, которые мы можем таким вот образом оптимизировать. SmushIt может оптимизировать за один раз сразу много изображений. Вот отчет, который привел SmushIt для изображений в этой записи.

Во-вторых, я рекомендую поставить Photon всем, кто работает с виртуальным хостингом или кто планирует использовать много изображений на своем сайте. Photon — это сеть CDN, которая предлагается WordPress.com. После того, как вы загружаете ваше изображение, его копия сохраняется на серверах WordPress, которые размещены по всему миру. Это означает, что кто-либо в Нью-Йорке сможет получить изображения с WordPress-сервера, который находится в Нью-Йорке, а не с вашего сервера. То же самое можно сказать про Сан-Диего, Сарасоту, Остин, Техас и Европу. Сеть CDN также проводит некоторую оптимизацию изображений. Эта услуга является бесплатной, и позволяет ускорить загрузку в несколько раз, добиться меньшего размера страниц и большей радости пользователей.

Другие ресурсы оптимизации изображений

Если вы дошли так далеко, позвольте поблагодарить вас за чтение! Вы действительно хотите оптимизировать изображения на своем сайте – и это отлично! Есть гораздо больше разных аспектов и моментов оптимизации, о которых мы можем поговорить. Я постараюсь раскрыть их в будущем – они будут касаться адаптивных изображений и retina-ready изображений. Чтобы не томить вас, предлагаю самостоятельно протестировать два следующих плагина:

Если вы хотите узнать больше по поводу отличий между JPG, PNG и GIF, советую вам следующий ресурс: http://luci.criosweb.ro/riot/basic-understanding-of-web-formats/ . Другой хороший материал для чтения: предложения Google по увеличению скорости вашего сайта путем оптимизации ваших изображений. Почему Google беспокоится об этом? Факторы page speed ваших страниц учитываются в ранжировании вашего сайта в поисковой выдаче. Это еще одна причина, по которой нужно заниматься оптимизацией. Вот ссылка:

Здравствуйте подписчики моего блога сайт! Когда вы начинаете работать над личным ресурсом и его развитием, вы ищите наилучшие способы не только его продвижения, но и подачи информации читателям и я вас в этом понимаю. На успех сайта влияет буквально все: от дизайна до контента. Сегодня расскажу вам про незаменимый плагин оптимизации изображений wordpress, которому обязаны многие успешные . Вашему вниманию предложу несколько видов плагинов, а выбор за вами. Итак, начинаю!

Зачем необходимо такое дополнение?

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

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

Можно же вручную…

Некоторые могут возразить тому, что такой плагин необходимо устанавливать, ведь с тем же успехом можно загружать уже оптимизированные изображения на свой сайт. Да, соглашусь. Я и сам часто оптимизирую картинки вручную, но когда ведешь несколько блогов и публикуешь по 10 статей в день на каждом из них, самостоятельная оптимизация начинает даже раздражать. Представьте, что вы написали почти на одном дыхании интересную статью, а может даже две-три и спешите быстрее их опубликовать. Но тут вспоминаете, что у вас лежит 30-50 изображений, ждущих коррекции…

Какие плагины подойдут лучше?

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

SEO Friendly Images
добавляет название и описание к вашим изображениям. Без атрибутов «alt » «title » в коде точно никуда. Первый – поможет поисковым системам, а второй – отобразит название при наведении мышки на картинку.

EWWW Image Optimizer
отличается способностью конвертировать изображения максимально эффективно, чтобы ваш ресурс грузился быстрее и не зависал из-за картинок, которые вы закачали даже до установки плагина.

Сw-image-optimizer
не прост в настройке и больше подойдет профи, а не новичкам, но справляется прекрасно с задачей преобразования картинок на вашем ресурсе.

Imsanity
помогает веб-мастеру установить желаемые размеры загружаемых фотографий, разрешая задавать определенные ширину и высоту. Конвертирует и позволяет масштабировать без потерь в качестве.

WP Smush.it
позволяет обрабатывать изображения так, чтобы сохранить их в более выгодных форматах. Зарекомендовал себя, как один из наилучших плагинов и я тоже его рекомендую вам!

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

Pb-responsive-images
форматирует img , основываясь на правилах таблиц стилей, также вы в праве настраивать различные комбинации запросов, которые используются по почте.

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

BJ Lazy Load
автоматически загружает выбранные вами фотографии, в том числе и миниатюры, заменяя содержание или заполняя. Настройки позволяют автоматически адаптировать различные форматы.

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

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

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

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

До скорого!

P/S

С уважением, Александр Сергиенко