Конвертация в webp php
imagewebp
(PHP 5 >= 5.4.0, PHP 7, PHP 8)
imagewebp — Вывод изображения WebP в браузер или файл
Описание
Выведет или сохранит WebP-версию данного изображения ( image ).
Список параметров
quality варьируется от 0 (худшее качество, меньший размер файла) до 100 (наилучшее качество, большой файл).
Возвращаемые значения
Возвращает true в случае успешного выполнения или false в случае возникновения ошибки.
Список изменений
Версия | Описание |
---|---|
8.0.0 | image теперь ожидает экземпляр GdImage ; ранее ожидался ресурс ( resource ). |
Примеры
Пример #1 Сохранение WebP-файла
User Contributed Notes 6 notes
To convert a PNG image to Webp, we can do this:
// Image
$dir = ‘img/countries/’ ;
$name = ‘brazil.png’ ;
$newName = ‘brazil.webp’ ;
WebP is not yet supported by Safari, although they are experimenting with it.
Check out https://caniuse.com/#search=webp for the latest support information.
Safari on mac now has limited support (limited to Safari 14+ on Big Sur or later)
Safari on iOS 14.4 and higher has full support
WebP is a great file format, but it’s basically supported only by Chrome. For WebP files with transparency it’s necessary to have PNG fallback for other browsers (otherwise it won’t work in iOS, Firefox, IE, etc.).
If you have pngquant 1.8 on your server (just get package from official pngquant website), then you can create small fallback images (with quality better than from PHP’s libgd):
// guarantee that quality won’t be worse than that.
$min_quality = 60 ;
// you don’t need move_uploaded_file().
WebP вместо изображений в браузерах где он поддерживается
В данной статье приведены примеры как сделать подгрузку WebP вместо jpg и png в тех браузерах где он поддерживается.
Конвертация в WEBP через SSH
Самый быстрый способ – конвертировать изображения с помощью утилиты cwebp (если он установлен на сервере) через SSH.
Нужно выполнить следующую команду, например через PuTTY, которая найдет все файлы изображений и сгенерирует рядом с ними файлы WebP.
Конвертация в WEBP в Windows
Если сайт очень редко обновляется, то можно выкачивать весь сайт по FTP, конвертировать изображение и закачать обратно.
Пакетно перекодировать изображения можно с помощью программы XnConvert.
PHP-скрипт
Еще один вариант конвертации – PHP-скрипт, который вызывается по URL на несуществующий файл *.webp, ищет в той же директории файл с расширением png или jpg и создает из него файл WebP.
Главное чтобы на хостинге была установлена библиотека GD версией не ниже 2.2.5, т.к. в более ранних версиях у WebP нет поддержки прозрачности при конвертации из PNG.
Посмотреть версию GD можно в phpinfo() :
auto-webp.php
Вывод на сайте
После выбора метода и генерации изображений встает вопрос о выводе их на сайте, специально для этого есть элементы
По спецификации изображение WebP правильно вывести в таком виде, с дублированием основного изображения.
Но во всех браузерах работает и так:
Второй вариант – полная замена расширений в тегах если браузер передал в user agent что поддерживает WebP с помощью PHP буферизации и её функции обратного вызова.
Конвертация в webp php
Convert JPEG & PNG to WebP with PHP
This library enables you to do webp conversion with PHP. It supports an abundance of methods for converting and automatically selects the most capable of these that is available on the system.
The library can convert using the following methods:
In addition to converting, the library also has a method for serving converted images, and we have instructions here on how to set up a solution for automatically serving webp images to browsers that supports webp.
News: 2.6.0 has just been released
Require the library with Composer, like this:
Here is a minimal example of converting using the WebPConvert::convert method:
The WebPConvert::convert method comes with a bunch of options. The following introduction is a must-read: docs/v2.0/converting/introduction-for-converting.md.
If you are migrating from 1.3.9, read this
Serving converted images
The WebPConvert::serveConverted method tries to serve a converted image. If there already is an image at the destination, it will take that, unless the original is newer or smaller. If the method cannot serve a converted image, it will serve original image, a 404, or whatever the ‘fail’ option is set to. It also adds X-WebP-Convert-Log headers, which provides insight into what happened.
Example (version 2.0):
The old introduction (for 1.3.9) is available here: docs/v1.3/serving/convert-and-serve.md
The library can be used to create a WebP On Demand solution, which automatically serves WebP images instead of jpeg/pngs for browsers that supports WebP. To set this up, follow what’s described in this tutorial (not updated for 2.0 yet).
Projects using WebP Convert
CMS plugins using WebP Convert
This library is used as the engine to provide webp conversions to a handful of platforms. Hopefully this list will be growing over time. Currently there are plugins / extensions / modules / whatever the term is for the following CMS’es (ordered by market share):
Other projects using WebP Convert
webp-convert-cloud-service A cloud service based on WebPConvert
webp-convert-concat The webp-convert library and its dependents as a single PHP file (or two)
Supporting WebP Convert
Bread on the table don’t come for free, even though this library does, and always will. I enjoy developing this, and supporting you guys, but I kind of need the bread too. Please make it possible for me to have both:
Persons who contributed with coffee within the last 30 days:
About
Convert jpeg/png to webp with PHP (if at all possible)
Готовим WebP правильно
Хабр уже насыщен статьями на тему «нового» формата изображений WebP (описание, сравнение с JPEG2000, сравнение с BPG, использование, подключение на сайте). К сожалению, открытыми остаются вопросы: как правильно подключить WebP на сайте, чтобы «все работало», и насколько он лучше (меньше) PNG/JPEG. В этой заметке я буду отвечать на оба вопроса.
Предполагаю, что вы уже в курсе оптимизации изображений, умеете конвертировать изображения в WebP, понимаете разницу между использованием JPEG и PNG на сайте, знаете инструменты ExifTool, jpegtran, mozjpeg, JPEGrescan, optipng, pngcrush, pngwolf, zopflipng и TruePNG, а также различаете пастеризацию молока и постеризацию изображений.
Если все так — то переходим к сути.
Плюсы WebP
Во всех источниках упоминается существенное уменьшение размера изображений, что PNG, что JPEG, если их перекодировать в WebP. При этом перекодирование должно выполняться с сохранением качества. В Айри.рф уже три года используется автоматическая оптимизация изображений без потерь и с незначительными потерями (2 режима). Это позволяет достаточно точно сравнить, когда WebP выигрывает в сравнении с уже оптимизированными PNG (прогоняется через TruePNG, pngwolf и zopflipng) и JPEG (ExifTool, mozjpeg, перевод в png), а когда нет.
На тестовой выборке из 13 тысяч изображений WebP показал выигрыш относительно уже оптимизированных PNG и JPEG файлов на 31% (580 Мб против 837 Мб). WebP-файлы примерно на треть меньше уже оптимизированных аналогов JPEG и PNG. Здесь нужно оговориться, что перевод PNG в WebP выполняется без потерь (lossless), а перевод в JPEG выполняется с минимальными потерями (качество 100), это позволяет в автоматическом режиме отгружать WebP для всех браузеров, которые его понимают, без опасений что-то «поломать» у клиентов.
В подавляющем большинстве случаев выигрыш WebP относительно уже оптимизированных JPEG (mozjpeg) составлял не более 10%. Исключения были в тех случаях, когда из JPEG-файлов нельзя было безопасно вырезать EXIF-данные (в частности, палитру), и перевод их в WebP давал существенный выигрыш. Поэтому если вы создаете JPEG сразу по «нормальному» сценарию, то в большинстве случаев существенного выигрыша не предвидится. PNG-файлы даже после оптимизации относительно неплохо (30%) «теряют в весе», если перевести их в WebP.
Что важнее, относительно всех оптимизированных изображений только в 10% случаев (да, выборка из 13000 изображений — это было только 10% всех оптимизированных изображений) WebP «без потерь» давал выигрыш в размере. Для остальных 90% выигрыша не было (из них 75% — это JPEG файлы). Цифры еще могут быть обусловлены жестким подходом к оптимизации изображений без потерь: возможно, тонкая настройка WebP с «небольшими» потерями качества даст визуально «тот же результат», но будет меньше по размеру. К сожалению, в автоматическом режиме оценить все 130 тысяч изображений, чтобы понять, насколько в каждом конкретном случае сжатие с потерями может быть лучше, не представляется возможным. Сами изображения не представляют какой-либо закономерности: это фоновые картинки и галереи сотен сайтов.
Для справки, перевод PNG в WebP
Отличной иллюстрацией является изображение к статье. Исходный PNG занимал 15,6 Кб. После оптимизации и постеризации — 12,5 Кб. lossless webp из него — 8 Кб.
Реальное использование WebP
Если вы уже научились правильно конвертировать или сохранять изображения в WebP (тема для отдельной статьи), то остается проблема подключения WebP на сайте, которая уже поднималась здесь (игра стоит свеч, ибо Chrome браузеры уже составляют более 2/3 рынка). На стороне браузера возможны варианты с JavaScript (использование тега noscript, ymatuhin):
Как конвертировать в WebP все изображения на PHP
Почему стоит использовать WebP для PHP?
Использование Webp решает проблему «Используйте современные форматы изображений» в Google Pagespeed Insights.
Если браузер посетителя не поддерживает WebP, то CDN отдаст старый формат (png/jpeg), но сжатый (оптимизированный под Web)
Что такое сжатие изображений
Оптимизация картинок является специальной обработкой графического файла с целью минимизировать его размер без потери визуального качества.
Чтобы провести данную процедуру, есть большое количество достаточно сложных алгоритмов. Однако, все они базируются на одной основе — из графического файла нужно удалить все находящиеся там служебные данные (например название программы, которая хранит данный файл и др), а также, при помощи специальных программ соединить/сгладить похожие цвета.
В результате мы получаем то же изображение, которое визуально никак не изменилось. Однако, объем (вес) этого файла в байтах будет гораздо меньше, чем оригинал. Если провести данную обработку правильно, файл с изображением можно уменьшить до 98%, не теряя при этом качества изображения.
Это значит, что картинки на страницах сайта будут загружаться в разы быстрее после проведения их оптимизации.
Что даст оптимизации изображений для вашего сайта
Доказано, что ускорение сайта способно улучшить поведенческие факторы, а также поднять конверсию сайта (увеличить продажи). Чем дольше будет загружаться страница сайта, тем меньше покупателей сможет совершить там определенные целевые действия. Если Ваш сайт в Интернете будет работать не достаточно быстро, у Вас есть все шансы упустить свой потенциальный доход. Ускорение работы интернет-ресурса даст возможность улучшить конверсию и благодаря этому значительно увеличить выручку и привлечь больше клиентов.
Преимущества сервиса CDN OptiPic
Каким образом оптимизация изображений может ускорить сайт?
Страница любого сайта чаще всего состоит из:
Такой пункт как изображения, занимает на страницах сайта большую часть всего объема и является самой «тяжелой» частью страниц. Уменьшение (оптимизация) изображений бесспорно позволит существенно сделать более быстрой загрузку любого интернет-ресурса.
Соответственно, если изменить (в меньшую сторону) объем изображений, все страницы сайта начнут грузиться значительно быстрее.
Сжатие картинок на сайте даст возможность уменьшить их объем до 75-98%, не теряя при этом свое визуальное качество.