Developing Accessible Web Applcations Links Sample

Demo

I am a link

I am a span

Discussion

Whenever text (or images) is clickable, the A HREF element must be used. Improperly specified links are one of the most common sources of accessibility problems. With CSS and scripting, it's pretty easy to make a SPAN or other non-link element look and behave exactly like a link. The problem is that the role on non A HREF elements is not "link". AT devices can not, therefore, report the link correctly to the user. Note here that the SPAN looks and behaves like a link when clicked on. We haven't added enter key support to the SPAN, but that would just make the SPAN seem to be more link-like. To many AT devices, this would make no difference.

• Semantic HTML:
  • A HREF element

Sample Code

HTML

<p><a href="#" onclick="OnLinkClick()">I am a link</a></p>
<p><span class="link" tabindex="0" onclick="OnLinkClick()">I am a span</span></p>