Optimize Images: Tools & Tips to increase your pagespeed
If you look at your audits, the Performance category is one of the most influential ones to increase your pagespeed. Load times heavily depend on download sizes of resources like images and videos. High resolution images with heavy file size can cause performance issues. This problem is addressed by the Optimize Images audit within our report.
Table of contents
- Why is it important to optimize images?
- Which images should I optimize?
- Compress images - Online Tools & Software
- Are there other options to optimize images?
- Further information
Why is it important to optimize images?
Images are an essential part of the modern web. They make websites attractive, entertaining and informative. But despite climbing download speeds on desktop and mobile, a user's connection can be far from optimal. Think about consumers living outside the big cities or trying to open your page while commuting.
It is therefore important to optimize your images and use as less bandwidth as possible to load them on your site. The last thing your users want is to download a 3 megabyte GIF while having poor reception. These tools and Tips will help you optimize your images to pass the Optimize Images audit.
Which images should I optimize?
Speedrank analyzes all images on your site and compresses them to compare file sizes. If an optimization can save you more than 4 kilobytes, we consider an image as an opportunity to increase your pagespeed. This might sound like nothing but in reality the potential file size you're saving is much higher.
Our audit not only tells you that an image could be optimized. It also shows you which images can be compressed to increase load times. Take a look at our Performance category and scroll down until you see the full report. There you'll find a box called Efficiently encode images that'll expand on a single click. The now appearing list not only shows you optimizable images but their filenames, size and potential as well.
Our Speedrank Lighthouse Audit shows optimizable images under the performance category.
Compress images - Online Tools & Software
There are two ways to compress images and optimize them for the web. First, you can use online compression tools or a WordPress Plugin and optimize them file by file. Second, you can download software for Windows 10, macOS or Linux without uploading files at all. Here are some of our favorite free tools to compress images.
Compress images online
Compressor.io shows a side-by-side comparison of optimized images. Here we were able to reduce the images file size by 74 %.
Compress images on Windows 10, macOS & Linux
There are plenty of tools that can be run via the terminal. If you want to use OptiPNG for example, you can install the tool and compress images via these commands:
$ sudo apt-get install optipng $ optipng filename.png
Are there other options to optimize images?
Besides compressing images you can also fiddle around with their resolution. Evaluate if your users really need high resolution images or if smaller thumbnails fit their needs as well. It is also worth diving into next generation formats like WebP and JPEG 2000. Logos and brand icons are best saved as SVG vector graphics. But be aware that not every browser version supports next gen formats. You'll need fallback images for these cases.