I am creating a photography portfolio. I want to use .avif format as the main image format as it has by far the best quality when optimized. Though, I would like to give the option of a fallback image source, for example as .jpg, when the browser doesn’t support .avif (safari lower than 16.4, for example). The thing is that I need both sources to be dynamically chosen in some way. I can’t think of any ways to do that though. Each project has an ACF gallery field, where I choose the .avif files. How can I link the .jpg that go with each image and how can I declare them as sources within a picture tag and all this dynamically? I am hitting my head on a wall, but I find no solution.
Thank you in advance for any tip to the right direction.