How to Optimize your images for the web

Skill Level: Beginner / Views: 328

Here is a tutorial that will show you how to Optimize your images for the web and galleries. The idea here is to make your images as small in Kb as you can without loosing detail.

Spike on 5:32PM Wed, 22 January 2003

Getting started

I am using ImageReady in this tutorial, but you can use any image editing program.

The main reason for this tutorial is to show you how to keep your images small.

I will use the image above as a example:

I just want to show the user the image and not anything else.

Not only is this image 97k in size, but is shows the user info that they don't need to see.

Tutorial Comments

Valerie-Ducom  6:19PM Mon, 11 June 2007

Thanks for this very useful tutorial !

bluetone  8:38PM Fri, 02 May 2003

I have also found ImageReady helpful, though I use it within PhotoShop directly. For those that don't know, when you chose "Save for web..." in PhotoShop, it temporarily starts ImageReady to do the optimization, and then does a "Save as..." as you exit. One word about the tut that may have been helpful for those just starting out would have been to include some images of what is badly optimized, as well as what worked for this image. What to look for, like fringing around the edges at high contrast points, bluring of text, 'haloing' and the like. Just my 2 cents. :>

RaysOfLight  9:55PM Mon, 31 March 2003

hey, that was a pretty nice tutorial. sometimes i do my optimising in photoshop, adjusting the jpg quality there, but a lot of the times, i take the *.bmp render, modify it if it needs any post-work, i save it in bmp format again, and then use ACDSee or Conversion Plus to convert it into jpg format. ACDSee lets you adjust the quality as well, and it loads up in a blink of an eye, so it's really handy :)