Understanding Web Graphics Formats

[ LiB ]

Up to this point, you've been saving all your images in the standard Paint Shop Pro format, which applies a .psp extension to files. Unfortunately , the Web doesn't support the PSP format. The two most widely used graphics formats supported by today's Web browsers are Graphics Interchange Format (GIF) and Joint Photographic Experts Group (JPEG).

NOTE

The new kid on the Internet graphics block is Portable Network Graphics (PNG) format. Paint Shop Pro can save images as PNG formats, but, unfortunately, many older Web browsers don't support that format.

Always save your image in the standard Paint Shop Pro format before you begin saving it as other formats. If you've saved the only copy of your new background or logo as a GIF image and then decide you want to save it as a JPEG (or vice versa), you'll lose quite a bit of valuable graphics data should you ever need to edit the image.

Saving Images in Paint Shop Pro Format

Saving an image in Paint Shop Pro format retains support for layers , selections, and other features that the other formats don't support. Image compression does not occur when you're saving an image in Paint Shop Pro format.

Saving Images as Compressed JPEG

You can compress JPEG images into smaller file sizes, which translates to faster loading time for the Web surfer. Although JPEG images can support high file colors and frequently produce better quality in an image such as a photograph, JPEGs do not support transparent areas and are not the best format to use for line art, cartoons, or other high-contrast images.

NOTE

Although you can just save your file as a JPEG without using optimization, an uncompressed file size might be too large to work well on a Web page.

JPEG Compression

When you're saving images as JPEG, you must determine a compression factor between 1 and 99. The larger the factor, the more compression, which results in smaller file size but lower quality.

View the before and after compression images along with uncompressed and compressed file sizes.

JPEG Format

Next, you need to select a format option for use when displaying the image.

JPEG Download Times

View the approximate download times for your image by using your current settings and various modem speeds.

Saving Images as Transparent GIF

Save any image with transparent areas in it as an optimized GIF format. GIF images also work well with cartoons, drawings, and images with high contrast and similar colors; however, GIF only supports up to 256 colors, so it's not the best choice for high- color photographs.

NOTE

Although you can save your file as a GIF without optimization, an uncompressed file size might be too large to work well on a Web page.

GIF Transparency

The first screen of the GIF Optimizer dialog box relates to how you want Paint Shop Pro to handle transparency.

NOTE

Click on the color box to select a color to block. In the example shown, Paint Shop Pro blocks out all white areas in the image.

NOTE

The higher the tolerance, the wider the range of color matching. For example, at a low tolerance of the color red, images that contain light red might not be included, however, if the tolerance were increased to say, 150, not only would light red be included, but perhaps pink or magenta as well.

GIF Format

Next, you need to select a format option for use when displaying the image.

GIF Download Times

View the approximate download times for your image by using your current settings and various modem speeds.

Saving Images as PNG

The newer PNG format is the best of both GIF and JPEG worlds , but remember that most Web browsers in use today don't yet fully support PNG format. Additionally, PNG files tend to be slightly larger than JPEG or GIF files.

NOTE

Although you can save your file as a PNG without using optimization, an uncompressed file size might be too large to work well on a Web page.

PNG Colors

The PNG format works similarly to a combination GIF and JPEG. The PNG format supports higher-color image types plus transparency.

PNG Transparency

The transparency screen of the PNG Optimizer dialog box relates to how you want Paint Shop Pro to handle transparency.

PNG Format

Next, you need to select a format option for use when displaying the image. PNG format options are identical to GIF options.

PNG Download Times

View the approximate download times for your image by using your current settings and various modem speeds.

[ LiB ]