🏠 | 💻 PC | Web |

Изображения в формате webp

Содержание статьи
Введение
Powershell скрипт
Bash скрипт

Применение

Если у Вас уже есть изображения в формате .webp просто добавляйте их на сайт к уже существующим .jpg или .png с помощью тега picture.

Новые браузеры поймут, что нужно брать .webp старые загрузят .jpg/.png

<picture> <source type="image/webp" srcset="img/heihei_ru_logo.webp"> <source type="image/jpeg" srcset="img/heihei_ru_logo.jpg"> <img src="img/heihei_ru_logo.jpg" class="heihei--logo" alt="HeiHei.ru logo"> </picture>

Конвертация в .webp

Если Вам нужно конвертировать картинки в формат .webp могу предложить довольно простой метод.

Скачиваете cwebp.exe. Где это можно сделать читайте здесь

Создаёте пусту папку, кидаете туда cwebp.exe и все нужные фотографии и картинки.

Создаёте в этой же папке PowerShell скрипт converter.ps1 и вставляете туда следующий код

Powershell скрипт

$dir = "." $images = Get-ChildItem $dir foreach ($img in $images) { # output file will be written in the same directory # but with .webp extension instead of old extension $outputName = $img.DirectoryName + "\" + $img.BaseName + ".webp" # copy-paste the path to cwebp program # and set its input and output parameters # more options https://developers.google.com/speed/webp/docs/cwebp .\cwebp.exe $img.FullName -o $outputName }

Откройте PowerShell, перейдите в эту папку и выполните команду

converter.ps1

Либо сделайте клик правой кнопкой мыши на файл converter.ps1 и в контекстном меню выберите

Run with PowerShell

🖽 Html
🖌 CSS
Joomla
UTM-метки
URLencode
Переадресация страниц сайта
Адаптивный дизайн сайтов
Настройка почтового ящика на Яндекс
Какой хостинг выбрать
Как перенести сайт
Яндекс Метрика
Разница между POST и PUT
Word Press
SEO
Тестирование сайта
A numeric character reference expanded to the C1 controls range.
JavaScript
.webp
Flask
Django
Как указать каноническую страницу сайта
Контакты и сотрудничество:
Рекомендую наш хостинг beget.ru
Пишите на info@eth1.ru если Вы:
1. Хотите написать статью для нашего сайта или перевести статью на свой родной язык.
2. Хотите разместить на сайте рекламу, подходящуюю по тематике.
3. Реклама на моём сайте имеет максимальный уровень цензуры. Если Вы увидели рекламный блок недопустимый для просмотра детьми школьного возраста, вызывающий шок или вводящий в заблуждение - пожалуйста свяжитесь с нами по электронной почте
4. Нашли на сайте ошибку, неточности, баг и т.д. ... .......
5. Статьи можно расшарить в соцсетях, нажав на иконку сети: