1 / 15

Common Graphic File Formats

Common Graphic File Formats. Popular Graphic Formats. The following are popular graphic formats on the Web GIF (Graphic Interchange Format) JPEF (Joint Photographic Experts Group) PNG BMP format is also supported in several browsers, but it is not recommended for several reasons.

willis
Télécharger la présentation

Common Graphic File Formats

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Common Graphic File Formats

  2. Popular Graphic Formats • The following are popular graphic formats on the Web • GIF (Graphic Interchange Format) • JPEF (Joint Photographic Experts Group) • PNG • BMP format is also supported in several browsers, but it is not recommended for several reasons. • Not all browsers support bmp • Bmp files tend to be large Dr. K. Chen (c) 2012

  3. RGB • RGB (Red, Green and Blue) is a color model many computer monitors use to display colors • Color Depth refers to the number of colors from the RGB color space that a monitor can display at one time. Dr. K. Chen (c) 2012

  4. True Color, High Color, Indexed Color • True Color (24-bit / 32-bit) • 24 bits of information per pixel; 8 bits for each color channel • In 32-bit true color, an additional 8 bits are used for “alpha channel” (transparency) • High Color (15 or 16-bit) • 565 for RGB or 555 for RGB • Indexed Color • 8 bits are devoted to all colors in the picture. • Color palette or color map Dr. K. Chen (c) 2012

  5. Color Shifting and Dithering • When an 8-bit system (e.g., gif files) or application encounters a color that is not in its current palette, it does • Color shifting: the color is replaced by (or shifted to) the nearest available palette color, or • Color dithering: mixing pixels of similar colors available in the palette, resulting in a random dot pattern (See examples here) Dr. K. Chen (c) 2012

  6. Color Dithering See the above picture and explanation at the original web site. Dr. K. Chen (c) 2012

  7. Keep the Web Graphics Small • Limit dimensions • Design for the compression scheme • Reuse and recycle Dr. K. Chen (c) 2012

  8. Compression • Electronic pictures and images are compressed to save space. • Raw BMP format may not be compressed. • Two common compression methods • Lossless Compression • Data are compressed without losing any information/details. • GIF and PNG • Lossy Compression • Data are compressed by sacrificing some details • JPEG Dr. K. Chen (c) 2012

  9. GIF Format (1) • GIF files have the following characteristics • They are indexed with a max. of 8-bit color information • They use LZW compression, a lossless compression algorithm • They may be interlaced • They may contain transparent areas • They can do animation. Dr. K. Chen (c) 2012

  10. GIF Format (2) • Any image can be saved as a GIF, but this format is most appropriate for images with areas of flat, solid color, such as logos, icons, charts, etc. Dr. K. Chen (c) 2012

  11. JPEG (1) • JPEG files have the following characteristics • They are 24-bit color images. • They use JPEG’s lossy compression scheme. • They may be interlaced. • The quality of a JPEG is denoted by its Q setting/value that ranges from 0 to 100. (Lower value means lower image quality.) Dr. K. Chen (c) 2012

  12. JPEG (2) • Once image quality is lost, you can never get it back again. • Loss in image quality is “cumulative” (i.e., generational degradation). • JPEG images are good for any images with subtle gradations of color. JPEG is good on continuous tones of color. Dr. K. Chen (c) 2012

  13. PNG (1) • PNG files have the following characteristics • They can store 24- or 48-bit color, 16-bit grayscale or 8-bit indexed color images. • They use lossless compression. • They offer 8- or 16-bit alpha channel transparency information. • They may be interlaced. • They may contain gamma adjustment. • Embedded text is possible. Dr. K. Chen (c) 2012

  14. PNG (2) • See Table 31.1 on p. 559 for features of PNG supported in browsers. Dr. K. Chen (c) 2012

  15. Further Reading • Image file formats – Scantips • Graphics– Web Style Guide • Image file formats – Wikimedia • GIF • PNG • JPEG Dr. K. Chen (c) 2012

More Related