1 / 33

Graphics on the Web

Prerequisites. BitsBytes. Everyone places pictures on the web. . . Some people place pictures on the web. . At least a few individuals place pictures on the web. . . Graphics on the Web. Graphics on the Web. Why should you care?Because I've seen your Facebook photos

dominy
Download Presentation

Graphics on the Web

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. Graphics on the Web How much do you want to know??

    2. Prerequisites Bits Bytes

    3. Graphics on the Web

    4. Graphics on the Web

    5. Overview

    7. Concerns Download time Blurry pictures Squished pictures Placement and organization (another talk)

    8. Terminology

    9. Terminology

    10. Terminology

    11. Terminology

    12. Terminology

    13. Pixels

    14. Pixels

    15. Terminology

    16. Terminology

    17. Picture Formats

    18. JPEG/JPG (Joint Photographic Experts Group ) JPG is a lossy compression technique that is designed to compress color and grayscale continuous-tone images. The information that is discarded in the compression is information that the human eye cannot detect. JPG images support 16 million colors and are best suited for photographs and complex graphics. The user typically has to compromise on either the quality of the image or the size of the file. JPG does not work well on line drawings, lettering or simple graphics because there is not a lot of the image that can be thrown out in the lossy process, so the image loses clarity and sharpness.

    19. GIF (Graphics Interchange Format ) Unlike JPG, the GIF format is a lossless compression technique and it supports only 256 colors. GIF is better than JPG for images with only a few distinct colors, such as line drawings, black and white images and small text that is only a few pixels high. With an animation editor, GIF images can be put together for animated images. GIF also supports transparency, where the background color can be set to transparent in order to let the color on the underlying Web page to show through.

    20. PNG(Portable Network Graphics) Not supported by all browsers. PNG was developed as a patent-free answer to the GIF format but is also an improvement on the GIF technique. An image in a lossless PNG file can be 5%-25% more compressed than a GIF file of the same image. PNG builds on the idea of transparency in GIF images and allows the control of the degree of transparency, known as opacity. Saving, restoring and re-saving a PNG image will not degrade its quality. PNG does not support animation like GIF does.

    21. Vector graphics Points lines polygons Mathematical formulae Quality of the image is limited only by the resolution of the display, and the file size of vector data generating the image stays the same. Printing the image to paper will usually give a sharper, higher resolution output than printing it to the screen but can use exactly the same vector data file.

    22. Making a choice

    23. Choice

    24. More Terms...

    25. More Terms...

    26. More Terms...

    27. More Terms...

    28. Why does all this matter?? Over-compressed or skewed images have a poor look. Under-compressed images download slow.

    29. What’s the bottom line?? Save photographs as jpg. Save images (graphs, charts, formulas, etc.) as gif. Don’t force an image to be something it’s not!!

More Related