1 / 25

Graphic Images

Graphic Images. JPEG (Joint Photographic Experts Group). JPEG Format. Is a compression algorithm used by files in the JFIF format (JFIF = JPEG File Interchange Format) Commonly referred to as JPEG Is platform independent Supported by nearly all graphical browsers, regardless of version

nariko
Download Presentation

Graphic Images

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. Graphic Images JPEG (Joint Photographic Experts Group)

  2. JPEG Format • Is a compression algorithm used by files in the JFIF format (JFIF = JPEG File Interchange Format) • Commonly referred to as JPEG • Is platform independent • Supported by nearly all graphical browsers, regardless of version • File extension is .jpg or .jpeg • JPEG images contain 24-bit colour

  3. 24-bit RGB Colour • Comprised of millions of colours • Also carry greyscale images with results in higher image quality and more rich and subtle colour variations • Does not use palettes for referencing colour information • However, when displayed on 8-bit colour system browser reduces colours to its built-in web palette • Some dithering occurs – but acceptable in photographic images

  4. JPEG Compression • Is a ‘lossy’ compression scheme • Loss is not discernible to the human eye • Able to achieve 10:1 to 20:1 data compression ratios without visible loss in quality • Ratios can go even higher if high image quality is not a priority

  5. Image Loss • Once image quality lost in compression, you can never get it back again • Loss in image quality each time it is decompressed and compressed • Image is degraded each time it is opened and resaved

  6. Variable Compression Levels • You can control the degree to which the image is compressed • The higher the quality the larger the file • Goal is to find the smallest file size with acceptable image quality • Quality of image is denoted by its “Q” setting • Low Q = low image quality, better compression • High Q = better quality, larger files

  7. “Q” Setting • Q setting has not specific mathematical significance • The numbers themselves are not significant, how the image looks and its resulting file size is

  8. Screen Shot of Image Preview in Fireworks 8

  9. Screen Shots Showing Q Settings For Fireworks 8

  10. Screenshots showing corresponding images High Quality – 100 File Size = 351 KB Low Quality – 10 File Size = 6 KB

  11. JPEG Compression • JPEGs need to be decompressed before they can be displayed • Takes a browser longer to decode and assemble • JPEGs can usually be downloaded faster than GIF (depends on file size), but take longer to decompress. • Difference is not really noticeable nowadays

  12. When to Use JPEGs • Ideal for photography and images where there is a lot of tonal variation such as: • Paintings • Complex gray-scale images

  13. Photographic & Continuous-tone Images

  14. Not Good For • Not good at compressing images with areas of solid colour such as: • Logos • Line art • Type • Cartoon-like illustrations • Lossy compression makes flat colours blotchy and pixelated which results in loss of quality in some cases • Not good for sharp edges or typography as it leaves a ripple-like edge

  15. .wmf image

  16. From WMF to JPGWith Low Quality

  17. From WMF to JPGWith High Quality

  18. Progressive JPEGs • Display in a series of passes (like interlacing in GIF) • Each pass contains more detailed information • Graphics programs allow you to specify the number of passes (3, 4 or 5) • Fast Internet connection may not see any passes at all

  19. Progressive Scans Box

  20. Advantages • Provide some indication of the full image • Are generally slightly smaller than standard JPEG files

  21. Disadvantages • Require more processing power to display • Not supported in older browser versions • If a browser cannot identify a Pro-JPEG, it displays a broken graphic image

  22. Creating JPEGs • Popular graphics tools all provide similar options for saving JPEGs • Adobe Photoshop/ImageReady • JASC Paint Shop Pro • Macromedia Fireworks • Save in Progressive JPEG format • Can get side-by-side previews of image • Make sure your file is in RGB or grayscale format • Name file .jpg or .jpeg

  23. Minimizing JPEG File Size • Optimise file to make as small as possible • JPEGs are always 24 bit • Not an option to reduce bit-depth • Play with quality setting • Prepare image prior to compression • Use specialized tools available to make file as small as possible with good quality

  24. Aggressive Compression Ratios • Direct way of optimising a JPEG • Adjust the Quality setting • Used if image has a lot of continuous tone or gradient colours • Can be very aggressive without to much loss of quality • Depends on image • Flat colour and appear ‘blocky or blotchy’

  25. Aggressive Compression Ratios • Software tools can control quality/compression ratios • Fireworks, Paint Shop Pro, Photoshop • Scales vary from 0 to 12, 0 to 100, 1 to 10 • Use a tool that offers a preview • Or do some testing manually • Remember to save a copy of the original image for a fresh compression with each test

More Related