How do I optimize images for WordPress sites?

تحسين الصور

Photos are an important part of most sites. But unfortunately, images can also increase the size of your page and significantly slow down loading times if you don’t optimize the images properly for your WordPress site.

This is frustrating for visitors and can reduce the ranking of your page using search engines such as Google. If the page does not load in less than 3 seconds, most visitors will leave your site and move to another place.

Also, the presence of a lot of images will significantly consume more space on the server for your site.

This is unlikely to be a problem in the early days of your website’s life; however, this can lead to increased hosting costs over time unless you are hosting with a company that does not charge for disk space.

The simple solution: optimize your photos. Photo optimization is just a great way to say that you should save your photos in a web-friendly format.

Image optimization is critical to making sure your site is performing at its best.

In this article, we’ll show you how you can optimize images on your WordPress site to help your visitors have a hassle-free experience and make sure your site isn’t penalized by search engines for slow loading times.

JPEG or PNG file format-image optimization for WordPress

Graphic applications allow you to save photos in many different file formats. The best site formats are JPEG and PNG.

Use JPEG for photographs due to the high number of their colors. This format uses special compression to reduce the file size while not affecting the clarity of the image.

Use PNGs for images such as screenshots, illustrations, and website design images such as icons and buttons.

It uses lossless compression technology to maintain a high-quality image. Stay away from using PNGs for images as it will result in a huge file size.

تحسين الصور

Another format that you will see used a lot is GIF. GIFs are well suited for less high-quality photos with only a few colors.

The GIF format is widely used on the internet for small and simple cartoons.

Select the size of your photos correctly before uploading

Before we get to the optimization process, be sure to resize your photos before uploading them. With the spread of digital cameras and smartphones, image sizes have become quite huge today.

Example: iPhone 11 takes a photo with a resolution of 12 megapixels, that is, approximately 4000 pixels × 3000 Pixels. Most desktop monitors are about 1,680 pixels × 1,050 pixels in size (yes, there are larger ones).

The best practices for website design use an optimal width of about 1400 pixels. So if you upload photos with a width of 4000 pixels, you already start with an image that is almost 300% of what you need.

optimize images

You can allow WordPress to do this as described below or use an app to do it in advance.

To simplify the matter, I resize almost all images to the largest size that the site needs. You can do this by measuring the width of your site.

In the example above , I would like to resize the images to 1400 pixels × 1050 pixels. Hundreds of websites have been optimized by resizing images only and this has resulted in an average size reduction of 400%.

This is an essential step to improve your WordPress site.

JPEG or PNG what is the best ?

There are two schools of thought regarding when you should optimize your photos – before uploading them to WordPress or after. While there may be some circumstances when one is better than the other, in general, both are a good option.

You can even choose a mixed method if you already have several photos on your site to improve, and then switch to the “before” method for all new photos.

To optimize photos before uploading them, you will need Adobe Photoshop or similar (as described below.) If you plan to do all the optimizations after loading, some great plugins will do it for you.

Optimize your photos before uploading them to your website ?

WordPress has a stylish thumbnail feature that automatically creates three different sizes for any image you upload.

You can find this feature in the WordPress management area under Settings / media. Keep in mind that this does not improve the image; it only changes the pixel dimensions.

You can adjust the thumbnail sizes as you see fit. For example, you can set up WordPress to create a thumbnail image with a size of 150 × 150 pixels, a medium image with a size of 300 × 200 pixels, and a large image with a size of 600 × 600 pixels.

Most graphic editing applications allow you to adjust the image quality for use on the web. In Photoshop, the option is called”Save for web and devices”.

Photoshop allows you to choose the file type and quality. At the bottom left side of the interface, you can see the details of the image file size with the settings you have chosen.

There are many great graphic editing apps available to enhance WordPress images .

GIMP is a good start. I also recommend reviewing these :

ImageOptim (MAC) : very easy to use and allows you to optimize a large number of photos at once, including renaming the collection.
Image Compressor (works on any operating system) .

optimize images

All of the above is free to download and use. While there are many premium apps available for a fee, I don’t see any real advantages to using them over these free alternatives.


Read Also: Top 7 WordPress image compression plugins compared (2022)


Optimize your photos after uploading them to your website

There are a lot of plugins available that improve images in WordPress after uploading them to your site.

With more than two million downloads, Yahoo’s WP is Smush.it one of the most popular plugins for optimization in WordPress.

This extension allows you to strip metadata from JPEG files, optimize compression, convert GIF files to PNG and remove unused images.

It is also compatible with many of the most popular extensions of the media library , such as :

Alternatives include Smush.it the following :

Final thoughts on improving photos or optimize images :

To repeat the obvious, optimizing your WordPress images is very important.

Optimizing your photos can reduce your site’s page load times – which improves visitors ‘ browsing experience and, in the process, helps improve your page rankings using Google and other search engines.

 

Previous post
The 49 best WordPress e-store templates (Part I)
Next post
What is the best WordPress gallery plugins? ( Performance comparison )

Leave a Reply