• Choose a category
• All
• Classic-Fiction

With all its advantages, you might expect PNG to be the most popular image format on the Web. Surprisingly, it’s been slow to catch on. The main reason for this is spotty support for PNG in Internet Explorer (IE). Most versions of IE don’t support PNG’s alpha transparency correctly.

Summary of Web image formats

All these formats may seem overwhelming, but choosing an image format is easy because each format has its own advantages and disadvantages:

♦ GIF is best when you need transparency or animation. Avoid using GIF on photos, as you won’t get optimal compression, and you’ll lose color data.

♦ JPG is most useful for photographic images, which are best suited for the JPG compression technique. However, keep in mind that JPG isn’t suitable for images that require transparency. Text in JPG images tends to become difficult to read because of the lossy compression technique.

♦ PNG is useful in most situations, but be aware that IE (especially version 6) doesn’t handle PNG transparency correctly. (You sometimes see strange color blotches where you expect transparency.)

♦ BMP and other formats should be avoided entirely. Although you can make other formats work in certain circumstances, there’s no good reason to use any other image formats most of the time.

Manipulating Your Images

All this talk of compression algorithms and resizing images may be dandy, but how do you do it?

Fortunately, IrfanView can do nearly anything you need for free. IrfanView has nice features for all the main types of image manipulation you need.

Changing formats in IrfanView

Changing image formats with IrfanView is really easy. For example, find an image file on your computer and follow these steps:

1. Load the image into IrfanView by dragging the image into IrfanView or using the File⇒Open menu command.

2. Make any changes you may want to the image before saving.

3. Use the File⇒Save As command to save the file.

4. Pick the image format from the Save Picture As dialog box, as shown in Figure 6-7.

5. Save the file with a new filename.

Keep the original file and save any changes in a new file. That way, you don’t overwrite the original file. This is especially important if you’re converting to JPG because each successive save of a JPG causes some image loss.

Figure 6-7: IrfanView can save in all these formats.

Don’t use spaces in your filenames. Your files may move to other computers on the Internet, and some computers have trouble with spaces. It’s best to avoid spaces and punctuation (except the underscore character) on any files that will be used on the Internet. Also, be very careful about capitalization. It’s likely that your image will end up on a Linux server someday, and the capitalization makes a big difference there.

Resizing your images

All the other image-manipulation tricks may be optional, but you should really resize your images. Although high-speed modems may have no trouble with a huge image, nothing makes a Web page inaccessible to dialup users faster than bloated image sizes.

To resize an image with IrfanView, perform the following steps:

1. Load the image into IrfanView.

You can do this by dragging the image onto the IrfanView icon, dragging into an open instance of IrfanView, or using the menus within IrfanView.

2. From the Image menu, choose Resize/Resample.

You can also use Ctrl+R for this step. Figure 6-8 shows the resulting dialog box.

Figure 6-8: IrfanView’s Resize/Resample Image dialog box.

3. Determine the new image size.

A number of standard image sizes are available. 800 x 600 pixels will create a large image in most browsers. If you want the image smaller, you need to enter a size in the text boxes. Images embedded in Web pages are often 320 pixels wide by 240 pixels tall. That’s a very good starting point. Anything smaller will be hard to see, and anything larger might take up too much screen space.

4. Preserve the aspect ratio using the provided check box.

This makes sure the ratio between