Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting...
-
Upload
aleesha-young -
Category
Documents
-
view
214 -
download
1
Transcript of Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting...
![Page 1: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/1.jpg)
Multimedia in Web
Images
![Page 2: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/2.jpg)
A Picture Tells A Thousand Words
Forms of ImagesPhotographPaintingSymbolLogoFlagMapDiagram
FunctionsProvide factsExplain a processSet a moodEvoke an ideaPinpoint location Illustrate
relationships
![Page 3: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/3.jpg)
Digitalization & Pixel
![Page 4: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/4.jpg)
Numeric Representation & RGB
16 digits instead of 1009 & AFBase 16 can represent 0 to 255 color
scalesTwo digits of hexadecimal numbers
00 in Hex. 0 in decimalFF in Hex. 255 in decimal
![Page 5: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/5.jpg)
RBG Colors
Color Red Green Blue Hexadecimal ColorBlack 0 0 0 # 00 00 00Red 255 0 0 # ff 00 00
Green 0 255 0 # 00 ff 00Blue 0 0 255 # 00 00 ffWhite 255 255 255 # ff ff ff
Blue-green 0 153 153 # 00 99 99
Color Chart: http://quasar.unl.edu/tutorials/rgb.html
Sample Colors
![Page 6: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/6.jpg)
Color Depth
16-bit vs. 8-bit30,000 colors vs. 256 colorsWeb-safe colors (No longer a concern?)
![Page 7: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/7.jpg)
Compression
PurposeReduce file size for transmissionFast download
![Page 8: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/8.jpg)
JPEG
Photographs From 255 levels of color and brightness to
lower levels Group pixels into blocks. Adjacent and similar
color and brightness block or average Example: The next slide
![Page 9: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/9.jpg)
Example
9 values with 3 different colors for 9 pixels 1 value for the average and 2 values for difference from the average for other colors
A string of values such as #FF3399, #FF3399, #FF3399, #CC3399 … for all 9 pixels #FF3399 as the average, 2 values for other colors differentiating from the average
![Page 10: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/10.jpg)
GIF
For line drawings Reduce color depth of every pixel to 8 bits or
less Repeated colors across a row of pixels are
reduce to the color value, the value of the repetition, other instructions.
![Page 11: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/11.jpg)
Vector Graphics
Web images use bitmapped format or pixel-by-pixel
Collection of lines & shapes defined by mathematical formula (e.g. Flash)
![Page 12: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/12.jpg)
Source of Image
Scanned imageDigital cameraOriginal artworkWeb siteCD-ROMClip artStock photograph
![Page 13: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/13.jpg)
Photoshop
Explore editing, compressing, & saving for Web
![Page 14: Multimedia in Web Images. A Picture Tells A Thousand Words Forms of Images Photograph Painting Symbol Logo Flag Map Diagram Functions Provide facts Explain.](https://reader036.fdocuments.net/reader036/viewer/2022082818/56649ebf5503460f94bc9e5b/html5/thumbnails/14.jpg)
Image & HTML
IMG tagLinking with imageImage map