"picture" tag vs. .htaccess - what are the differences?

When using ShortPixel Image Optimizer you can choose between two methods for serving WebP images. Each has its benefits and limitations.

Picture tag needs to be used if you're serving the images via a CDN. But depending on the website's CSS, it can in rare ocassions lead to conflicts. For example a CSS rule like 'div > img' (which by the way it's not the best practice) will not be matched when the img is enclosed in a picture tag.
Using picture tag means that there is a fallback in case a browser cannot display WebP images.

.htaccess cannot be used on CDNs and it will always return the same image extension regardless whether the image is a JPEG, PNG or WebP.
So for example an image could be called "test.jpg" but a JPEG or a WebP image will be served instead depending on the browser's capabilities. This is why it won't work properly with a CDN, because the CDN will cache the first one that is requested (JPEG or WebP) and will serve to all the requesting browsers, regardless of the capabilities.

Still need help? Contact Us Contact Us