Images Not Being Converted to WEBP #
Using StackCP’s Web Optimizations allows you to quickly and easily optimize resources on your website, providing a better user experience and reducing your website’s loading time. At CP CLOUD HOSTING, we ensure that these optimizations are user-friendly and effective. One of the most popular filters is the Convert to WEBP lossless filter, which converts PNG and non-animated GIF images to losslessly-encoded WebP. This happens if it’s determined that the images are sensitive to compression noise and if the latter format is supported by the browser. Otherwise, this filter is ignored.
How to Check if Images Are Being Converted #
To verify if an image is being converted to WEBP, you can check its response headers. Here’s a simple method to do this:
- Right-click on the image and select Open image in new tab.
- Check the URL: You should immediately see if the image is appended with the .webp file format.
- Check Response Headers: If the image is not in .webp format, you can check the response headers by pressing F12 and selecting the Network tab in Chrome. Then select the first row under the Name heading and choose the Headers tab. Look for the following two headers:
- pagespeed: on
- pagespeedfilters: combine_css, combine_javascript, convert_meta_tags, convert_to_webp_animated, convert_to_webp_lossless, dedup_inlined_images, extend_cache, fallback_rewrite_css_urls, flatten_css_imports, inline_css, inline_javascript, insert_image_dimensions, lazyload_images, recompress_images, resize_images, rewrite_css, rewrite_images, rewrite_javascript, sprite_images
These headers indicate whether the web optimizations are enabled and which individual filters are in use. In this case, we are looking for the convert_to_webp_lossless filter, which should be enabled.
Why Are My Images Not Being Converted? #
StackCP’s Web Optimizations assess whether there is enough benefit to converting the resource to the WEBP format. If resources aren’t being optimized, it could be because they’re not in a ‘cacheable’ state. Here are some reasons why your images might not be converted:
- Cache-Control Headers: If the web optimizations see cache-control headers such as nocache or private, they will not rewrite the resources.
- Third-Party Themes or Plugins: Some resources, particularly those served by third-party themes or plugins, may require a more aggressive filter or optimization technique to ensure they’re rewritten.
- Content Security Policies: The web optimizations will adapt to any Content Security Policies specified in the response headers, usually set in a .htaccess file. So reviewing any rules set there is important.
- No-Transform Headers: The optimizations will not rewrite resources that have a cache-control: no-transform header set. This includes resources such as JavaScript, CSS, and images.
At CP CLOUD HOSTING, we can help ensure that the StackCP module is working from the outset, but manual granular optimizations that require base code level changes may need to be handled separately.
By understanding these factors, you can troubleshoot why your images might not be converting to WEBP and make the necessary adjustments to improve your website’s performance.