One of the biggest factors to a slow page load is unoptimized image sizes. The bigger the image, the more time it takes the browser to load it.
This tutorial will show you the two free tools that I use to optimize images quickly.
These services will be useful whether you use WordPress, Drupal, Joomla or any other platform.
When you access a URL, it sends your request to the host server. The server then sends over the requested information.
Three main factors determine the total speed of the page load:
- Your speed: internet connection, hardware, and software speed all contribute to this
- The host speed: internet connection, hardware, and software speed all contribute to this
- The total size of the information being transferred
Image optimization focuses on the 3rd part, the information size. The smaller the images, the less that's needed to be transferred. But, you don't want the images too small so that they are blurry or users can't see them. Finding the right balance is best.
The faster the site, the more users like it. Also, it will rank better in Google and other search engines.
Crop and scale down: WebResizer.com
Keep your images as big as you need them, and no more.
New developers make the mistake of using HTML to resize the image after it's loaded. But, that slows down the page load. The browser still downloads the big image.
If your image will only be displayed to 175px by 175px, you don't need it as 2000px by 2000px. Scale the image down to the size you need it.
I use WebResizer to crop and scale down my images. It's free, easy to use, and effective.
Optimize the weight: ImageRecycle.com
Once you're done cropping and scaling in WebResizer, upload the finished image to ImageRecycle.com. It will reduce the size even more, about 50-80% more. And it's free!
Voila! You now have an extremely optimized image, perhaps with a 90%+ reduced size from the original.
A Note of Caution
These two services are web services. So the images are uploaded to 3rd party websites. As a result, I only recommend this approach for public images.
For images that contain sensitive information (ex: contractual information), use secure personal software. Focus on software that only allows you to have access to the images.
For example, GIMP would be a good option. It stores the files on your computer and doesn't share it with others (even its developers).