- From: Roberto Scano - IWA/HWG <rscano@iwa-italy.org>
- Date: Sun, 5 Oct 2003 12:21:03 +0200
- To: "WCAG List" <w3c-wai-gl@w3.org>
Hi, working with Image Maps, I've found that this example: http://www.w3.org/TR/WCAG10-HTML-TECHS/#client-side-redundant-text <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> The code in the example has the idea that - if the object is not available, the links are shown in textual mode but if the object is available the same links let to point to an area of the image inside the map. I've test this code with different browsers and these are the results: * Internet Explorer 6: if there is no valorization of the width and height attribute, the object is not visible and there is no alternative visible version * Mozilla 1.5a: the image map is available but no link are available * Opera 7.11: like IE 6 With a code modification (changing the "<a href" into "<area ..." and removing the textual version for the link it works with Mozilla and Opera. Searching around the web I've found a lot of code examples that refer to this use, also inside the WCAG Curriculum. I've found a working version in there that move the map outside the object: http://www.bath.ac.uk/web/accessibility/images.html <OBJECT DATA="welcome.gif" TYPE="image/gif" USEMAP="#map1"> There are several areas in the library including the <A HREF="reference.html">Reference</A> section and the <A HREF="media.html">Audio Visual Lab</A>. </OBJECT> <MAP name="map1"> <AREA shape="rect" coords="0,0,30,30" HREF="reference.html" ALT="Reference"> <AREA shape="rect" coords="34,34,100,100" HREF="media.html" ALT="Audio Visual Lab"> </MAP> I've applied it to our code: <OBJECT data="navbar1.gif" type="image/gif" usemap="#map1"> </OBJECT> <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> And I've found that it works great with Mozilla and Opera but not with IE. This solution can also help low-vision people to find the correct links.... But... how can we do for an optimal use of the "object" inside IE? The Microsoft people inside the working group can give some help? Roberto Scano IWA/HWG EMEA Coordinator W3C Advisory Commitee Representative for IWA/HWG International Webmasters Association / HTML Writers Guild http://www.iwanet.org - http://www.hwg.org E-Mail: emea@iwanet.org - w3c-rep@iwanet.org -------------------------------------------------------------------- This email is not an offer to do business, but is only a discussion. All agreements with IWA must be in writing and acknowledged by IWA International management. --------------------------------------------------------------------
Received on Sunday, 5 October 2003 06:24:22 UTC