How to minimize the size of an image?

I'm developing website for my domain TowerEiffel.com, have created a header for it and wonder how can I reduce the size of the image without the loss of quality. Also, I'm not sure if it shall be .jpg or .gif file. What's smaller?

This .jpg image (the header of my site - you'll find it here) has 48.68 kB. I'm sure the size can be reduced to at least a half, just don't know how. I saved this .jpg in Photoshop, image options - quality: 8 (high), 72 DPI. I also use IrfanView so I could convert the file to .gif as well.

I'd like to reduce the size of this image as much as possible (but without the loss of quality) in order to make my site load quickly and save some bandwidth as well.

Thanks in advance.

 

As a rule of thumb you have to remember that Jpg is for pictures and gif for text.
I opened your header.jpg and then I just saved it as jpg with Irfanview and now it's only 19k.
Try yourself. I haven't changed any option.

 

Thank you. However, now the text "TowerEiffel.com online guide" appears a little bit blurry. It's probably because of what you've said: that .jpg is for pictures and .gif for text. Could you advise me how to preserve the same quality of the text as well? Or, how shall I make it? Shall I separate the text and the picture into 2 images - the text into a .gif and the picture into a .jpg and make the .gif transparent?

 

I think you cant reduce the size of the file whitout losing quality, the best is a .gif with much colors, that might look good.

 

OK, I'll try to make it that way. Thank you Luuk.

 

Try File>Save for Web in Photoshop and play around with the settings as either jpg or gif.. It reduces the size greatly with minimal loss of quality

 

I don't see a lot of difference. I think you have to play a bit with jpg parameters, otherwise if you want to have maximum quality with minimum space/bandwidth used, you can remove the text from the image, save it as jpg with 80% and then write the text over it using css.

Remember then to test it with the 4+1 browser
IE,Firefox,Opera, Khtml/Safari . +1 is IE7.


Khtml/Safari is for Mac and some Linux users. Easy to test with a knoppix dvd if you don't have a mac or linux.

 

Saved for web, 60% .jpg quality and I achieved 24.0 KB with minimum loss of quality. You can already see the picture (the header) on my site.

 

Great job man! Your image is awesome. But maybe you can reduce the text a little bit or change the background color (but black and orange is great already!). My eyes kinda darted everywhere. If you have a lot of text, try not to use dark background and bright fonts. Eyes will hurt reading those tonnes of words.