1. 1 GFI Files Graphics Interchange Format

2. 2 GIF History  CompuServe developed 1987 Versions 87a, V89a Because there was no standard

3. 3 GIF Characteristics  Compressed Less Space, Less loading time  8-bit color (or less)  Can contain more than one image  Interlacing possible – image can develop from fuzzy to clear, rather than top to bottom  Free – so became widely used

4. 4 Problem  LZW Compression Algorithm Lempel-Ziv-Welch Believed to be open for use Developers claimed patented  PNG resulted  GIF is still most widely used

5. 5 GIF Format  Header – version, screen layout, palette  Control Blocks – governs display of image Fading, timing, animation  Image Block – information for 1 image Size, palette  Extension Block – comments

6. 6 GIF Compression via LZW  Lossless  Eliminates repeated strings of data & replace with token to previous data 1 1 1 2 3 2 1 2 3 19 19 1 1 1 19 19 1 1 1 2 3 2 [3,3] 19 19 [1,3] 19 19 No need to zip.

7. 7 GIF Animation  A multi-image GIF File  Timed display gives appearance of motion  GIF87a – Multi-image but no motion  GIF89a – Multi-image with animation  Some browsers are not compatible with the animation – 1 st image is shown

8. 8 JPEG Files Joint Photographic Experts Group

9. 9 JPEG Files  JPEG: Actually a compression algorithm File format – JFIF.jpeg,.jpg,.jif,.jfif  Better for Photos  24-bit color  Powerful Compression Engine But lossy compression

10. 10 JPEG Compression  Basis: humans are much more aware of small changes in brightness (luminance) than small changes in color or large changes in color or brightness

11. 11 JPEG Compression – 3 steps 1. Convert RGB to system identifying brightness (e.g. HSL, YC b C r ) 2. Data Reduction through Subsampling – brightness unchanged, eliminates ½ of other 2 scales - replace pairs of neighboring pixels with a single value – the average - reduces to 2/3 of size without noticeable loss of quality

12. 12 JPEG Compression – 3 steps 3. Direct cosine transform (DCT) & Quantization Works on 8 x 8 blocks Color & Brightness in each block are identified and rounded, more weight is given to small changes E.G. 3  5, 75  100 Result: many duplicate values, compresses well by a standard lossless method But image is NOT as accurate as original

13. 13 Compression vs. Quality  Always a tradeoff – 3 main factors More compression  less quality Aggressiveness of rounding Accuracy of jpeg viewer – speed vs. quality  Compression level – 1 to 100 (not %) E.G. 75 is sometimes default – good quality, medium compression – not consistent E.G. Lo-Med-Hi-Max

14. 14 Progressive JPEG  Image comes into focus slowly, like with interlaced GIF  Not interlaced  Starts with low quality image, then is replaced with higher quality images – appearance of coming into focus  Same storage requirements

15. 15 Transparent Color  JPEG does not support transparent color  Technically difficult due to the other aspects of storing the image

16. 16 Compression Ratios - Comparison For Photos  GIF: 5:1 (1/5 the storage)  JPEG: 10:1 at lowest level 200:1 at highest level  Typical: 30:1 slightly noticeable reduction in quality

17. 17 Conclusion  JPEG is superior to other methods for photorealistic images – smooth edges & shading  GIF is best for drawings – hard edges & sharp color changes

18. 18 JPEG: Multiple Compressions  Resaving without changes in image or compression level – quality is exactly same  Each 8x8 block affected is recompressed & lose more quality – can affect image unevenly  Cropping is most damaging  Work in TIFF or PNG then save as JPEG

19. 19 Final Comments  Consider your monitor 256 colors vs. 16 M You can change by changing settings  GIF  JPEG conversion Degrades Can get decent results, see other sources

20. 20 BMP Files Bit Map

21. 21 BMP Files - Basics  Native format for Windows & OS/2 Backgrounds, graphics, wallpaper  Not good for sending via Internet  Only format for Windows wallpaper  Only slightly compressed, or not at all, so large – can be zipped – load & display quickly, since no decompression

22. 22 BMP File Format  File Header BM, number of bytes, file layout  Information Header – describes image Dimension in pixels, color depth (1, 4, 8, 24-bit), compression, number colors used, number colors considered important If all colors can’t be displayed, replaced or dithered; palette stored in order of importance e.g. Brown bear vs. American Flag

23. 23 Dithering Creating the illusion of new colors and shades by varying the pattern of dots.

24. 24 BMP Compression  Only 4 & 8-bit images  Run-length encoding (RLE) – lossless  Replaces string of identical bytes with token telling how many 10 11 11 11 11 15 15 15 6 7 8 8 8 8 8 10 [11,4] [15,3] 6 7 [8,5]  Saves minimal space but decompresses fast

25. 25 DIB?  BMP files are referred to as Device independent bit maps  Can display on any monitor  Sometimes.dib extension Same as.bmp

26. 26 Convert Image to Wallpaper  Software can help Microsoft Plus! Paint Shop Pro Web Browsers Paint Graphics Workshop  See handout  RLE compressed bit map can be used a wallpaper – 4-bit only  Change extension to.bmp

27. 27 Other Graphic File Formats

28. 28 PNG – Portable Network Graphics  Developed due to legal problems with GIF compression algorithm  Lossless Compression More than GIF, less than JPEG  More changes than just compression

29. 29 PNG: Other Changes over GIF  More Color Depth Up to 48 bits per pixel Improved gray scale  Better interlacing & transparency  No Multiple images (thus no animation)  Becoming common, won’t always display Netscape, Internet Explorer AOL Browser, but not email

30. 30 TIFF – Tagged Image File Format  Early Graphics format  Originally only grayscale  High quality graphics Developed for scanning images  Common in scanning programs Scanner, fax, desktop publishers Flexible format

31. 31 TIFF Characteristics  Causing its popularity  Lossless compression (LZW, JPEG, others)  Handles huge images  Stores image in strips (tiles in latest version) Can access one portion 2 – 96 bits per pixel

32. 32 TIFF Disadvantages  Tried to be everything to everybody  Versions are not compatible due to too many options  You may not be able to display others TIFF files  New versions are improved, but not fixed yet

33. 33 ICO – Windows Icon (.ico)  In toolbars, etc.  Can store in.exe or.dll files  4-bit, 32 x 32 pixel image Limited size & color Transparent color = screen color Image in inverse color, always shows  Can create only icons with icon editor

34. 34 ART – from AOL  Designed to download quickly Display time same, transmission faster  Trades quality for size by compression  Your downloads may be converted to ART  AOL includes a converter Necessary unless display only (email, use on web site, etc.)

35. 35 PCD – Photo CD from Kodak  For storing photo images on a CD-ROM  About 100 images per CD  Each photo is digitized at 5 - 6 resolutions Chose one to work with  Can convert to other formats  Many editors will read Paint Shop Pro, Graphics Workshop

36. 36 Macintosh PICT  Native format for Macintosh  Like BMP is to Windows  Can store 1-bit to 32-bit color information  8-bit grayscale