Hello Friends
I have a large background image in a site.
I wanted to know if .JPEG or .GIF is the best.
You should decide based on the type of image.
Jpgs are lossy. They lose information every time they are saved, but this helps make them smaller while representing complex images such as photographs.
If your image is photographic, choose a jpg to get the best-looking image at the smallest size.
Gifs, I’ll trade for indexed PNGs. PNG has a better compression algorithm than gif. Like gifs, png’s are lossless. They remember every bit of information in the image. Like jpg’s, png’s can have a bazillion colours (I think it’s 16 billion).
Unlike either, png can do alpha transparency (though IE6 can’t deal with it without help).
So any work that a gif would be considered for (logos, images with few colours), a png (with indexed colours to reduce filesize) should do that job.
Both types are widely supported. The two things you need to consider are quality and weight. You want it to look as good as it can (better qualty, more weight) and weigh as little as possible (less weight, less quality).
As Stomme poes mentioned, pngs are probably your better choice, but through trial and error you should be able to find the best of both, quality and weight.
You could always create the image in each of GIF, JPG, and PNG formats and see which one gives you the nicer looking image at the smallest size. Usually it will be the PNG format (since that’s the only one of the three specifically designed for web use) but sometimes you may find that your image is smaller in one of the other two formats.
For images where you want to discourage theft you may want to consider using JPG images with a watermark since every time a JPG image is edited the image quality is reduced and so anyone editing it to remove the watermark will end up with a far poorer quality image than your original.
For images where you want to include animation a GIF is the only alternative.
Stephen, what ever happened to animated PNGs?
Anoia, the Goddess of Usability and Accessibility, descended from the Heavens and smote them all with thunderbolts.
I had never seen anything before now to suggest that such a thing existed. Obviously I was mistaken. Which browsers support animated PNGs? Unless they all do that would be a good reason to not use them.
Tommy has of course already provided a better reason for avoiding them.
As I understood it, they weren’t pngs but apngs.
I’ve seen them in a site or two, where I was informed by my browser that I need to download a plugin : )
Firefox (Windows) is happy with native APNG http://en.wikipedia.org/wiki/APNG I was going to mention it yesterday and that nearly always I’d use PNG-8 over GIF - for static images. But I though Stephen just meant GIF in the “de facto” sense and that other animated image formats were not widely supported just to keep things simplified - apparently he didn’t. Anyway Tommy struck.
Since APNG is not widely supported natively it isn’t a practical format to use. That explains why I hadn’t come across it before. Doesn’t change what I originally said about GIF being the format to use for animated images.
You mean this guy? Although he’s not female…
Stephen, wasn’t suggesting APNGs as a viable alternative, just wondering what happened to the concept. These guys are still fighting the good fight.
You mean this guy? Although he’s not female…
Yeah, she’s female, male artists just tend to get it wrong : )
Goddess of Things That Get Stuck in Drawers, [Tommy] was talking about and he doesn’t believe in either.
Quite right. Although she used to be a volcano goddess. 
[ot]
Since PNG use a lossless compression algorithm, it can’t generally be more efficient than lossy compression algorithm. As per the pigeonhole principle, a lossless image compression algorithm must always make some images larger than the original images, if it is to be able to make other images smaller than the originals. It is true that PNG image will usually give a smaller file size than a JPG image at 100 percent quality, but I haven’t met anyone who would set the JPG quality to 100 percent.[/ot]
It depends on how much information you are prepared to lose from your JPG. Even with no compression you still lose quality at every edit. As you say, a PNG is going to be smaller than a JPG without compression applied and so it all depends on whether you are prepared to compress the JPG far enough to make it smaller than the PNG.It will be very dependent on how much of the image consists of areas that are mostly the same or similar colours.
The other factor not mentioned before is that if you need any transparency in the image at all then you can’t use a JPG.
There is also the matter of whether or not you apply any compression to the PNG image.
As you say, a PNG is going to be smaller than a JPG without compression applied and so it all depends on whether you are prepared to compress the JPG far enough to make it smaller than the PNG.
Whoa, what program do YOU guys use? My plain (non-indexed) PNGs at full editor compression are always larger than jpgs, if the image is photographic (something complex like autumn leaves).
The other factor not mentioned before is that if you need any transparency in the image at all then you can’t use a JPG.
I mentioned it in the first post.
There is also the matter of whether or not you apply any compression to the PNG image.
Good point, web comic artists have been using something called PNGcrush, though I don’t have any personal experience with it.
There’s also an online (yahoo?) png optimiser/compressor where you can upload your file and get back an optimised file (where they simply remove any extra bits and bytes that aren’t directly contributing to the image quality).
Personally with PNG for web I’d use PNGOUT (DEFLATE optimization) rather than PNGcrush (Filter optimization) but they are similar. The problem historically with a lot of Image Editors is they are poor at saving and compressing PNG correctly (leading to bloated PNG files). So that’s why Optimisers are used plus PNG Optimisers usually have have finer control over the file data.
That is my experience as well, at 80 percent quality, which it entirely sufficient for most photographs.