Main Menu

Welcome to the March 2006 edition of our monthly

Accessibility Tip

March 2006 - How to frame your site

Each month we would like to bring to you a tip on how you can improve the accessibility of your website. Each tip will contain details on a particular issue that faces people with disabilities, how it affects people and what you can do to resolve it.

This month we are discussing How to frame your site.

The issue

Although they are getting fewer there are still a small proportion of sites that uses HTML frames to create the site layout. This provided an easy way to create different areas on the site and each are was loaded from a separate HTML file. One frame might contain a menu while another contains the content for the particular page you wanted to view. When you click on a menu item you just update the source of the content frame and this saves you having to download the whole menu again.

A framed site does however make it more difficult for some people especially somebody has a severe visual impairment or who is blind.

For example somebody with severe glaucoma can only view a small portion of your site at a time. If they selected a link in one area of a framed site such as the menu then they may not see that another area has changed it content unless they first scanned the whole page and could remember what had been there before.

For a blind person the situation is even worse as they cannot scan the page visually. In this case the person has to manually step from frame to frame to read the content of each. The problem is however to identify what the content of each frame is without having the listen to a read-out of each frame first.

To explain this a bit more we have to look at some code. A typical frame page might look something like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<HTML>
 <HEAD>
  <TITLE>A simple frameset document</TITLE>
 </HEAD>
 <FRAMESET cols="10%, 90%">
  <FRAME src="left.html">
  <FRAME src="right.html">
 </FRAMESET>

</HTML>

In the middle of this code you can see two frames: left.html and right.html. The <frame> elements do not have any titles specified so the only indication a screen reader can give in this case is the two filenames. Not much to go on to understand what each frame contains or how to use the site.

The other problem in this particular example is that there is no alternative content available if the browser does not support frames. In this case nothing will be displayed at all.

What you can do

You can show the function of each of the frames by adding a title attribute to the <frameset> and <frame> elements. Continuing with our example from above:

<FRAMESET cols="10%, 90%" title="Our community centre website">
 <FRAME src="left.html" title="Navigation">
 <FRAME src="right.html" title="Content">
</FRAMESET>

Also add a <noframes> element to provide an alternative view of the site if frames are not supported in the browser:

<FRAMESET cols="10%, 90%" title="Our community centre website">
 <FRAME src="left.html" title="Navigation">
 <FRAME src="right.html" title="Content">
 <NOFRAMES>
  <A href="noframes.html" title="Non-frame version">
  Your browser does not support frames. Please visit our non-frame version of the community centre website.</A>
 </NOFRAMES>
</FRAMESET>

More information

Some screen reader users prefer sites with frames as they can easily navigate between the menu and content areas using keyboard shortcuts. Others prefer sites with skip links, i.e. a link at the top of the page which skips over the menu areas directly to the content on the page.

There is one other reason not to use frames that is a usability rather than an accessibility issue: you cannot bookmark a particular subsection of a framed site or send your friends a link to that subsection. Thus your visitors will always be forced to enter your site via the front page and will have to fight their way again through you navigation structure to find the information they are looking for.

Bruce Aylward, March 2006

About W 3 A

W 3 A provides consultancy and audit services on information accessibility, focussing on Internet accessibility, compliance with the W3C standards and NZ Government Web Guidelines, and website best practice. We have relationships with several charities and government agencies responsible for the interests of the disabled.

Subscription Details

If this tip has been forwarded to you from a friend and you would like to subscribe to receive future editions directly then please use our online subscription form or send an email with subscribe as the subject and containing your name and email address to newsletter@w3a.co.nz.

If you would prefer to receive this newsletter in the Headstar Text Email Newsletter (TEN) format then please just let us know.

Other issues of the Accessibility Tip are available on our articles page.