70 likes | 194 Views
Web Image Basics. Comp 140 December 2. Vector Graphics. Can be repositioned or resized Will not diminish output quality Typically stored in AI, EPS, PICT or WMF formats Only SVG is supported by browsers Check out www.w3cschools.com/svg. Raster Graphics. Used primarily by web designers
E N D
Web Image Basics Comp 140 December 2
Vector Graphics • Can be repositioned or resized • Will not diminish output quality • Typically stored in AI, EPS, PICT or WMF formats • Only SVG is supported by browsers • Check out www.w3cschools.com/svg
Raster Graphics • Used primarily by web designers • Built from pixels (picture elements) • Perfectly square • All same size • Display only one color at a time
Resolution • Expression of image quality measured in the number of pixels that fit in one inch (ppi) • Don’t have to be above 72 ppi • At least 300 ppi for printing • Size • The larger the image, the more pixels needed • Full size images for web pages not found too often
Color • Monochrome • 1 bit color • Black or white • 4 bit color • Upto 16 colors • Dithering intersperses and juxtoposes available color to create an illusion of more color • 8 bit color uses upto 256 colors or 256 shades of gray • Websafe colors included • 16 bit - 65,000 colors • 24 bit – 16.7 million colors • ?
Raster Images • JPG, GIF, PNG • GIF (Graphical Interchange Format) • 256 colors • 72 ppi • JPEG ( Joint Photographic Experts Group) • Famous for its patented selectable image compression algorithm • May damage image quality • PNG (portable network graphic) • Supports unlimited resolution, 32 bit color and full alpha and index transparency • Alpha transparency less of a concern as newer browsers can handle it