Describe frames and their relationship  
WAI / WCAG 1.0 Priority 2 checkpoint 12.2
 
 
Issue Description

The page contains FRAMESET and FRAME elements with a TITLE attribute. Check that the attribute describes the purpose of the frame and how the frame relates to the other frames of the page.

If necessary add a LONGDESC attribute as well.

 
 
How to check

Ensure that the TITLE attribute of FRAME clearly describes the purpose of the frame and its relationship with the companion frames. If TITLE is not enough (for example because images, links, or other markup is required) also use the LONGDESC attribute to provide a link to an HTML file containing a longer description.
See the Explanation section for a detailed example.

The NAME attribute is usually used for programming purposes and it should not contain white spaces. The TITLE attribute, which may contain spaces, can be used to set a more descriptive text. In general, it is safe to use both.

 
 
Issue Explanation

Frames are mainly used for grouping information and navigation items, and displaying them with a certain page layout. However, some assistive technologies (reading browsers, screen readers, textual browsers) are not able to employ the visual layout. These tools therefore render each single frame out of context, without any reference to the other frames. The user of these tools cannot perceive the other frames and their content. That is why it is important that each frame carries within it a description that allows the user to build the context.

Names like "top", "bottom-left" that are usually adopted for frame names are not sufficiently descriptive and don't help the user in building the missing context.

Consider the following example (taken from HTML Techniques for Web Content Accessibility Guidelines 1.0 [http://www.w3.org/TR/WCAG10-HTML-TECHS/#frame-text-equivalent] and slightly modified):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<HTML>
  <HEAD>
    <TITLE>Today's news</TITLE>
  </HEAD>

  <FRAMESET cols="10%,*,10%">

  <FRAMESET rows="20%,*">
    <FRAME src="promo.html" name="promo" title="promotions">
    <FRAME src="sitenavbar.html" name="navbar" 
       title="Sitewide navigation bar" longdesc="frameset-desc.html#navbar">
  </FRAMESET>

  <FRAME src="story.html" name="story" title="Selected story - main content" 
     longdesc="frameset-desc.html#story">

  <FRAMESET rows="*,20%">
    <FRAME src="headlines.html" name="index" title="Index of other 
      national headlines" longdesc="frameset-desc.html#headlines">
    <FRAME src="ad.html" name="adspace" title="Advertising">
  </FRAMESET>

  <NOFRAMES>
    <p><a href="noframes.html">No frames version</a></p>
    <p><a href="frameset-desc.html">Descriptions of frames.</a></p>

  </NOFRAMES>

  </FRAMESET>
</HTML>

frameset-desc.html might say something like:

#Navbar - this frame provides links to the <a href="sitenavbar.html">major 
          sections of the site</a>:  World News, National News,
          Local News, Technological News,
          and Entertainment News.

#Story  - this frame displays the <a href="story.html">currently selected story</a>.

#Index  - this frame provides links to the day's 
          <a href="headlines.html">headline stories</a> within this section.  

Notice the NOFRAMES element is useful when special purpose browsers are used that do not support frames (for example on PDAs and cell phones).