This browser is no longer supported.
Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(268.8, 45%, 36%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3ESR%3C/text%3E%3C/svg%3E)
Hi,
I'm a web designer and Developer Recently I added AVIF format to one of the client's websites because it compresses the whole image and gives decent speed for the website. It's working all on other browsers. Except for Microsoft edge. Even though statistically only 2 % of people are using Edge. so I'm just wondering whether. Do you guys have any solution for this?
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(102.4, 74%, 19%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EJS%3C/text%3E%3C/svg%3E)
Cambia el código como en el ejemplo siguiente:
<picture>
<source srcset="/imgs/imagen.avif" type="image/avif">
<source srcset="/imgs/imagen.webp" type="image/webp">
<img src="/imgs/imagen.jpg" alt="Description">
</picture>
SI el navegador es compatible carga el Avif, sino el Webp y sino el jpg, png, o le que pongas, etc.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(38.4, 4%, 13%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3ESF%3C/text%3E%3C/svg%3E)
Microsoft should at least commit to this as "Won't Fix" or something if they don't intend to ever do it.
This polyfill seems to work until then https://github.com/Kagami/avif.js
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(278.4, 40%, 36%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EA%3C/text%3E%3C/svg%3E)
I am using the latest version of Edge, and the biggest problem is that certain websites, mainly the new video sharing site Vanillo, use AVIF and AV1 heavily, meaning certain images and functions do not work as they intended compared to using other browsers. It would be vital if Microsoft were to enable this feature on the Stable build of Edge, so that users like me aren't left out to use another separate browser to access sites that use AVIF image formats.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(80, 76%, 17%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EGB%3C/text%3E%3C/svg%3E)
+1 for AVIF support. Edge is now the outlier in lacking support. Supporting it is critical both for smaller images (faster page loads, reduced bandwidth, etc) as well as support for HDR photos.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(128, 8%, 22%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EA%3C/text%3E%3C/svg%3E)
Is there any update in Edge to support AVIF?