How To Save Images Optimized For Web – Speed Up Your WordPress

Are you saving images incorrect? Most beginners do not know how to save images correctly which can have a vast impact on wordpress website speed. Today, we will display you how to correctly save images optimized for web.

Each blogging specialist will inform you that images assist boost engagement. But what they don’t inform you are that not optimizing images for web can slow down your website. According to Strangeloop, a one-second holdup can cost you 7% of sales, 11% fewer page views, & 16% reduce in customer pleasure.

1

How To Save Image Correctly?

When saving images, you require considering 2 things: image file format & compression. By selecting the right mixture, you can reduce your image size by 5x. For most of us, the only 2 image formats that issue are JPEG & PNG. To keep things easy, utilize JPEGs for pictures with a lot of color, & use PNGs for simpler images or when you require transparent photos.

For those who don’t know the diversity, PNG image format is uncompressed which means it is a superior quality photo. The downside is that file size is much bigger. Other side, JPEG is a compressed file format which slightly decreases image excellence in order to give a considerably smaller file size. On WPBeginner, majority of our pictures are JPEGs.

The next step is compression which means utilizing a tool to save pictures optimized for web. Compression can create an enormous difference. See the table below which highlights the few mixtures we could have utilized to save the Strangeloop image used in this article.

untitled

Picture Compression Tools for Bloggers

 

Now that you have seen the dissimilarity every compression kind makes, below is how you can correctly save images optimized for web & speed up your site.

Adobe Photoshop

Adobe Photoshop is best software that comes with a characteristic to save images optimized for web. Just open your image & click on the File > Save for Web & Devices button. This will open a save screen. On the right, you can set various image formats. For JPEG format, you will see dissimilar quality choices. When you choose your options, it will as well show you the file size on the bottom right.

2

Tiny PNG

TinyPNG is a free of charge web app that utilizes smart lossy compression method to decrease the size of your PNG files. All you have to do is go to their website & upload your pictures. They will compress the picture, and provide you the download link. For developers, they as well have an API to change images automatically.

 

JPEG Mini

JPEGmini utilizes recompression equipment which significantly decreases the size of photos without affecting their perceptual excellence. You can utilize their web version for free, or buy the program for your computer. They as well have a paid API to mechanize the procedure for your server.

 

Image optim

ImageOptim is a Mac usefulness that permits you to squeeze images without losing any excellence by searching the best compression parameters & deleting needless color profiles.

Windows alternative to this is Trimage.

As you can observe that there are some tools you can utilize to optimize pictures for web. When utilizing Photoshop compression, we saw the most excellent results in size but the quality was affected. TinyPNG was a clear winner for saving any kind of PNG on the web. Several recommend that you can use a mixture of TinyPNG or JPEG Mini & Image Optim for even improved results. But running 2 separate tools to upload pictures can boost your workload a bit.

 

Ultimate Thoughts on Image Optimization

If you are not saving pictures optimized for web, then begin doing so now. It can create a massive difference on your website speed, and your visitors will thank you for it. Sure the picture excellence might reduce a little, however most users won’t notice it. If you are looking for excellence images, then see our guide on how to discover royalty free images for your blog posts.

Last however surely not the least, utilizing a CDN to serve pictures for your WordPress website can significantly speed up your website. Check out this info graphic to see what a CDN is & use our guide on how to setup CDN for your website. We are using MaxCDN for our website.

We hope you found this article useful.

Do you have blogger buddies who are saving pictures wrong? Share this article with them, so they can speed up their website. They will thank you for it.

 

Leave a Reply

Your email address will not be published. Required fields are marked *