Меню Рубрики

Установка плагина smush it

Урок 358 Оптимизация изображений в WordPress с помощью WP Smush.It: пакетная оптимизация картинок сайта путем сжатия

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

Например, если вы воспользуетесь сервисом от Google PageSpeed Insights, прогоните свой сайт, то увидите сообщение, что требуется оптимизация изображений:

Есть очень простое решение данной проблемы для WordPress – просто нужно поставить плагин WP Smush.It. Что он делает? Он автоматически сжимает картинки на сайте в онлайн режиме. Причем практически без потери качества. То есть визуально вы не заметите отличий между изображениями до и после обработки.

Плагин WP Smush.It для оптимизации изображений в WordPress

  1. Как всегда сначала нужно скачать плагин WP Smush.It и активировать его.
  2. После активации плагина все последующие изображения, загружаемые на сайт, автоматически будут сжиматься.
  3. Чтобы сжать уже имеющиеся картинки, нужно перейти в админку WordPress во вкладку “Медиафайлы”:
  4. Перейти в режим списка:
  5. Отметить галочкой необходимые картинки, которые нужно оптимизировать:
  6. Подняться наверх, во вкладке “Действия” выбрать “Bulk Smush.It” -> “Применить”:
  7. Нас перебросит на страничку настройки плагина WP Smush.It. Немного пролистав страницу вниз, обнаружим процесс выполнения задачи:
  8. Правда легко? Вот такой вот классный и простой в использовании плагин WordPress для оптимизации изображений. Снова перейдем во вкладку “Медиафайлы” и мы там увидим на сколько процентов сжались картинки:
  9. Если вас все устраивает (пройдитесь по этим изображениям обязательно, если вдруг вас не устроило, ниже я описал как вернуть на первоначальный вариант) и вы хотите, оптимизировать все картинки, которые имеются у вас на сайте, то перейдите во вкладку “Медиафайлы” -> “WP Smush.It”:
  10. Вот здесь вам будет доступна пакетная оптимизация изображений. Просто пролистайте страницу немного ниже и там найдете кнопку “Bulk Smush all my images”, там же увидите количество картинок, которое будет оптимизировано:
  11. Кликаем на эту кнопку и ждем. Довольно долго. 500 картинок обрабатываются примерно за полчаса. Просто оставляете эту вкладку открытой. А так на этом все, плагин действительно очень удобный и все максимально автоматизировано.

Небольшие особенности плагина WP Smush.It

  • Если вдруг вам не понравились изменения, которые произвел плагин WP Smush.It, вы можете произвести откат. Для этого нужно кликнуть на кнопку “Re-Smush”:
  • После активации плагина вы заметите, как изображения дольше по времени будут вставляться на блог. Это нормально, происходит процесс сжатия картинок. Вот этот фактор немного напрягает меня, я привык, что медиафайлы вставлялись моментально.
  • Ограничение бесплатной версии: оптимизируются изображения размером не более 1 МБ, если нужно будет больше, то придется покупать Pro версию. У меня таких картинок всего 91 шт. на всем блоге, поэтому я не парюсь по этому поводу:

На сегодня все. Познакомил вас с таким простым в использовании, в тоже время крайне полезным плагином WP Smush.It. Если будут какие-то проблемы/вопросы, пишите в комментариях. С радостью отвечу.

P.s. Вам нужно создать качественный сайт для бизнеса? Тогда создание сайтов в Санкт-Петербурге возможно это то, что вам нужно. Доверьтесь профессионалам.

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

50 комментариев на «Урок 358 Оптимизация изображений в WordPress с помощью WP Smush.It: пакетная оптимизация картинок сайта путем сжатия»

Хорошее дело. А он не сильно качество имаов снижает?

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

Ну супер тогда. У нас на сайте, правда говоря, 10к изображений))) Обрабатывать будет 3 дня наверно…)))

Нормик, но вот только это больше нужно для поисковиков. Фотки не долго грузятся, всё равно полезная конечно штуковина. Установил, работает) Спасиб

Да и у не всех высокоскоростный интернет. 🙂 Есть еще те, кто сидит на маленькой скорости 🙂

У меня был установлен этот плагин, но он сжимает совсем незначительно и после его использования, гугл мне указал на тот результат проверки и на те же проблемы. То есть, скорость загрузки сайта никак не изменилась. Для примера, я зжимал картинку 50 кб и она сжалась на 47 кб. Разве эти 3 кб на что-то повлияют? Другое дело, если на сайти тысячи картинок и тогда в совокупности можно сэкономить пару мегабайтов. Но опять же, повлияет ли это как-то или нет?

Читайте также:  Установка ксенона ситроен с4 седан

У меня в постах по 8-10 картинок, сжатие происходит в районе 15%-20% в среднем. С каждой картинкой сжимается в районе 5-10 КБ.
Я не говорю, что это только это спасет всю ситуацию. Нужно комплексно пытаться ускорить сайт. И там каждые 15-20% в итоге окажутся важны.

Спасибо Петр, действительно полезный плагин.

Спасибо большое. Очень полезный плагин.

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

Счастливая, почему-то у меня прям существенно дольше картинки начали вставляться картинки.

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

Ничего другое не нашли? А то я пока собралась с изображениями поработать, как этот плагин приказал долго жить… 🙂

Спасибо, Петь, за крутой плагин! Это офигенно! Хоть у меня картинки максимум по 70-80 Кб, всё равно оптимизирую все сейчас. А потом плагин деактивирую. Кстати, если потом деактивировать плагин, то изменения не отменятся?

Да, если деактивировать, то изменения останутся.

Я плагины почему-то не очень люблю))) А картинки через jpegtran и optipng сжимаю, в результате по google speed нет предупреждений по этому пункту))) и скорость 95 для компьютеров)))

Блин, 95 – хорошие показатели! Как достигли таких показателей, если не секрет?

Не секрет))) Во-первых, изображения все оптимизирую) Во вторых, два плагина установила – Autoptimize – для сжатия CSS и JS; Hyper Cache – для кэширования) Ну и, в-третьих, не пичкаю свой блог дополнительными плагинами, которые можно заменить на код) Например, сейчас у меня 7 плагинов всего лишь установлено))). Вот и весь секрет).

Спасибо, на выходных буду пробовать 🙂

Не хватает второго скриншота из PageSpeed Insights. Что изменилось с этой точки зрения после оптимизации?

Петр, а как же фотошоп и его функция “save from web”? Или это плюс к ней?

тоже самое хотел спросить

Это плюс к ней. Даже после этой функции фотошопа идет сжатие на 10-15%. А так я картинки к посту не прогоняю через фотошоп. Лень, наверное.

Пётр, приветствую! Огромное спасибо за плагин. Есть такая нужда в сжатии картинок. Не хотелось вручную обрабатывать, как некоторые советовали.

Хороший у Вас блог. Подписался на рассылку. =)

Спасибо! 🙂 Следите за новостями, впереди много интересного 🙂

Петь, здравствуй! Увидел по тесту gtmetrix что у тебя хорошо настроено браузерное кеширование. Можешь поделится как ты этого достиг? Это плагин какой-то или “авторский” код в htaccess?

Привет! В одном из следующих постов будет сказано про это 🙂

Установила плагин.Качество картинок не пострадало.Спасибо за совет.

У меня после оптимизации на всех картинках написано: ERROR: posting to Smush.it

То же самое. И сайт самого сервиса недоступен. Прочитал, что такое бывает, но сайт сервиса недоступен уже второй день. Меня перенаправляет на http://smushit.eperf.vip.ac4.yahoo.com/ и там – ничего.

Советую вот этот сайтик http://compressjpeg.com/ – порой на 70% картинка меньше весит и качество не теряется. Регистрация не требуется, заливаем картинки, ждём пару секунд и дело сделано.

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

А картинку не надо переделывать? Дополнять? Редактировать? я всегда стараюсь уникализировать. Ну а если работа уже с готовыми, такие например как фото, то плагин необходим.

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

Добрый день! Спасибо вам за интересные и нужные статьи 🙂
Скажите, пожалуйста, если я загружаю свои фотографии сначала на flickr, а потом на блог с помощью плагина (у меня будет фотоблог), нужно ли их сначала оптимизировать?

Читайте также:  Установки компрессорные передвижные давлением 9800 кпа

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

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

Я раньше просто переделывал картинки в фотошопе и просто их сохранял. Вес конечно был маленький. Но если много то конечно загрузка идет долго. Теперь просто нажимаю сохранить для web и получается картинка по качеству не чем не хуже и вес вообще копеечный.
Это я так к слову сказал как я делаю. А кто воспользоваться хочет плагином – то тоже дело хорошее. Очень помогает он в работе.

Оптимизировала картинки самым популярным плагином с пандой-логотипом, наибольшее кол-во скачиваний, отзывы и тд. Сайт показывает что все ок, картинки сжались якобы, наглядно показано ДО И ПОСЛЕ сжатия, а на деле… как весила 6 мб в среднем страница, так и осталось:( многочисленные тесты разные никаких изменений не показывают:( плагин кэширования суперкэш поставила, тоже все корректно, но гугл ничего не видит, все как прежде:(

А как оптимизировать 40.000 изображений которые на сайте уже,кто знает хороший плагин?

21 век на дворе,нужно автоматизировать процесс сжатия,а не оптимизировать каждое изображение по отдельности.
Загрузил на сайт-плагин оптимизировал и все -автоматизировать,не все нужно руками делать,цените время друзья !

Если вдруг найдешь решение – напиши, интересно)

Здравствуйте, у меня нет кнопки Bulk Smush.It в действиях.
А в остальном плагин работает хорошо.
“Вы оптимизировали 1035 изображений и сэкономили 5,0 MB всего.”
Файлы темы и т. д.
Вручную дает такой результат:
16 изображений сжато175,5 KB ( 48.0% )
Размер изображения: 31,6 KB

Хочу поделиться своим опытом 2017 года. Решил оптимизировать изобржения на сайтах, которые я поддерживаю. Купил платный плагин EWWW Image optimizer. Закинул в него $100, посчитал что должно хватить с запасом. Включил оптимизацию. Процесс на первом сайте дошел до 40% и заглох. Я начал разбираться, оказывается деньги закончились. Плагин берет деньги за оптимизацию кожного thumbnail. А у меня их по десять штук на одно изображения. Поставил WP Smush, бесплатную версию. Оптимизирует за бесплатно 50 изображений, а потом нужно кнопку клацнуть в админке. Почитал я исходники, и написал скрипт который сам кнопку клацает. И так оптимизировал все изображения. Зашел в Google Pagespeed, а он все равно показывает, что изображения не оптимизированы. Если до этого было на 30-40% больше нормы, то после на 10-15%. Решил я все изображения выгрузить по ftp и оптимизировать консолью с помощью кодека Mozilla MozJpeg. Пробовал несколько раз, пока не добился того что Google Pagespeed перестал примахиваться к изображениям. Но качество изображений стало очень плохое. У упущу все эмоции и перейду дальше.

После изучения темы в интернете оказалось что в сентябре 2017 года Google Pagespeed поменял алгоритм, теперь он хочет чтобы все изображения были меньше webp q75 + 9%. Webp в среднем сжимает на 40% лучше чем Jpeg. То есть добиться такого размера от Jpeg и сберечь качество изображения нереально. То есть свалу нет, придется использовать Webp. Но Webp поддерживается только Chrom и Opera. Firefox и Safari их не понимают. Просто пере конвертировать изображения в Webp не поможет. Но есть такой трюк. Можно создать по два файла для каждого изображения. Нормальный и wepb. И выдавать браузерам поддерживающим webp – webp, а не поддерживающим – нормальный файл. Выбор файла выполняется Apache mod_rewrite. Нужно в .htaccess добавить такой код.

RewriteEngine On
RewriteCond % image/webp
RewriteCond % .*(jpe?g|png|gif)$
RewriteCond %/$1.webp -f
RewriteRule (.*) $1.webp [T=image/webp,E=accept:1]

Header append Vary Accept env=REDIRECT_accept

Для генерации webp файлов нашел бесплатный плагин Opti MozJpeg Guetzli WebP. Он очень интересно сделан, чтобы не устанавливать кодеки изображений на сервер (а у меня хостинг и туда они и не поставляться) можно скачать с сайта плагина виртуальную машину для Oracle Virtual Box. В ней стоит Linux, ssh сервер и кодеки изображений (MozJpeg, Guetzli, WebP). Нужно запустить виртуальную машину у себя на компе, подключить плагин к ней по ssh. И плагин будет по ssh ганять изображения и оптимизировать их в виртуальной машине. То есть я как бы сам для себя облако. Вот этим немного извратным способом я таки оптимизировал изображения и создал для них webp дубликаты. Google Pagespeed полностью снял все претензии к изображениям.

Читайте также:  Установка защиты заднего бампера киа соренто

источник

Плагин WP Smuss.it для оптимизации изображений в WordPress

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

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

Вот, к примеру, картинка в популярном формате png, имеющая размеры 1200х900 пикселей и вес 950 КБ.

А вот она-же, преобразованная в формат JPG в 100% качестве. Размер 1200х900, вес 409 КБ

И последняя, уже оптимизированная под ваш блог, без видимой потери качества. Размер 1200х900, вес 70,4 КБ
Заметили разницу? …То-то же) А размер файла уменьшился в 25 раз.

Считается что наименьший вес имеют изображения в формате JPG, в нем то и следует заливать ваши фото на блог. Но одного только JPG, как вы поняли из примеров, будет не достаточно. Так стандартная фотография на современном фотоаппарате в 10 мега-пикселей займет от 3 до 7 МБ все в том-же JPG. И на помощь нам приходят различные оптимизаторы, редакторы и онлайн-сервисы.

Оптимизировать фото для блога можно с помощью специальных программ-редакторов, таких как Photoshop, FastStoneViever, Microsoft Office Picture Manager, PaintNet и много других подобных.

Доступны так-же разнообразные онлайн-сервисы по сжатию фото: JpegMini, WebResize, Fotoresize, прочее.
Но если вам необходимо оптимизировать картинку для блога WordPress, то лучше это делать в самой админке движка. И здесь на помощь приходит плагин WP Smuss.it.

Плагин WP Smush.it

[wp-pic type=»plugin» slug=»wp-smushit» layout=»large» ]


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

Возможности плагина

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

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

Установка WP Smush.it

Скачайте плагин в официальном репозитории модулей WordPress.
После распакуйте его на хостинг в папочку plugins, которую найдете: ваш_сайт/www/wp-content/plugins
Затем активируйте плагин в административной панели блога. Все, наслаждайтесь. Оптимизация изображений блога на WordPress легкое но очень полезное дело.

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

О! Класс! А я по старинке — закидывала в Фотошоп и вручную уменьшала размер каждой картинки. Дело, откровенно говоря, муторное. А тут оптимизация средствами WordPress для самого WordPress. Кстати, вопрос, после установки плагина, картинки, которые были загружены ранее, тоже оптимизируются или только новые?

[quote=»Svetka_13, post: 584, member: 265″]Кстати, вопрос, после установки плагина, картинки, которые были загружены ранее, тоже оптимизируются или только новые?[/quote]

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

Очень полезный плагин. Я также как-то привык в Фотошопе играться с изображениями. Даже никогда и не интересовался подобными плагинами. А есть ли в нем возможность выставлять предел максимального размера файла?

источник