Online Book Reader

Home Category

HTML, XHTML and CSS All-In-One for Dummies - Andy Harris [49]

By Root 1596 0
Most drawings you make in a drawing program convert very well to the GIF format. Photos aren’t ideal because they usually have more than 256 colors in them, and the subtle changes in color mean there are very few solid blotches of color to take advantage of run-length encoding.

GIF does have a couple of great advantages that keep it popular. First, a GIF image can have a transparent color defined. Typically, you’ll choose some awful color not found in nature (kind of like choosing bridesmaid dresses) to be the transparent color. Then, when the GIF encounters a pixel that color, it displays whatever is underneath instead. This is a crude but effective form of transparency. Figure 6-6 shows an image with transparency.

Whenever you see an image on a Web page that doesn’t appear to be rectangular, there’s a good chance the image is a GIF. The image is still a rectangle, but it has transparency to make it look more organic. Typically, whatever color you set as the background color when you save a GIF becomes the transparent color.

Creating a complex transparent background, like the statue, requires a more complex tool than IrfanView. I used Gimp, but any high-end graphics tool can do the job. IrfanView is more suited to operations that work on the entire image.

Figure 6-6: This statue is a GIF with transparency.

Coming soon — vector formats

Here’s another form of image format that I hope will gain more prominence. All the formats described so far are raster-based image formats. This type of image stores an image as a series of dots. Vector-based image formats use formulas to store the instructions to draw an image. Certain kinds of images (especially charts and basic line art) can be far more efficient when stored as vector formats. Unfortunately, IE and Firefox support different and incompatible vector formats, so it doesn’t look like vector-based images will be a factor soon. Flash also uses vector-based techniques, but this technique requires expensive proprietary software to create vector images and a third-party plugin to use them.

The most promising new technology is the tag in HTML 5. This tag allows programmers to draw directly on a portion of the screen using JavaScript code. If it becomes a standard, the tag will unleash many new possibilities for Web-based graphics.

Another interesting feature of GIF is the ability to create animations. Animated GIFs are a series of images stored in the same file. You can embed information, determining the interval between images. You can create animated GIFs with Gimp, which is included on this book’s CD-ROM.

Animated GIFs were overused in the early days of the Web, and many now consider them the mark of an amateur. Nobody really thinks that animated mailbox is cute anymore.

For a while, there were some legal encumbrances regarding a part of the GIF scheme. The owners of this algorithm tried to impose a license fee. This was passed on to people using commercial software but became a big problem for free software creators.

Fortunately, it appears that the legal complications have been resolved for now. Still, you’ll see a lot of open-software advocates avoiding the GIF algorithm altogether because of this problem.


PNG

Open-source software advocates created a new image format that combines some of the best features of both JPG and GIF, with no legal problems. The resulting format is Portable Network Graphics, or PNG. This format has a number of interesting features, such as

♦ Lossless compression: Like GIF, PNG stores data without losing any information.

♦ Dynamic color palette: PNG supports as many colors as you want. You aren’t limited to 256 colors as you are with GIF.

♦ No software patents: The underlying technology of PNG is completely open source, with no worries about whether somebody will try to enforce a copyright down the road.

♦ True alpha transparency: The PNG format has a more sophisticated form of transparency than GIF. Each pixel can be stored with an alpha value. Alpha refers to the amount of transparency. The alpha

Return Main Page Previous Page Next Page

®Online Book Reader