If we want our website to go fast, a good SEO strategy is to optimize the images through a good lossless compression. In this article, you will see different ways to reduce the unwanted weight of your photographs with wordpress plugins and manually.
Why optimize images in WordPress?
When we upload images to WordPress, the CMS creates copies of images of different sizes. All these images can take up a lot of space on your web server without you noticing. WordPress does that to show on the web page, the image with dimensions more appropriate to the space where it is going to be displayed and so do not load the web so much in loading.
But if you want, you can load the original image, and, if it is too heavy, it will slow down the loading of our
website and Google will understand that our page is slow, so it will lower the positioning of the page. Beware of this, keep in mind how large the original image is and if you select it to show on the web, keep in mind everything we are discussing in this article.
There are 3 main problems with images:
Weight
A very common point is to find images, which either by their format, quality or size, their weight is higher than optimal. In this case, the loading time is impaired by the increased page weight. To fix this, you’ll be able to change the format of the image. There are times when changing to an svg, webp or similar format greatly improves the weight of the image.
Size
Sometimes, images are uploaded without taking into account the size at which they will be displayed within the web. As a result, when a user loads that page the weight is higher and CSS code is loaded that adapts the size of the image automatically to the available space. You can solve it by uploading that image in the correct dimensions. Below, we’ll show you tools to help you fix this problem.
Number of images
The more images a page has, the more requests the server has to make to make it visible. Therefore, with the increase in requests, the loading time increases. A good solution is to use CDN so that the images are in an external hosting and since they have servers throughout the world, they will load faster.
Optimize images with wordpress plugins
The good thing about WordPress is that it has plugins that help improve the different functionalities of the tool, one of them is to optimize images. It is important that you also keep in mind that it is important that the images do not lose quality, despite the weight reduction.
Below you can see different plugins that will help you improve the weight of your photographs and so your website loads faster.
EWWW Image Optimizer
It is a free plugin very easy to use. You can choose the type of compression you want for each type of image (JPG, PNG or GIF). Do not go over with the reduction that the photos end up looking pixelated, it happened to me.
Smush – Lazy Load Images, Optimize & Compress Images
This plugin compresses and optimizes images with lazy loading, WebP conversion, and resizing detection to make your site load fast. The free version is more limited. You can see everything he does below in the following video:
ShortPixel Image Optimizer – Optimizes images, converts WebP & AVIF
Optimize images & PDFs intelligently. It also creates and compresses next-generation WebP and AVIF formats. And you can also crop images and resize them. Like the previous case, you can watch a video of how it works.
Imagify
It is one of my favorite plugins to optimize and reduce the weight of images. You have the option to convert your images into webp format automatically. And yes, you also have a video for you to see how it works before installing and testing it.
reSmush.it
It already has its trajectory of years and there it continues to give war. Optimize images smaller than 5MB, that’s enough.
TinyPNG
Another proposal for you to choose the most successful for you. This plugin automatically optimizes all your images by integrating with image compression services.
The goal of using these plugins is to achieve better performance by showing the same photographs, the only difference is optimization. Did you like these plugins to compress images in wordpress?
Other ways to optimize speed without plugins
There are online tools and programs with which you can optimize your images before uploading them to wordpress. You will save the consumption of resources.
Affinity Photo, Photoshop, Gimp or similar
They are photo retouching programs but that you can use perfectly to reduce the size and weight of your photograph. Gimp is open source, so you can download it for free. Affinity Photo is paid but at a reduced price and Photoshop is part of Adobe and you can buy a monthly license.
Online tools
If you want something fast a web page where you only have to upload the photo and is optimized automatically. You just have to download it again updated. Some of these pages are:
Other wordpress plugins to improve image loading
The images on a web page can be loaded deferred, that is, as you browse the web. Some plugins that will help you are:
A3 Lazy Load
It is a plugin that will make your images load at the visitor’s pace, so they will save you bandwidth and the performance of the website will be better.
LazyLoad Plugin – Lazy Load Images, Videos, and Iframes
It is yet another lazy loading option developed by WP Rocket.
Some caching plugins like WP Rocket already include it, try not to duplicate functionalities in your WordPress.
Mejores Prácticas para Optimizar Imágenes para la Web
Here are some general best practices when it comes to how to optimize images for the web:
- If you use a wordpress plugin, use one that compresses and optimizes images externally on their servers. This reduces the load on your own site.
- Use vector images, whenever possible, along with PNGs and JPGs.
- Use a CDN to serve your images quickly to visitors around the world.
- Delete unnecessary image data.
- Crop the white space and use CSS to add that padding, for example with the padding or margin tag.
- Use CSS3 effects as much as possible.
- Save the images in the appropriate dimensions.
- Use web fonts instead of placing text inside images – they look better when scaled and take up less space.
- Use lossy compression when possible.
- Experiment to find the best settings for each format.
- Use GIFs only if you need to use GIF animation.
- Use PNG if you need the high level of detail and high resolution.
- Remove any unnecessary image metadata.
- Automate the process as much as possible.
- Use lazy load to speed up page processing.
- Save the images as optimized for web with tools like Photoshop or similar and if not remember the online tools discussed above.
- Use WebP whenever possible to serve on smaller images.
- The SVG format usually works very well with icons.
Benefits of using plugins to reduce image weight
While optimizing images won’t magically load your website in milliseconds (as there are many other factors that influence loading speed), using plugins to reduce images is one of those things that will:
- Your pages load faster. Smaller image sizes translate into faster page loads. This will please users and recommend or return to your page, which can increase advertising revenue.
- Backups are faster. As the images are smaller, the backups will take less time to be made.
- They will use less bandwidth usage. Optimizing your images can save you hundreds of KB per image, which means significantly less bandwidth usage. Visitors with slow connections will thank you.
