473,734 Members | 2,211 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Image/Object Maps Accessibility

I have this kind of construct:

http://www.geocities.com/stanio/temp/usemap01.html

(an IMG element using MAP described with AREA elements)

I'm trying to make it more accessible and currently I'm testing in
Lynx. Lynx plays it clever and when I "enter" the map it shows only
3 links no matter there are 5 AREAs (3 point to a same reference). I
don't like Lynx displays the 'alt' text and not the link titles
(I've used slightly different titles for the 3 links which point to
a same reference for testing purposes, but they should really be
the same).

So to make it more accessible in Lynx I've tried:

http://www.geocities.com/stanio/temp/usemap02.html

an OBJECT element using and enclosing MAP described with A
elements, so Lynx would display the links in-document and not
separately. But then I don't want the duplicate reference links to
appear - this is my primary goal.

Something which is not very clear for me:

http://www.w3.org/TR/html401/struct/...de_image_map-1

Can I combine block-level content included A elements with AREA
elements? The spec states:
When a MAP element contains mixed content (both AREA elements and
block-level content), user agents must ignore the AREA elements.


which in turn means (to me) that in graphical browsers showing the
image/object the additional areas specified with AREA wouldn't be
active... ?

In fact the different browsers I've tried (Netscape/Mozilla, IE and
Opera) behave very strange in such situation. Here are other test
cases for this (including when the MAP is outside the OBJECT):

http://www.geocities.com/stanio/temp/usemap03.html
http://www.geocities.com/stanio/temp/usemap04.html
http://www.geocities.com/stanio/temp/usemap05.html
http://www.geocities.com/stanio/temp/usemap06.html

Only Opera unifies As and AREAs. For Netscape/Mozilla there's
different behavior if I put AREAs first or the As first. IE is hopeless.

I'm confused about what is right and what approach I should take.

--
Stanimir

Jul 20 '05 #1
4 2215
Stanimir Stamenkov <s7****@netscap e.net> wrote:
(an IMG element using MAP described with AREA elements)
The short answer to image map accessibility is "no, it isn't". There's
really just one excuse, or actually a reason, to use a client-side image
map: when a selection to be made by the user is inherently two-dimensional,
such as selecting an area from a real map, or selecting an object from a
photo. Even then, a redundant list of links should be added, i.e. the image
map should only be provided as an _alternative_. This is an explicit
requirement in Section 508 rules, and it is also presented as an "until user
agents..." rule in WAI guidelines. For an explanation why it's still
relevant, and will be for a long time, see
http://www.cs.tut.fi/~jkorpela/html/mapalt.html

(Server-side image maps should only be used for special applications that
cannot be implemented otherwise, such as a map service where you can click
on any location and have a new map with that location in the center.)
I'm trying to make it more accessible and currently I'm testing in
Lynx.
Lynx is too good. Try with IE with images disabled.
I don't like Lynx displays the 'alt' text and not the link titles
It's the alt text that is by definition what the author provides as
ALTernative text.
an OBJECT element using and enclosing MAP described with A
elements,
The OBJECT element is almost useless due to horrendously buggy
implementations . When used for image maps, it makes things much worse.
I'm confused about what is right and what approach I should take.


First design the page without any image maps. Then consider adding an image
map as an alternative. The choice should be based on a simple question: will
this help users? For example, if it's a matter of selecting a US state in
order to get info about a company's activities in that state, then a map
which is an image map (with states with no activities greyed out somehow)
would probably make things somewhat easier to many users, since they could
see the situation easily and make a choice fast, as compared with selecting
a name from a list of links. But you should still have that list somewhere.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

Jul 20 '05 #2
In article <Xn************ *************** **@193.229.0.31 > in
comp.infosystem s.www.authoring.html, Jukka K. Korpela
<jk******@cs.tu t.fi> wrote:
For example, if it's a matter of selecting a US state in
order to get info about a company's activities in that state, then a map
which is an image map (with states with no activities greyed out somehow)
would probably make things somewhat easier to many users, since they could
see the situation easily and make a choice fast, as compared with selecting
a name from a list of links.


Might I offer a dissenting view?

A list in a form downloads to my computer faster than almost any
image large enough to show 50 US states (or even 48 US states).

My own preference is for the list, because I can select my state and
be on the next page already, before the image has finished
downloading.

As you say, it is good to offer both alternatives.

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/
Jul 20 '05 #3
Jukka K. Korpela wrote:
The short answer to image map accessibility is "no, it isn't". There's
really just one excuse, or actually a reason, to use a client-side image
map: when a selection to be made by the user is inherently two-dimensional,
such as selecting an area from a real map, or selecting an object from a
photo.
Actually this would be a part of a device documentation where there
are two sections (using this technique): Front and Rear View, each
starting with a front/rear view picture/scheme to be used as visual
TOC with links pointing to sections describing the corresponding
parts. Does it make sense to use image maps?
Even then, a redundant list of links should be added, i.e. the image
map should only be provided as an _alternative_.
That's why I'm trying a MAP with A elements.
This is an explicit
requirement in Section 508 rules[...]
OT: I wish there is such section in my country's laws too.
(Server-side image maps should only be used for special applications that
cannot be implemented otherwise, such as a map service where you can click
on any location and have a new map with that location in the center.)


I don't find use of server-side maps other than mentioned above. I
don't need nor I plan using server-side maps. The documentation
would be stand-alone.
I don't like Lynx displays the 'alt' text and not the link titles


It's the alt text that is by definition what the author provides as
ALTernative text.


O.k., whatever. Did you notice that Lynx renders the 'title's in the
last two examples and not the 'alt'? (I don't know why)
an OBJECT element using and enclosing MAP described with A
elements,


The OBJECT element is almost useless due to horrendously buggy
implementations . When used for image maps, it makes things much worse.


Yeah, but I'm trying to make some balance - what would currently
work with how it is meant to be done. For me there should be no IMG,
APPLET or IFRAME elements.
I'm confused about what is right and what approach I should take.


First design the page without any image maps. Then consider adding an image
map as an alternative. The choice should be based on a simple question: will
this help users? For example, if it's a matter of selecting a US state in
order to get info about a company's activities in that state, then a map
which is an image map (with states with no activities greyed out somehow)
would probably make things somewhat easier to many users, since they could
see the situation easily and make a choice fast, as compared with selecting
a name from a list of links. But you should still have that list somewhere.


I need the pictures and I need the parts linked to the corresponding
sections. May be after all I'll use IMG, MAP and A elements but here
have come my second and probably more important issue:

Should AREA and A elements specified in a MAP be unified by UAs
which render the map graphically (see my original post for comments
on that)?

--
Stanimir

Jul 20 '05 #4
Stanimir Stamenkov <s7****@netscap e.net> wrote:
Actually this would be a part of a device documentation where there
are two sections (using this technique): Front and Rear View, each
starting with a front/rear view picture/scheme to be used as visual
TOC with links pointing to sections describing the corresponding
parts. Does it make sense to use image maps?


Certainly.
Even then, a redundant list of links should be added, i.e. the image
map should only be provided as an _alternative_.


That's why I'm trying a MAP with A elements.


I'm afraid it's not a practical solution - it's more like W3C's idea on how
the problem might be solved. And if all browsers implemented good old image
maps (using just <img>, <map>, and <area> with alt attributes), the
redundant list of links would not be needed. So it's a matter of interim
solutions.

Using a list of links along with the image map is normally not difficult,
though a bit clumsy unless you have suitable tools. It's probably useful to
tell users explicitly about the redundancy ("select a part either by
clicking on the image or by following link in the list, which contains all
the parts in alphabetic order", or something like that). Not all people can
immediately see that the two "menus" have exactly the same items, just in
very different ways.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

Jul 20 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

12
2745
by: Major Man | last post by:
Hi, I have this .jpg picture that's 700 x 200. What I wanna do is display it on a 300 x 200 window, and have it scroll left and right, back and forth. Can anyone help this newbie? TIA
14
11094
by: D. Alvarado | last post by:
Hello, I am trying to open a window containing an image and I would like the image to be flush against the window -- i.e. have no padding or border. Can I make this happen with a single call to a window.open function? I would prefer not to create a separate HTML page. So far all I have is the basic var cwin = window.open('images/KJV-THANKS.gif', 'Thanks', 'width=243,height=420,'); cwin.focus();
4
4643
by: Jim Land | last post by:
I've got an image and an image map, and they work fine together. See it here: http://www.jim-land.com/testing/MapPage01.htm But the image map has way too many points (vertices) in its 87 polygons. The html file is over 100k. That's too big to fit into our content- managment system, not to mention that it takes too long to load--about 30 seconds--over a 58k dialup connection. The problem is that the polygons are far too accurate.......
0
1470
by: Kevin Vaughn | last post by:
Is it possible to use image maps to divide up a picture acting as an image button? I have created a map of a building, and now I want to have some sort of pop-up messages when certain parts of the building are moused over. The only way I can think to do this (without using javascript), is to divide the image into sections with an image map and have the pop-ups display my info. I've never made an image map before, nor have I dealt with...
3
2559
by: Larry Serflaten | last post by:
I am taking a 256 color bitmap from a file and scaling it up X 16 to a 32bppPARGB bitmap in memory. I copy that image to the screen. After scaling, the edges of all the lines and colors are blurred. I want the edges all crisp, including inherent pixelation (jaggies). Setting smoothing to none, or adjusting the composting mode on the Graphics object still
3
3321
by: lofty00 | last post by:
hello, sorry about the repost - I've been posting to several groups and I've decided it's better to make a single repost to all of them rather than an extra post in each. I've been trying to work out why I can't get the image maps to work in IE6 on a page I'm working on (which is now working in firefox). I've written the page below as a test case. It's now refusing to work in Firefox either, and I can't see anything wrong with it so...
13
2402
by: NickName | last post by:
"For the vision impaired, SVG offers tremendous potential for interactive Internet mapping applications as discussed by Gardner and Bulatov (2001).". Now, here's an SVG file with fair/medium complexity, http://www.carto.net/papers/svg/samples/canvas.svg, even as a sighted person, I find its source code albeit in xml format hard to "absorb" at the first glance, let alone a visually impaired individual. The most important element seems...
6
4757
by: David Stone | last post by:
I have a simple question about the alt content of area elements within an image map: is it redundant to include phrases such as "link to..." or "jump to..."? My initial thought is 'yes', since the area element implies a link to some other item or page location, but would like to hear what others think. If it helps at all, the page which prompted me to ask the question is this one: ...
10
2645
by: Arnaud Diederen | last post by:
Hello everyone, and happy new year to all c.l.j'ers! No bad code to post, just a question. I wrote a JavaScript application that lets users view an image, and zoom on it. The way I "zoom" is pretty simple, really (I hope that your newsreaders displays text with a monospace font..) :
0
8946
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
8776
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
9310
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
9236
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9182
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8186
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
0
6031
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4809
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
2724
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.