Skip to Local Navigation
Skip to Content
California State University, Long Beach
Disabled Student Services
Print this pageAdd this page to your favoritesSelect a small fontSelect a medium fontSelect a large font
 

What are frames?

Using frames is like having multiple web pages on one actual page. Frames are used to lessen the workload when building a page; a web page using frames takes less time to load when end users are browsing over the Internet. Alternately, most often, frames are not accessible to end users who use a screen reader. The screen reader will read the frames as multiple HTML documents and will skip around the page; thus, will not read the page in some logical order. This is why good web page designs use templates to organization the navigation structure on a web site.

Why are frames important?

Building a web site in frames can save time, for both the designer and the end user viewing the web site. Because frames "act" as separate pages, frames are generally used to load persistent content that remains consistant throughout the web site. For visually enabled users, frames may organize a page into different zones. For non-visual users, relationships between the content in frames (e.g., one frame has a table of contents, another the contents themselves) must be conveyed through other means.

Frames as implemented today (with the FRAMESET, FRAME, and IFRAME elements) are problematic for several reasons:

  • Without scripting, they tend to break the "previous page" functionality offered by browsers.
  • It is impossible to refer to the "current state" of a frameset with a URI; once a frameset changes contents, the original URI no longer applies.
  • Opening a frame in a new browser window can disorient or simply annoy users.

How do I fix this problem?

Avoid the use of frames. Screen readers read from top to bottom, left to right, and will jump from frame to frame to try to carry out the frame order rather then the logical navigation order of the content. But if you really have to use frames then follow some practical rules:

Describe the purpose of frames and how frames relate to each other if it is not obvious by frame titles alone.

frameset-desc.html might say something like:

#Navbar - this frame provides links to the major 
          sections of the site:  World News, National News,
          Local News, Technological News,
          and Entertainment News.

#Story  - this frame displays the currently selected story.

#Index  - this frame provides links to the day's 
          headline stories within this section.
  • Provide a text equivalent for every non-text element (e.g., via "alt", "longdesc", or in element content). This includes: images, graphical representations of text (including symbols), image map regions, animations (e.g., animated GIFs), applets and programmatic objects, ASCII art, frames, scripts, images used as list bullets, spacers, graphical buttons, sounds (played with or without user interaction), stand-alone audio files, audio tracks of video, and video. [Priority 1]
  • Ensure that dynamic content is accessible or provide an alternative presentation or page.

Content developers must provide text equivalents of frames so that their contents and the relationships between frames make sense. Note that as the contents of a frame change, so must change any description. This is not possible if an IMG is inserted directly into a frame. Thus, content developers should always make the source ("src") of a frame an HTML file. Images may be inserted into the HTML file and their text alternatives will evolve correctly. Unless you have a compelling reason to use frames, avoid them altogether.

If you must use frames,

  • Provide a non-frames alternative that includes navigation.
  • Title each frame to facilitate frame identification and navigation.
  • Give your frames meaningful names and titles to assist with identification and navigation.
  • Describe the purpose of the frames and how the frames relate to each other if it is not obvious by the frame titles alone.
  • Don't use frames that show only a portion of the content of that frame. Screen readers won't read information that is outside of the frame.
  • Don't use frames that show only a portion of the content of that frame. Screen readers won't read information that is outside of the frame.

Examples:

  • Frames that are not accessible
    This example shows how a page built with frames might react when a screen reader attempts to read it. Given that 1, 2, and 3 are separate frames, this example demonstrates how the content will clearly not be read in the intended order, thus eliminating its logical order for content to the end user who uses a screen reader for access to the information.

This is a picture of this web site and how it might be shown using frames.

  • Frames that are accessible
    This example shows how the page should be read by a screen reader, from top to bottom, left to right. This can easily be accomplished by designing your web pages with tables, HTML, XMTL, and cascading style sheets instead of frames.

This is a picture of this web site in the correct order that it is intended to be read and can be acomplished without frames.

* For an expanded explanation on this procedure, click here.

< Back page

Web accessibility table of contents

Next page >