7.3: Image formats

GIF: Graphic Interchange Format

GIF, 3 bits, 8 colors, 13K

GIF, 5 bits, 32 colors, 21K

GIF, 8 bits, 256 colors, 44K

PNG: Portable Network Graphics.

Trojan Warrior
Trojan Warrior
Trojan Warrior

LEFT: PNG, no transparency. MIDDLE: PNG, 100% transparency. RIGHT: PNG, 60% transparency.

JPEG: Joint Photographic Experts Group.

JPG Image Compression

The 24-bit color bitmap image would look huge if you had to describe every pixel with the three numbers that represent its the Red, Green and Blue. Compression reduces the file size through one of two methods:

JPEG, Low Quality, 24K

JPEG, Medium Quality, 28K

JPEG, High Quality, 70K

JPEG, Low Quality, 24K

JPEG, Medium Quality, 28K

JPEG, High Quality, 70K

Lossy compression

Lossless compression

Chapter 7 study questions

  • What differences must be considered when comparing graphics on a computer screen to graphics in print?
  • What is pixel depth? How does it relate to various file formats, such as GIF, JPG and PNG?
  • Define dithering. What might cause an image to dither on a web page today?
  • What is the pixel grid? What problems might arise from graphics with complex curves do not align to the screen’s pixel grid?
  • What are the drawbacks to using very large graphics on a web page?
  • What are web-safe colors? Are they still necessary today? Explain your answer.
  • What is the difference in mood when hot colors or cold colors are used?
  • How is color related to identity? Give a prominent example of color used as identity and discuss it.