Цифровой садик - приветственная

Цифровой садик - приветственная | Полный список всего, что тут есть | RSS | Подписаться через follow.it

18.05.2022

webp и отзывчивые картинки

Гуглевое.

<img src="flower-large.jpg" srcset="flower-small.jpg 480w, flower-large.jpg 1080w" sizes="50vw"> 

или

<picture>
  <source type="image/webp" srcset="flower.webp">
  <source type="image/jpeg" srcset="flower.jpg">
  <img src="flower.jpg" alt="">
</picture>

The media attribute specifies a media condition (similar to a media query) that the user agent will evaluate for each <source> element.

If the <source>'s media condition evaluates to false, the browser skips it and evaluates the next element inside <picture>.

<picture>
  <source srcset="mdn-logo-wide.png" media="(min-width: 600px)">
  <img src="mdn-logo-narrow.png" alt="MDN">
</picture>

Сконвертить папку разом

for file in images/*; do cwebp "$file" -o "${file%.*}.webp"; done

encoder and decoder applications, cwebp and dwebp respectively, to showcase the available functionalities of WebP.

/usr/bin/cwebp
/usr/bin/dwebp
/usr/bin/gif2webp
/usr/bin/img2webp
/usr/bin/vwebp
/usr/bin/webpinfo
/usr/bin/webpmux
/usr/share/man/man1/cwebp.1.gz
/usr/share/man/man1/dwebp.1.gz
/usr/share/man/man1/gif2webp.1.gz
/usr/share/man/man1/img2webp.1.gz
/usr/share/man/man1/vwebp.1.gz
/usr/share/man/man1/webpinfo.1.gz
/usr/share/man/man1/webpmux.1.gz

Если у вас есть мысли, комментарии, предложения или отклики по поводу этой страницы или этого цифрового сада в целом, напишите мне сообщение через Яндекс.Форму или на agnessa@agnessa.pp.ru. Мне ооочень интересно!

Задонатить.


An IndieWeb Webring 🕸💍