WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: accessibility of smart tags

for

Number of posts in this thread: 3 (In chronological order)

From: Julius Charles Serrano
Date: Thu, Mar 29 2012 5:47PM
Subject: accessibility of smart tags
No previous message | Next message →

Hi all.

What is the best way to ensure that pages using Smart Tags are accessible?

This is an example of a page using smart tags:
http://www.health.govt.nz/yourhealth-topics/diseases-and-illnesses/heart-disease/angina

As seen on the page, when you click on one of the smart tags, "symptoms"
for example, a new section of information about symptoms would appear.
This event will hide the previous section.

I realize that it may be difficult for screen reader users to perceive
at once the change that will take place when they click one of the smart
tags.

I'd like to know your thoughts on how we can make this more perceivable
and accessible.

I'm thinking of two ways:
1. Provide textual information about the smart tags and how they work
2. Create a way where, when the user presses enter on one of the
smart tags, the focus will be sent automatically at the beginning of the
corresponding section.

Any other suggestions?

Julius

--
Julius Charles Serrano
Accessibility Specialist
Catalyst IT Ltd
http://www.catalyst.net.nz

From: Jukka K. Korpela
Date: Thu, Mar 29 2012 11:48PM
Subject: Re: accessibility of smart tags
← Previous message | Next message →

2012-03-30 2:47, Julius Charles Serrano wrote:

> What is the best way to ensure that pages using Smart Tags are accessible?

I think you are not referring to Smart Tags as once introduced by
Microsoft, a feature that allowed Microsoft and its partners to insert
their own links into any web page viewed through IE. They were heavily
criticized on several grounds, and they mostly fell into disuse.

What you seem to be referring to is tabbed controls.

> This is an example of a page using smart tags:
> http://www.health.govt.nz/yourhealth-topics/diseases-and-illnesses/heart-disease/angina

When scripting is disabled, it appears to use tabbed controls, in a
rather normal way, implemented as links. There are several ways to
implemented tabbed controls, and the robust way is to use normal HTML
links, usually enhanced with styling and possibly scripting. In this
case, each tab control is a text link, just formatted in a "tabbish"
manner. It's difficult to find anything wrong with this. The
implementation loses the default distinction between visited and
unvisited links, as usual with tabbed controls, but this is hardly a
serious problem when there are only four tabs.

When scripting is enabled, it works differently, client-side: it indeed
effectively replaces content by other, initially hidden content on the page.

> I realize that it may be difficult for screen reader users to perceive
> at once the change that will take place when they click one of the smart
> tags.

The same basic issue exists whenever sites have headers, navigation
bars, etc., as they mostly do - the problem of repetitive content. It's
a serious problem with many aspects, especially since much of the
"repetitive" content is crucial, for usability, accessibility, and
otherwise.

One of the ways to deal with the problem is a "jump to content" link at
the very start. It's far from ideal, and it introduces some problems,
but as a whole, it tends to be useful. And this site has such links, as
one can see e.g. by viewing a page with style sheets disabled: the very
first item on the page is then "Jump to Content". However, it does _not_
jump to content! It jumps to the block start starts with breadcrumb
trail, followed by loads of navigation.

I tried to check out how it works on Lynx, the good old text browser, on
Unix, but I got the response

Error 503 Service Unavailable

Service Unavailable

Guru Meditation:

XID: 747134933

Varnish cache server

I have no idea why this happens, but it's apparently not intermittent.
The page http://www.health.govt.nz works OK, but all the health topics
seem to cause the error.

In this case, when scripting is enabled, the change of content takes
place within the browser without loading a new page. This indeed may
mean that it is more difficult to perceive what happens.

> I'd like to know your thoughts on how we can make this more perceivable
> and accessible.

In addition to the above, there is at least one thing that needs fixing.
For example, the page you mentioned has the following external title
(i.e., title element contents): "Angina | Ministry of Health". This is
hardly understandable in the global context - it does not even identify
the hemisphere. So I'd suggest appending "of New Zealand" or at least
"of NZ".

Moreover, if you click on e.g. the tab control "Symptoms", the page
changes but the external title doesn't. If the page actually changes, as
in the non-JavaScript backup, this could be fixed by modifying the title
element e.g. by prefixing it with "Symptoms of". But in the normal,
scripting version, it's more difficult.

> I'm thinking of two ways:
> 1. Provide textual information about the smart tags and how they work

That would probably just add to the confusion. Where could such
information be placed? How would users find it when they need, and how
could they ignore it when they don't need it?

> 2. Create a way where, when the user presses enter on one of the
> smart tags, the focus will be sent automatically at the beginning of the
> corresponding section.

Setting focus easily messes things up instead of fixing them.

There's one simple approach, but it might not apply to all pages in
question, just the great majority: just get rid of tabs.

For information such as the symptoms, treatment, and prevention of a
disease, tabbed controls aren't that useful. Putting them on one page,
with suitable subheadings, might work better. It could be a relatively
long page, but it would be simple to use, avoiding the issues of tabbed
controls, and the headings would help to find parts of the information
there - and the page could have a logical heading structure, instead of
the somewhat artificial current structure (where e.g. "When you need to
see the doctor" is not a basic part but under the tab "Treatment", which
is not intuitively obvious).

(In fact the information _is_ now on one page; the tabbed controls just
control which part of it is visible.)

Yucca

From: Julius Charles Serrano
Date: Sun, Apr 01 2012 2:18PM
Subject: Re: accessibility of smart tags (quick tabs)
← Previous message | No next message

My apologies, Yucca.

The feature I was talking about is called quick tabs.

I think that you made a good point. Probably the best option is to
remove the tabs and organizing the information using headings. In the
example, there isn't a large volume of information so using headings
would address this accessibility issue.

Julius