avif ve webp formatındaki fotoğraflar html'e nasıl yüklenir ?

Merhaba, avif ve webp formatındaki fotoğraları <img src=""> kullanarak ekleyince chrome'da gözüküyor fakat telefondan safari ile girince gözükmüyor.
Acaba bunları nasıl optimize edebilirim ?
Geçmişte buna benzer birkaç konu açılmış R10'da fakat çözüm bulamadım tekrardan açmak istedim.
Yardımcı olan herkese çok teşekkürler iyi günler.

https://www.contentful.com/blog/load...bp-using-html/

<picture> ile yapılabiliyor. Detaylı açıklaması linkte var. Bana sorarsanız CDN ile halletmek en sağlıklısı.

webp to png yap direkt

png dosya boyutu çok büyük o yüzden avif kullanmak istiyorum

teşekkürler inceleyeceğim. CDN ile nasıl yapılıyor ?

Siteniz uluslararası değilse CDN kullanmanıza gerek yok. Bahsettiğiniz formatlar Safari'de zaten çalışmıyordu. Safari'de çalıştırmak için .htaccess ile yönlendirme yapılıyor ama aynı fotoğrafın .jpg veya .png formatının da yüklü olması gerekiyor. Diğer türlü kod yapısını değiştirerek uğraşmak uzun sürer. Siz en iyisi mevcut fotoğrafları optimize edin yeterlidir.

1- YEDEK ALIN

2- FTP içindeki upload klasörünü (veya adı neyse) komple indirin.

3- Şu siteye girin ve hepsini aktarın. Bu arada gördüğünüz gibi boyutlarını da ayarlayabilirsiniz.

4- Aktarma ve optimize bitince indirin, tekrar geri yükleyin.

Bu kadar.