Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I was checking my sites page load time. I saw that I could improve it by reducing the size of the images which were getting resized by css. Now I wanted to ask if resizing the images is worth the page load speed? As it takes quite good amount of time to do the resizing so is it strictly recommended for a good website? enter image description here Thanks in advance.

share|improve this question
add comment

3 Answers

up vote 6 down vote accepted

Yes, it is. Making users download useless extra image data just so the browser can resize the image to less than half the size is bad practice, and it's one of the warning signs of a poorly designed/developed website.

If you want to improve page performance why wouldn't you reduce unnecessary bandwidth usage? That's like asking, "If I want to get better mileage, should I patch the leak in my fuel tank?" Well, of course you should! A leaky gas tank is the exact opposite of what you want to get good gas mileage.

If you're making users download dozens of 800x600 images to view your page, is it really any surprise that the page performance is poor? And at the size the images are being displayed, almost 80% of the transferred data is just useless junk. You may as well have a page that has 10 visible images on it but loads 40 other images that are never seen by the user.

share|improve this answer
add comment

If the images are all the same size you can use imagemagick to do a batch convert. The other thing you need to do is look in analytics to see how many returning visitors you have, and if it's significant make sure you are setting the images to not expire using htaccess...

share|improve this answer
add comment

If you're concerned about speed, not only should you resize images but also consider creating CSS sprites to combine multiple background images into a single image using an online tool like SpriteMe or CSS Sprite Generator.

CSS sprites are a way to reduce the number of HTTP requests made for image resources referenced by your site.

share|improve this answer
    
Sprites are generally a good idea, but I think the optimal use case is lots of small icon-sized images. If you stitch together a bunch of medium-large images, the sprite map could get quite big, which would reduce the perceived performance even if the site page loads faster in reality. Instead, for larger images, I'd go with lazy loading to increase perceived performance. –  Lèse majesté Mar 24 '12 at 7:57
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.