Chapter 7: Finding and Using Images PDF Print E-mail
Sections - Part II: Formatting Web Pages with (X)HTML

Web page designers use images to deliver important information, direct site navigation, and contribute to the overall look and feel of a Web page. But you have to use images properly or you risk reducing their effectiveness.

When used well, images are a key element of page design. When used poorly, they can make a page unreadable or inaccessible.

This chapter is a crash course in using images on Web pages. You find out which image formats are Web-friendly and how to use (X)HTML elements to add images to your Web pages. You also discover how to attach links to your images and how to create image maps for your Web page.

Page 104, Figure7-1: The White House Web page uses images in a variety of ways

Page 104: Optimizing Images:
http://www.yourhtmlsource.com/optimisation/imageoptimisation.html

Page 104: Optimizing Web Graphics
http://www.websiteoptimization.com/speed/12/

Page 105: Builder.com's "Examine Graphic Channels and Space"
http://builder.cnet.com/webbuilding/0-3883-8-4892140-1.html

Page 105: Webmonkey's "Web Graphics Overview"
http://www.webmonkey.com/01/28/index1a.html
This has been changed to "Web Graphics for Beginners" at
http://www.webmonkey.com/tutorial/Web_Graphics_for_Beginners

Page 107, Figure 7-2: The <img /> element (display view) (code view)
Note that alt attribute and value is required for files to validate (missing on pg. 107)

Page 109, Figures 7-3 and 7-4: Alternative text (display view) (code view)
W3C's Web Accessibility Initiative (WAI) includes helpfult tips for creating useful and usable alternatives to visual content at
http://www.w3.org/TR/WCAG10-TECHS/#gl-provide-equivalents

Page 113-114, Figure 7-9: Image alignment (display view) (code view)

Page 115, Figure 7-10: Image spacing (display view) (code view)

Page 116, Figure 7-11: Images that link (display view) (code view)

Page 118, Figure 7-12: Image maps (display view) (code view)

About.com image map tutorial:
http://webdesign.about.com/od/imagemaps/a/aabg051899a.htm

HTML Goodies image map tutorials:
http://www.htmlgoodies.com/tutorials/image_maps/index.php



Share this page!
Reddit! Del.icio.us! JoomlaVote! Google! Live! Facebook! StumbleUpon! Yahoo! Free social bookmarking plugins and extensions for Joomla! websites!
Last Updated on Monday, 30 June 2008 11:38
 
Chapter Resources
Chapter 1
Chapter 2
Chapter 3
Chapter 4
Chapter 5
Chapter 6
Chapter 7
Chapter 8
Chapter 9
Chapter 10
Chapter 11
Chapter 12
Chapter 13
Chapter 14
Chapter 15
Chapter 16
Chapter 17
Chapter 18
Chapter 19
Chapter 20
Chapter 21
Chapter 22
Chapter 23
Feedback - send us a message
Featured Links:
Banner
Visit co-author
Ed Tittel's web site!
Visit co-author
Jeff Noble's web site!
Conquest Media
Web page layout and
hosting provided by
SheTech and Company. the power of the web. http://www.shetech.com