Download Images for the Web

Survey
yes no Was this document useful for you?
   Thank you for your participation!

* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project

Document related concepts
no text concepts found
Transcript
Images for the Web
planning, acquiring, processing
My Laws of Image Usage
• Images ALWAYS convey information
(think about what messages your image conveys)
• If you can use a picture instead of words, do.
(but add the words as alt-text).
• Make sure you have the right to use the image(s)
• Don’t make the image files larger than necessary
(thumbnail/printing)
Planning
• Audience?
• What information do I want to convey?
• What information can be conveyed visually?
• What style (also informative) do I want to use.
(Law 5: Be consistent)
Getting Images 1
• Take pictures (with a camera or digital camera)
• Get from sites that explicitly give the right to use
– http://office.microsoft.com/clipart (actually cool pics)
• Logomakers
• Ask permission to use images you like
• Make a collage of free images
• Buy a commercial image or set of images
– Eyewire, Artville
Getting Images 2
• Get post-copyright images (100 yr guideline)
• Capture image (permission need still applies)
– PSP, SnagIt, Print Screen
• Explore your organization’s intellectual property
• Create an image with a drawing program
• Round Robin - How do you get images?
Processing Images
Image Qualities
• Transparency
• Compression
• Scalability
• Color Depth
File Formats
• Vector - paths - commercial design work
• .wmf/.ai (illustrator) /.cd (corel) - not really Web
• Raster - pixels - Web images
• .jpg (most colors in compression, but not
transparent)
• .gif (allows transparency, but fewer colors)
• .tif - used often for no compression - some browsers
• .bmp (large file size, microsoft paint)
• .png (more colors than gif, w/ transparency option)
File Sizes
• Why Care?
– Loading speed
– Space Limitations
• Desirable File Sizes
– 50-300k for display images (arbitrary but possible)
– more for printing (but consider an extra step)
• Decreasing size
– smaller image or different compression
Image sizes/resolutions
• 640x480 base size = 307,200 pixels
• ppi = display / dpi = printer
• pixels/ppi=inches
• 72 ppi for web
• Declaring image size in HTML
• Scaling using image programs/Scaling using Word
How to work with images...
Special Images
• Animations - many different programs
• Panoramas (Photovista) - steerable
• Image maps - FrontPage - What do you use?
Look for an image, maybe of a panorama,
maybe with the top and bottom blacked out to show that
it could go all the way around my walls
(sample image plan)
Programs
• Paint (.bmp only - severely limited)
• Paint Shop Pro - $84, demo available, nice capture
• Whatever came with your scanner or camera
• Microsoft Word - Great for scaling, clipart
• Adobe Photoshop - $127 (Image Lab?)
• Gimp - Free but very complicated
• Others?