Lighthouse & Multi-format Responsive <picture> tag

I'm a little perplexed and wondering if someone can see what i'm missing. Running a Lighthouse test on one of my sites and it's coming back that I should be using WEBP as my image format of choice. As far as I can tell, I am and have PNG as a fallback. Below is the code in question. <picture> <source media="(max-width: 360px)" type="image/webp" srcset="/wp-content/uploads/2023/12/homepage_phone_refresh-358x360.webp"> <source media="(max-width: 360px)" type="image/png" srcset="/wp-content/uploads/2023/12/homepage_phone_refresh-358x360.png"> <source media="(max-width: 640px)" type="image/webp" srcset="/wp-content/uploads/2023/12/homepage_phone_refresh-636x640.webp"> <source media="(max-width: 640px)" type="image/png" srcset="/wp-content/uploads/2023/12/homepage_phone_refresh-636x640.png"> <source type="image/webp" srcset="/wp-content/uploads/2023/12/homepage_phone_refresh.webp"> <img src="/wp-content/uploads/2023/12/homepage_phone_refresh.png" alt="Background Image" fetchpriority="high"> </picture>
0 Replies
No replies yetBe the first to reply to this messageJoin
Want results from more Discord servers?
Add your server