Lately, I have been talking a lot about optimizing your website’s loading time. The main reason behind that is that Google and other search engines like websites that load fast, even the customer or the reader would like to visit a website that loads pretty quickly. Thus, it was essential to talk about optimizing your website loading time. After my last post on 5 tips to increase website loading time, one of the readers sent me an email asking me to describe a way to optimize images for his website without losing quality at all.
Then I decided to write this article to share with everyone, on how to optimize images on your blog or website to decrease the size of the page and have better loading time. Before we get started, let me tell you that no matter whatever way you choose, you will definitely lose some quality of the image, unless you are a real expert!
There are two ways that I would suggest you to use in order to optimize your images for your website. These ways are :
- Make your image the exact dimensions as required.
- Decrease the quality of the image by using an Advanced Image Optimizing software.
Reduce image to Exact Size
The first point, i.e. to make your image the exact dimensions as required is the one I started doing about a week back. Earlier, when I used to post screenshots, I would upload them as it is, but since last week, I started to crop them into the dimension that I actually display on my blog posts. This helped me decrease the webpage size and ultimately optimize the loading time. To do this, you can make use of any available Photo editing software, like Adobe Photoshop, Gimp, Coral Draw etc. All you have to do it, crop the image in the dimension that you want to display to your viewers.
Use an Image Optimizing Software
The other way, that I have been using for over a year now is to use an advanced image optimizing tool, which decrease the size of my images considerably. Sometimes, when I have the images already to post on a blog, like the exact dimensions, I can still decrease the size of the image by optimizing it by using the Light Image Resizer. I have compiled a step by step guide for using this application down below. Currently, the software is available for free, and there is a pro version as well. If you like the software, you can support the developer by purchasing the Pro version.
Optimizing Images using Light Image Resizer
First of all, download the application from the official website and install it. Then, run it. It would show you a pop-up window to make you buy the application, but after waiting for some time, you can continue using the application as a free user.
Next, click on Files or Folder, depending upon the number of files you want to compress. And then select the appropriate files.
After that click on Next, and then from the drop-down menu on the top, choose Original Resolution.
Then, make changes to the Quality value. Change it to 80%. Now just click on Process.
Wait for some time. Let the software do it’s job. When it’s done, it will show you a box like this, which will indicate the total space that it saved for you. In my case, it saved me 79% space. Though I did this tutorial at 80%, you can do it at 90% and still save a lot of space. Now if you compare all the original and the copy image, you will hardly feel any difference.
Well, that’s all. This was a simple tutorial on how you can optimize your images for using on your website. If you wish, you can combine the two methods and achieve even higher results for your website. Do share your experience with us in the comments section below. I hope this post helped you optimize your website loading time in a great way. Don’t forget to subscribe to Slash Coding for latest post updates via RSS Feeds, Facebook, Google+ or Twitter.
