Что такое современный формат изображений WebP и как его использовать в WordPressОбзор WebP Express

Артем Абрамович

Меня зовут Артем Абрамович и я являюсь фрилансером-вордпресером. Занимаюсь настройкой и редактированием сайтов созданных на CMS WordPress. Это основная моя специализация, есть еще несколько работ, которыми я занимаюсь, но обо этом вы можете более подробно узнать из моего портфолио.

100 комментариев к “Что такое современный формат изображений WebP и как его использовать в WordPressОбзор WebP Express”

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

    Ответить
    • Может и лучше, но готовых решений под этот формат не нашел

      Ответить
    • Артём, пора его сделать самому ! ))))))) я верю в Вас ! ))
      а с этой проблемой я столкнулся на опенкарте, там и как на вордпрес нету тоже )

      Ответить
    • Было бы действительно круто запилить такой плагин, который в зависимости от бровзера подставляет нужную картинку из вариантов jpeg2000/jpegxr/webp. Меня как-то коробили красные результаты в тестах скорости и пытался внедрить какой-то из этих форматов, но не подменой, а просто перезалить все изображения в другом формате. Так оказалось что каждый из них не поддерживает какой-нибудь браузер. В итоге до зеленого вытянул litespeed cache. На мой взгляд, самый простой и стабильный плагин кеширования. В нем, кстати, есть эта фича с подменой на webp, но как она работает я так и не узнал. Хватило кеширования.

      Ответить
  2. подобные манипуляции были-бы актуальны лет 15 назад, когда люди сидели на диалапе

    Ответить
  3. Тест зачётный. А то руки не доходят самому затестить и задача как-бы была в подвешенном состоянии.
    Хз кто как, я пока не вебпи. Сафари, кстати, тоже не поддерживает

    Ответить
    • Спасибо. Ну у меня сафари нет, так что проверить негде)

      Ответить
    • Ну на превьюхе жеж пример) Там где jpeg весит 1Мб, webp — уже килов 200. А в данной настройке — 80 это качество уже самой картинки в webp

      Ответить
  4. Ковырялся с многими пдагинами, в том числе с WebP express, но что-то в настройках не так сделал и не срабатывал конвертер, jpeg и png оставались в хроме. P. S. в форумах много «знатоков» отговаривают от WebP, хотя уверен что Google лучше посоветует, чем горе-умельцы староверы Web дизайна)))

    Ответить
    • Интересно, почему отговаривают? Нормальный формат, мне прям понравился
      А конвертер мог не срабатывать из-за хостинга, например где-то блокировалось

      Ответить
    • Зачем? Меня все устраивает, я за цифирками не гонюсь. Ну и по секрету, мне для скорости достаточно кеш включить, но мне он не требуется

      Ответить
  5. Спасибо. Но проблема сама по себе уходит если картинки формата jpg, jpeg, png сами по себе оптимизированные и весят мало. Так что совсем не обязательно переходить на формат WebP. У меня все картинки на сайте jpg и png и такой проблемы нету. По идеи с JPEG 2000, JPEG XR и WebP можно сэкономить немного больше места с меньшей потерей качества но толку если на многих браузерах сейчас нет поддержки, а оптимизированный jpg грузит везде. Возможно, есть смысл для больших изображений или в будущем когда будет больше поддерживаться браузерами. Ждем видео по оптимизации скорости к 100!

    Ответить
    • Это да, если картинки небольшие, то проблем никаких. Но например, фотографам — подобный формат будет очень полезен, так как реально быстрее все будет. Фотки то у них огромные

      Ответить
  6. Насчёт настройки Imagick и GD Extension ничего не сказано. По плагину да. А вот эти штуки, поставить поставил, пишет не поддерживает WEBP.

    Ответить
    • +WPRUSe · Финты WordPress обновил модули PHP 7 gd поставил, imagick скомпилирован без поддержки WebP. Но в целом за пару дней разобрался. Imagick так и не взлетел.

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

    Ответить
  8. Почему про яндекс никогда не говорят? Совместим ли формат с этим браузером? Или если с хромом формат совместим то и с Яндексом совместим автоматически, не стоит внимания.

    Ответить
    • +WPRUSe · Финты WordPress потому, что ничего не меняется. Показатели выше не становятся, только лишняя нагрузка на сервер.

      Ответить
  9. Я все картинки через фотошоп прогоняю, улучшаю, оптимизирую и пр. после чего они вообще ничего не весят.. а так глупо вообще сырую картинку на сайт ставить, она же весит не меряно.. вообще не понимаю всей этой возни с картинками, изначально нужно с картинками работать, чё потом руками-то махать)

    Ответить
    • Обучи планету фотошопу и будешь прав, а пока это только бравада.

      Ответить
    • +Mourat Boutry кому надо, тот освоил, ну а ленивые ищут костыли, точнее грабли)

      Ответить
    • Ты это расскажи тем кто в первый раз сайт открыл. Много раз видел как на сайт льют картинки прямо с фотика размером по 3-5Мб

      Ответить
  10. Артем Артем. Во первых edge будет новый на основе хрома, то есть webp там будет. Во вторых вышел фаеофокс 65 с поддержкой webp )

    Ответить
  11. Как функция замены урла картинки сочитается с кэшированием страницы? Если только что заходил человек с хрома создается кеш с webp картинками, а за ним пришел edge и страница кэшируется заново с картинками jpg?

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

      Ответить
  12. Провел конвертацию картинок магазина (демо товары), 1/3 картинок в webP стали весить больше оригинала от 20 до 150%
    Учитывая такие данные + необходимость держать лишний плагин сжирающий процессорное время, выгода сомнительная.
    Это я проверял только в библиотекой Gd, возможно другие дадут лучший результат. Кстати со стандартными настройками картинки сильно потеряли в качестве. Особенно заметно на лого, оно стало мутное мыльное. Как буд-то сохранил jpg в фотошопе с качеством 20/100

    Ответить
    • Хм, я хз почему так. Я на собственном сайте показывал, сайт работает можете сами глянуть. Может с настройками что не так

      Ответить
    • @WPRUSe · Финты WordPress у меня тоже работает нет проблем, просто часть картинок прилично тяжелее оригинала. Между нашими тестами есть разница. У тебя 2 библиотеки доступно, может в этом дело. На моем хостинге только одна есть.

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

      Ответить
  13. Внезапно WebP уже работает и на Edge(с версии 18) и на Firefox. Не работает только на safari. А jpeg 2000 наоборот, работает только на сафари.((

    Ответить
    • Ну 18-я уже на хромиум вроде работает, потому и поддерживает

      Ответить
  14. Подскажите пожалуйста какой нибудь хороший плагин для перелинковки

    Ответить
  15. Добрый день.
    Я в фреймворках для wordpress полный ноль.
    Когда я пишу о фреймворках, я имею в виду page builder.
    На курсах нам рассказывают о фремворке unyson.
    Что вы о нем думаете, какие фреймворки сами используете и какие посоветуете новичкам?

    Заранее благодарен.

    Ответить
    • Юнисон вроде Элементоры купили, так что смысла нет его использовать. Лучше сразу Элементор использовать и под него виджеты делать
      Нормальный билдер, на сегодня самый популярный и удобный

      Ответить
  16. Подскажите плагин для обновления ссылок перешел с http на https. Вообще что нужно сделать после перехода?

    Ответить
    • Редиректы настроить и изменить ссылки в базе. Ну или поставить и включить плагин Simple SSL

      Ответить
  17. Вообще ничего не поменялось , гугл так же ругается. Это действительно все настройки у данного плагина? может что-то еще нужно настроить?

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

      Ответить
  18. Подскажите как исправить. В Google search console. Пишут индексирование страниц запрещено тегом noindex. Как это исправить, есть ли плагин?
    Также исключены из поиска:
    Вариант страницы с тегом canonical
    Страница является копией. Канонические версии страницы, выбранные Google и прльзователем не совпадают.
    Подскажите как исправить это!!!

    Ответить
    • Значит где то на страницах стоит тег noindex, может быть где-то в плагине включено

      Ответить
  19. у меня плагин не хочет конвертировать картинки в формат webp((( ругается на все способы конвертации: Result: Failure
    Message: Gd has been compiled without webp support.

    Ответить
  20. А вордпресс в товары на вукоммерсе не дает загрузить фотку в webp. как это исправить?

    Ответить
    • И не даст, данный формат не зарегистрирован. Только png, jpeg можно загружать по дефолту. Но можно разрешить дополнительные форматы для загрузки

      Ответить
    • Да, автор говорит что были проблемы с безопасностью, которые он порешал. Может откроют еще

      Ответить
  21. Получается что WebP Express не преобразовует картинки которые находятся в селекторе CSS «background», и PageSpeed все равно ругается на старый формат изображений.

    Ответить
  22. 0:10 Мда…не тебе говорить о технологиях, видео до сих пор в 720 снимаешь, а уже внедряют 4к

    Ответить
    • И что? Как разрешение видео на информацию из видео влияет? Не нравится не смотри, тебя же к стулу не привязали, а стебать я и сам умею

      Ответить
  23. Спасибо.
    Побегали с бубном, но результат как и в начале видео))

    Ответить
    • Не, так быть не должно. Скорее всего у вас хостинг не поддерживает нужные расширения

      Ответить
  24. Подскажите пж — лучше грузить на сайт изначально изображения в jpeg и png, а потом использовать скрипт / плагин для конвертации в webp или же можно изначально грузить изображения в формате webp (сконвертированные предварительно на пк)? И уточните — webp нужно же заменять только jpeg? Или целесообразно и png?

    Ответить
    • Как удобнее, но webp некоторые браузеры не понимают, так что штатные форматы все равно придется использовать

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

    UPD
    Сжал прогой WebPconv, теперь цвета без потерь.
    TestSpeed почему-то дает разный результат на одной и той же странице, если перетестировать через некоторое время. С WebP и без у меня тоже выдает примерно тот же результат. Но это не скорость, на сколько я понял, это просто оценка страницы в баллах по разным критериям, которая пляшет, как я выше писал.
    Сохранил свою страницу на диск. С WebP весит примерно 2.2 М, с обычным форматом 3 М. Я думаю стоит использовать.

    Ответить
    • Все верно, это не скорость , а относительная оценка в попугаях, по сравнению с похожими сайтами)

      Ответить
    • Привет! Нет вроде, это вроде запись в заголовки идет. Точно не помню, надо плагин опять смотреть

      Ответить
    • @Финты WordPress Плагин нужный и задумка хорошая, но проверил работает он не корректно. В фаерфокс показывает png, jpg хотя он поддерживает webp.

      Ответить
  26. Edge поддерживает с 18-й версии, она вышла в 2018-м. Его тормозит только Safari почему-то, самое главное, что Android поддерживает, а на нём большая масса пользователей, иногда тут полезно инфу чекать — https://caniuse.com/#search=webp

    Ответить
  27. вами же описанный ранее плагин EWWW Image Optimizer, уже конвертирует в WebP……😜

    Ответить
    • Когда я про это плагин озвучивал, еще не умел, но вообще сегодня многие плагины такое умеют

      Ответить
    • @Финты WordPress В плагине EWWW Image Optimizer сделал настройки WebP, но не работает. Сделали бы обзор этого плагина заново, было бы очень интересно. Не хочется дополнительно втыкать WebP Express

      Ответить
  28. Тоже озадачивался этой проблемой, когда делал себе сайт, пробовал разные плагины — не понравились. У них, как правило, лимиты на бесплатное использование, а у меня фоток много. В итоге написал свой плагин: https://github.com/denkiril/Add-WebP-to-WP

    Он генерирует webp файлы на основе jpg и png, что уже лежат на сервере. И оптимизирует оригинальный jpg/png. И при загрузке тоже, конечно. И имеет собственную функцию по созданию html для вывода webp — её нужно будет в теме использовать. Короче плагин — не готовый продукт, и скорее всего потребует доработки. Но мож кому пригодится.

    Ответить
  29. Ох уж эта погоня за попугаями. Бесполезное это дело. 100-ку НИКОГДА не достичь, от слова СОВСЕМ.

    Ответить
  30. В прошлой версии speedpage, оптимизация картинок, давало большое преимущество, все сайты свои вывел в зелёную по твоим видео

    Ответить

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

%d такие блоггеры, как: