HTML and CSS

Making Frames Accessible with noframes

One of the most important considerations when designing with frames is, as mentioned earlier, ensuring that individuals who cannot use frames, such as the blind or mobility-impaired, still have access to important information on a website. One of the ways to achieve accessibility in a framed site is to employ the noframes element. This is placed in the frameset element. Critical information can then be provided at the same URL as the frameset page, and an entirely accessible site can be formed by using the same pages as the framed site (see Example 6-13 and Figure 6-9).

Example 6-13. Making frames accessible with noframes
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
       http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Frames with NOFRAMES Element</title>
</head>

<frameset cols="200*">
<frame src="menu.html" marginheight="5" marginwidth="5" noresize="noresize"
 scrolling="auto" />
<frame src="main.html" name="right" marginheight="9" marginwidth="9" noresize="noresize"
 scrolling="auto" />

<noframes>
<body>
<p>Welcome. We're happy to provide this non-frames access to our
Web site. If you prefer to view our site using frames, please
upgrade your browser to a recent one that fully supports frames.
Otherwise, please visit our <a href="index_noframes.html">
non-framed</a> version of this site.</p>
</body>
</noframes>

</frameset>
</html>

Figure 6-9. Even without frames support, older browsers and accessibility-related software can interpret the noframes information.

Are you ready for a kick?

Good!

Here's the markup as shown in Mosaic 1.0, a very early graphical browser. There's no frames support, of course, but simply using the noframes element ensures that I can get to the information, as can the blind and mobility-impaired.

Because you can format an entire document within the noframes element, consider using the index page as the welcome page to your site. From there, link to internal pages that are external to the frame design.

NOTE

It's very important to remember that frameset documents do not support the body element, with this one exception: If the noframes element is in use, you use the body element as a means of creating the body information for the noframes version of your page. Otherwise, never use a body element in a frameset; use the frameset element instead.