W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > April to June 2001

Re: images / alt and image maps

From: Charles McCathieNevile <charles@w3.org>
Date: Fri, 25 May 2001 14:39:04 -0400 (EDT)
To: "Larry G. Hull" <Larry.G.Hull@gsfc.nasa.gov>
cc: Rebecca Cox <rebecca@cwa.co.nz>, <w3c-wai-ig@w3.org>
Message-ID: <Pine.LNX.4.30.0105251430130.701-100000@tux.w3.org>
IE may not implement the HTML 4 specification completely, in allowing for the
a element to have coords attributes. iCab is another browser where this
works.

If you have HTML 4.01 then the allowed content for map changed specifically
to cope with this. So you could add area elements, to have

     <OBJECT data="navbar1.gif" type="image/gif" usemap="#map1">
      <MAP name="map1">
       <P>Navigate the site.
        [<A href="guide.html" shape="rect"
        coords="0,0,118,28">Access Guide</A>]
        [<A href="shortcut.html" shape="rect"
        coords="118,0,184,28">Go</A>]
        [<A href="search.html" shape="circle"
        coords="184.200,60">Search</A>]
        [<A href="top10.html" shape="poly"
        coords="276,0,276,28,100,200,50,50,276,0"> Top Ten</A>]

 <AREA href="guide.html"
          alt="Access Guide" shape="rect" coords="0,0,118,28">
 <AREA href="search.html"
          alt="Search" shape="rect" coords="184,0,276,28">
 <AREA href="shortcut.html"
          alt="Go" shape="circle" coords="184,200,60">
 <AREA href="top10.html"
          alt="Top Ten" shape="poly" coords="276,0,373,28,50,50,276,0">

      </MAP>
     </OBJECT>

Or you could do all of this in XHTML using the browser compatibility rules,
with the following:

     <object data="navbar1.gif" type="image/gif" usemap="#map1">
      <map name="map1">
       <p>Navigate the site.
        [<a href="guide.html" shape="rect"
        coords="0,0,118,28">Access Guide</a>]
        [<a href="shortcut.html" shape="rect"
        coords="118,0,184,28">Go</a>]
        [<a href="search.html" shape="circle"
        coords="184.200,60">Search</a>]
        [<a href="top10.html" shape="poly"
        coords="276,0,276,28,100,200,50,50,276,0"> Top Ten</a>]
       <p>
        <area href="guide.html"
          alt="Access Guide" shape="rect" coords="0,0,118,28">
        <area href="search.html"
          alt="Search" shape="rect" coords="184,0,276,28">
        <area href="shortcut.html"
          alt="Go" shape="circle" coords="184,200,60" />
        <area href="top10.html"
           alt="Top Ten" shape="poly" coords="276,0,373,28,50,50,276,0" />
      </map>
     </object>

This is a little bit clunky, since you are repeating content in order to cope
with browsers that don't fully implement the spec, but it should work, and
the examples should be valid for HTML 4.01 and XHTML 1.0 respectively.

cheers

Charles McCN

On Fri, 25 May 2001, Larry G. Hull wrote:

  Hi Rebecca,

  I also like the technique but have encountered a problem. The example
  works fine in Netscape 4.74 but fails in IE 5.0 and 5.5 and I've no
  idea why.

  Perhaps someone see a reason that accounts for the difference?

  I'm using:

     <OBJECT data="navbar1.gif" type="image/gif" usemap="#map1">
      <MAP name="map1">
       <P>Navigate the site.
        [<A href="guide.html" shape="rect"
        coords="0,0,118,28">Access Guide</A>]
        [<A href="shortcut.html" shape="rect"
        coords="118,0,184,28">Go</A>]
        [<A href="search.html" shape="circle"
        coords="184.200,60">Search</A>]
        [<A href="top10.html" shape="poly"
        coords="276,0,276,28,100,200,50,50,276,0"> Top Ten</A>]
      </MAP>
     </OBJECT>

  Larry

    At 9:53 AM +1200 5/25/01, Rebecca Cox wrote:
  >HI all,
  >
  >I've got two questions to ask, so will send a couple of emails.
  >
  >Regarding image maps and "alt" text & "redundant text links"
  >
  >I've been having a look at the technique outlined at
  >
  >http://www.w3.org/TR/WCAG10-HTML-TECHS/
  >
  >under "7.4.2 Redundant text links for client-side image maps"
  >
  >(where it has an example using object & A to code the imagemap and its links)
  >
  >I tried this example code, and when you turn images off in the
  >browser, you get text links, which is great, and will fulfill the
  >needs of those not using images.
  >
  >I would think that "best practice" would be to still put actual text
  >links on the page somewhere as well, for anyone who surfs with
  >images on, but can't see well enough to see the image clearly.
  >
  >Opinions would be appreciated!
  >
  >Cheers
  >
  >Rebecca


-- 
Charles McCathieNevile    http://www.w3.org/People/Charles  phone: +61 409 134 136
W3C Web Accessibility Initiative     http://www.w3.org/WAI    fax: +1 617 258 5999
Location: 21 Mitchell street FOOTSCRAY Vic 3011, Australia
(or W3C INRIA, Route des Lucioles, BP 93, 06902 Sophia Antipolis Cedex, France)
Received on Friday, 25 May 2001 14:39:22 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 19 July 2011 18:13:54 GMT