WebP - работаем с новым графическим форматом

Например Яндекс Маркет, с недавних пор вовсю использует этот формат. О том, как использовать этот формат и какие плюсы и минусы мы получим, и будет эта статья.

Формат WebP

Главное преимущества WebP — уменьшенный размер файла, и не только - по сути, формат WebP, сочетает в себе все преимущества форматов jpeg и png.

Например:

• WebP поддерживает альфа-канал (прозрачность), в отличии от jpeg, при этом размер файла будет значительно меньше png.
• По результатам тестов, формат WebP, сжимает изображения на 26% лучше, чем png, при этом потери изображения отсутствуют.
• По сравнению с алгоритмом сжатия jpeg, изображение в формате WebP, получается меньше на 25-30%, при одинаковом качестве изображения.

Однако, есть и неприятные моменты. Хотя с момента создания формата файла прошло уже много времени, поддержка его браузерами остаётся на достаточно не высоком уровне: Global74.3% + 0.48% = 74.78% (по данным https://caniuse.com/#search=WebP).

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

Всё дело в том, что в WebP использует новый алгоритм сжатия, поэтому искажение выглядят иначе относительно jpeg.

Картинки WebP - как с ними работать на компьютере

Думаю общая информация о новом формате ясна, пора поговорить как работать с картинками WebP непосредственно на компьютере. Если вы сохраните из Яндекс картинок изображение к себе на компьютер, то скорее всего в проводнике оно будет отображаться в виде значка браузера, так как система и будет ассоциировать такие файл с программой которая их открывает по умолчанию. Это очень неудобно, так как картинки в форматах jpeg и png будут отображаться в виде миниатюр, что гораздо привычнее и удобнее.

Для исправления ситуации и отображения самой картинки WebP, нам потребуется установить WebP codec, например вот с этого ресурса: http://www.free-codecs.com/download/WebP_codec.htm. После установки, миниатюры фалов WebP, начинают отображаться.

Как работать с WebP в Photoshop?

С новыми версиями Photoshop, с WebP можно работать легко, а вот как работать со старыми версиями? Например я работаю в Photoshop CS3, он у меня лицензионный и для моей работы с веб сайтами более чем достаточно, и менять я его не собираюсь.

Для этого существует бесплатный WebP Плагин для Photoshop, скачать который можно тут: https://github.com/fnordware/AdobeWebM. Доступна версия для 32 и 64 разрядных версий. После загрузки вы получите архив с двумя версиями плагина.

В соответствии с версией вашей программы Photoshop и её разрядностью, выбераете нужную версию и копируете её в C:\Program Files\Adobe\Adobe Photoshop CS3\Plug-Ins\File Formats\.

Далее, запускаете Photoshop и теперь у вас доступно открытие формата WebP в программе, а так же экспорт в данный формат.

Как пакетно конвертировать WebP?

Конечно, для пакетной конвертации картинок в WebP и из WebP в jpeg и png, существуют конвертеры, на мой взгляд самый удобный и бесплатный XnConvert. Простой интерфейс и довольно большое количество настроек, заменит любой предлагаемый "онлайн аналог".
Вот пожалуй и всё на сегодня.