picture(source)を使用して出し分けるサンプル

ChromeならAVIFで表示されています。

<picture>
  <source srcset="sample.avif" type="image/avif">
  <source srcset="sample.webp" type="image/webp">
  <img src="sample.jpg" width="300" height="200" alt="sample">
</picture>

元記事を表示する