<object>

Client-Side Image Maps

Try out the three navigation bars on this page. They should work to take you to the same links.

   
 
link to topic intro
link to readings
link to topic notes
navigation bar Inserting Objects Readings for Unit 13 Introduction to Unit 13 Unit Introduction | Readings | Inserting Objects  
 

Yes, there are three images for three navigation bars, although you may only see two. Now look at the page with images turned off (as we looked at pages in unit 6) or try typing in the URL of this page at the Lynx View site to see how it looks in a text-only browser.

The navigation bar on the left was done by cutting the map up; individual images are arranged in a nested table with links and alt tags for each area, so that you can still use the navigation guide if there is no image. Unfortunately there is a lot of coding that goes on to fit the image parts into a table.

The middle navigation bar is done using the "map" tag. The problem with the "map" tag is that it provides no alternative for text-based browsing. If you use the "map" element to make an image map you must also type text with links somewhere on the page to provide alternative navigation.

The navigation bar on the right (which is invisible in some browsers and shows up as text in others, no image) is the use of the <object> tag in combination with the "shapes" attribute as Raggett describes in section 14.3. If you look at the "View>Page Source" for the code, you can see that this would be by far the least bulky and easiest way to add an image map. If only the browsers would support it!

If anyone figures out that I have done something wrong in the code, so that is why it won't work, be sure to send it to the ListServ.

Continue to "Inserting Objects">>

Other Notes for this Topic:
flashy stuff | sound | more sound

  
Readings
Resources
<head>
<p> etc.
<b> etc.
<li> etc.
<a href>
<img src>
Access
<table>
<frame>
<style>
<form>
<script>
<object>
validate

Copyright by dwang, 1999. All rights reserved.