How To Serve Next-Gen Format Images For WordPress?

The speed of your WordPress site, both on desktop and mobile is the key to business success. Increasing the site speed will improve customer satisfaction and let you get the high rankings in the search engine results. 

When you test the speed of your site using the Google Page Insight tool, then you might have seen the “Serve images in next-gen formats” recommended message as one of the test results for the mobile version. 

serve-next-gen-format-pagespeed-insights

So, why are you getting this issue? What does it mean? How to solve this image fault and speed up your WordPress site?

Let’s see everything in this post!

Before getting into the details, let me tell you about the Next-Gen image formats.

What Are Next-Gen Formats?

Image formats like JPEG 2000, JPEG XR, and WebP are the next generation formats that offer better compression than the old-school image formats JPEG or PNG.

These superior image compression formats can encode the pictures in an efficient manner without compromising the quality. 

Yes! they have been introduced for faster image downloads, better-looking graphics and consume minimum data consumption.

WPRocket has compared the JPEG & PNG format with WebP format and produced the following results where you can see the considerable size reduction with the next-gen image format – WebP

comparing-jpeg-webp

Advantages

Since they occupy less space, the loading time of your site will be faster and provides the best user experience for your audience which in turn results in higher conversions.

In addition, you can save more bandwidth and reduce the cost spend on your hosting resources.

Limitations

Unfortunately, the browser support for these superior image formats is not universal. Moreover, WordPress CMS  doesn’t support these next-gen image formats.

So, if you upload these advanced images files to the WordPress media library, then you will get the message – “ Sorry, this file type is not permitted for security reasons”

Then, how to use next-gen image format for a WordPress site?

Next-Gen Image Formats WordPress Plugin? 

You can serve images in next-gen formats for WordPress by editing the coding part. However, it would be a hectic process for non-techies. 

As you know the 3rd party plugins can extend the WordPress functionality and yes, a handful of tools are available to get this job done.

Now raises a question, which is the best WordPress plugin to serve images in next-gen formats?

Well! My reply is ShortPixel Pro plugin for WordPress!

I have recently bought this plugin for image optimization and increase the overall page speed score. let me have a word about it!

Most of us use the well-known image formats JPEG or PNG and now you need to convert them to WebP to avoid getting the message and make your site load super fast as well.

Shortpixel is the best image compressing and optimizing tool for WordPress. It can increase your site performance and SEO ranking by reducing the size of the images.

This light-weight plugin offers lossless, glossy and lossy optimization along with the Backup & restore feature.

As it can generate the optimized WebP version of any JPEG, PNG and GIF image, you will get great speed score and avoid getting the warning message in the page speed result.

How To Serve Images in Next-Gen Formats For WordPress Using Shortpixel?

Shortpixel has a free version, however, I would suggest you go with the premium plan if you have 2 or more sites and yes, a single license can be used for multiple sites.

First, you will need to create a free account in ShortPixel and buy any premium plan.

Now you will get the API code.

Visit WordPress Dashboard > Plugins > Add New

Install ShortPixel and Activate

join-shortpixel

Go to Settings > ShortPixel > enter API code

shortpixel-api

Now, you will get the following message and go to the advanced tab to enable the WebP image format

convert-webp-shortpixel

Enable the option and hit “Save and Go to bulk process

Now, it starts optimizing your media library and custom folders

bulk-optimization-shortpixel

I have installed this image optimizer for my other WordPress blog and you may have a look at the increase in the page speed score. In addition, there is no message in the speed test result about serving the next-gen format images. 

4 More Image Optimization Tools To Serve WebP Format

1. WebP Express

WebP Express is an excellent WordPress plugin to serve the WebP format for the browsers that supports it.

As the images play a major role in affecting the page load speed and JPEG images are the twice big as WebP format, this lightweight image converter has been launched for the WordPress admins.

Best Features

  • It is capable of converting the images to WebP next-gen format using multiple methods like altering the HTML, combining with Cache enables and adding webpjs javascript.
  • The converted images are less than half of the size of JPEG images and yes, with the same quality.
  • It reduces the bandwidth consumption and helps you get better Google search engine ranking.
  • It can be used along with the Shortpixel plugin for better results.

2. EWWW Image Optimizer

EWWW Image Optimizer is another ideal plugin for automatic WebP conversion with ExactDN and you don’t need to configure anything in addition because all the WebP images will be stored on their CDN servers.

You can also produce a WebP version of your images and serve them to the browsers that support WebP image format.

Best Features

  • Multiple methods are available to serve the WebP images like Apache-compatible re-write rule and JavaScript WebP rewriting option.
  • It also works with the Cache enabler plugin from key CDN and well-known CDN providers.
  • PNG to WebP conversion is completely lossless.

3. WP Smush Pro

WP Smush Pro is an award-winning image compression plugin for WordPress. It can optimize and resize all the images automatically and speed up your site by saving space.

You can even compress big files directly from the camera and restore the original files when you need full quality.

Best Features

  • It converts and delivers WebP images on the supported browsers.
  • Its CDN does not directly modify the images and harm them in any way.
  • 30 days trial version is available.

4. Optimus

Optimus is one of the best WordPress image optimizer tools that can reduce the file size of the media files automatically by maintaining the image quality.

It is excellent in converting the images to WebP format. However, you have to use the Cache enabler Plugin to deliver the WebP images to the browser that support the next-gen formats.

Best Features

  • WebP file is handled in .htaccess through the redirection rule.
  • Allows generating WebP images on the images that have already been optimized.

Wrapping Up

Images can occupy more space and take up a lot of resources on your server that finally affects the page loading speed of your site. So, the compressing and optimizing the pictures has become a mandatory process.

The web giant, Google wants to make the web faster and hence developed a Next-Gen image format – WebP that can make the image size smaller than the JPEG and PNG formats.

And yes the good news, it has the potential to speed up your WordPress website and hence it is being recommended by Google Page speed insights tool when you run the site speed test.

However, browsers like Safari and FireFox are not supporting this superior image format. And even the WordPress CMS! Thus, you need to rely on a few 3rd party plugins to make the WebP images work for WordPress.

ShortPixel Pro is the best tool to create the WebP version of the existing images in WordPress and serve them to the browsers that support the format.

It is recommended to use the Cache Enabler plugin along with the ShortPixel to get the perfect result. You may also make use of other plugins that I have listed in this blog post and convert JPEG & PNG images to WebP format in WordPress.

It’s just a piece of content for WordPress image optimization! If you want to get a fast loading site, then read my in-depth Speed guide for WordPress

Now you say, How do you optimize images in WordPress? Which image compression tool would you like to use and serve images in next-gen formats for WordPress?

Share your viewpoint in the comment section. Let’s discuss! Besides, don’t hesitate to install the ShortPixel image compressor for your WordPress business site! 

 

by Nirmala
Nirmala is an avid blogger, WordPress enthusiast who has been blogging since 2010. She loves to write useful WP tips & tricks on this active blog.

8 thoughts on “How To Serve Next-Gen Format Images For WordPress?”

  1. Thanks for the the tips, but my fear is the possibility of these tools to break down my social media from sharing my post feature images which had happened to me before…. I didn’t know what happened, I only discovered my post wont show image when I shared…. I was disturbed for almost 2 months until an expert found that EWWW IMAGE OPTIMIZER was responsible. It corrupted my image and blocked them from serving on social media.

    I got mad and since then I have been scared of image optimizers.

    So what advice can you give me pls?

    Reply
  2. You are offering suggestion on right topic. Image optimization is essential for website loading speed. and website speed is one of the crucial aspect fo a site and its growth.

    Thanks blogger

    Reply
  3. seo tools are very good but no one gives for free like tutorials , pdf and other information related data. but article is very useful.

    Reply
  4. My website has speed 60
    and i see some sites speed 27 but there is in first page in google
    thanks for article and I will hear the advice

    Reply
    • Hi Silvana rocket, It is because of the fast hosting service provider. Though you can score 100/100 in any web-speed testing tool, hosting can detail all your traffic. SO it is always recommended to have a reliable host with a proven track record.

      Reply
  5. Hello Nirmala,
    This is one such topic that I was never ever so comfortable. Your article has given me wonderful insight into the image size. Hope I will be able to implement in my current website.

    Reply

Leave a Comment