How optimizing Images effects your Site Load time
Webmasters do a lot to make sure their site load fast, and it is ought to be done thing. Leave alone messy things such as combining the CSS and JS files, Minifying resources ; optimization can be started with things as small as optimizing images. Images are one among the several key elements of a blog. Not only it makes your article looks great, but also a human eye catches them first if compared to text. By using images in your article, you can explain your subject better, and also it is a plus point for your SEO. Bots and crawlers check for alt tags in the images. In the article I’ll discuss how images can be optimized and how they effect your site load time.
A Speed driven answer
To make my point crystal clear i.e optimizing images effect your site load time I did a small experiment. The experiment conducted was as follows : I created three pages, titled as follows ( Speed test Page 1 , Speed test page 2 , and Speed test page 3 ) and used same image with different properties on these three pages. Images used on the pages were as follows :
Speed test page 1 : Images without custom size , non-optimized
Speed test page 2 : Images with custom size , non-optimized
Speed test page 3 : Images with pre-defined size , optimized
Loading time of the pages were as follows :
No doubt, page 3 was the fastest to load. Now you’ve understood that optimizing images is very important for site load time. You can optimize images in three main ways, all of them Being mentioned below. Optimizing an image isn’t rocket science, it can be done quite easily.
Defining Image size :
This is the first thing to be considered in the list of image optimization. If you use any image in your blog post you should specify its dimensions ( not by html tag ). If you wish to use an image with dimensions 324 X 250 in your blog post then reduce it to this dimension with a photo editor you use, before inserting it in the blog post. I was ignoring this tip in the initial stage of blogging. Usually I uploaded an image of random dimension and then reduced it to required size by html. It might not sound much effective, but it is. If you don’t specify the image size, then browser has to do quite a job, which consumes the blog load time. You can clearly notice this in speed test page 1 ( Images without custom size ) . If you specify the dimensions before uploading then it would surely make your life easier.
Reducing the Quality
Image quality directly affects your site load time. Blog/site with HQ images is more likely to load slower than one which has low quality image. Because the more quality is the image, the more would be its size and vice versa. You can reduce image quality via reduceimages.com ( Online Free service ) or with offline photo editors such as photoshop , gimp , photoscape etc. Make sure you don’t reduce the quality to such an extent that it becomes unclear.
Plugins Which make life easier
If you use WordPress, there are several plugins which can make your life easier. If you search in the plugins directory there are several lazy load, Auto and bulk image optimize plugins. The best of lazy load plugins are Lazy load and Bz lazy load and For auto image and bulk image optimization you can use EWWW image optimizer or Smush.it . You can also you smush it online at smushit.com It is a free service from yahoo.
Final words : I hope this article would have helped you, if you have any problems, suggestions regarding the article comment them below. If you liked reading the article share it on social networking sites to help us.