Best Image Format For Web Pages?

Hey,

I am making a new site ith a lot of images in it and I was wondering which file type I should rely be using?

I am using a fair few photographs in the design so I don't wanna lose the quality if it is possible.

What are your suggestions?

 

I suggest .PNG.

 

i usually go with gifs for normal stuff and jpeg for photos.

 

Here's something I found:

 

I would prefer JPEG file format

 

use jpeg for photos and gif for GUI images
and use png only where transparent background is needed...as loading time for pngs is high

 

Do you not get a problem when viewing transparent png's in older browsers like IE6?

I would go for small images in jpeg format that once clicked will load a higher res pic. That way the visitor has chose to wait to see the image better, rather than being forced to wait.

 

Hi-Res Jpg are the best solution

 

png, gif, if you gonna optimize loading time

 

All three formats have their uses:

GIF: Small file size, but 256 colour restriction is a little annoying
JPEG: Can be good for photos, as they show lots of colour, but they can be a little distorted with compression
PNG: Crisp and clear, although filesize can be large for bigger images

 

A well optimized png has a smaller size than a high quality jpeg optimized similarly. Stick to png if you aren't using any transparency, IE will show it a bit darker because it retardedly uses the gamma correction that comes with pngs, if you really want that fixed just visit:

http://www.biorust.com/tutorials/detail/231/en/

 

I do all graphics in GIF and photos in JPG

 

JPEG for non-transparents images and PNG for transparent ones.

 

png for your site logo and quality graphics
Jpg for Photos
Gif for backgrounds , box corners etc..

 

It depends...

First, I recommend you to use images only when neccessary - you'd be surprised how many effects can be done by CSS alone. Always compress your images so they are as small as possible (GIF is best for that - quality is bit low but usually the difference is almost unnoticable). Use PNG only when you need transparency effect for something.

When you want to show many photos on your website (like some gallery) - you will need two versions of each picture:
- one low quality small image (thumbnail)
- high quality big image (this one will be showed when users click on a smaller thumbnail)

 

I only use PNGs. But then, I'm still learning this stuff.