Searchbox is here: Alt plus 4
Accessibility information page
|
Navigation begins here
Home (1)|Formats
Frames
Using frames has generally been discouraged since they have not been fully supported by browsers and can cause confusion if sections frequently refresh (this results in a disconcerting barrage of "loading page...load done" notifications in Window-Eyes, for example).
They can be made accessible, however, so long as they are static, follow accessiblity rules and are identified using the Title and Name tags. In fact, the use of frames can actually facilitate accessibility by allowing users to skip to specific areas on the page, such as "main content," "page navigation," "site navigation," etc.
Each frame should include explanatory text or a link to a description of its contents. In our example, this is accomplished through using a "D Link" to a description of the frame, which has a link back to the frame page using "self" as target. A link to a page containing descriptions of all the frames is also provided. That page opens in a separate window using target = "blank;" users are notified.
Code for our example and linked pages is displayed below.
Frameset Code Example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <title>Accessibility Website Frameset</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <frameset rows="10%,30%" cols="*" frameborder="yes" border="1" framespacing="1"> <frameset rows="20%,10%" framespacing="1" frameborder="yes" border="1"> <frameset cols="20%,60%"> <frame src="LogoFrame.html" name="topFrame" scrolling="NO" noresize title="TitleFrame" > <frame src="TitleFrame.html"> </frameset> <frame src="MainNavigationFrame.html"> </frameset> <frameset cols="20%,60%" frameborder="yes" border="1" framespacing="1"> <frame src="SectionNavigationFrame.html" name="leftFrame" scrolling="NO" noresize title="SectionNavigationFrame"> <frameset cols="60%,20%" framespacing="1" frameborder="yes" border="1"> <frameset rows="60%,5%"> <frame src="MainContentFrame.html" name="mainFrame" title="MainContentFrame"> <frame src="BottomNavigationFrame.html"> </frameset> <frame src="RightBufferFrame.html"> </frameset> </frameset> </frameset> <noframes><body> </body></noframes> </html>
"Main Navigation Frame" Code:
<head> <title>Main Navigation Frame</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <p>Main Navigation <a href="MainNavFrameDescription.html" tabindex="41" title="Description of Main Navigation Frame"> <u>D</u></a> <a name="MainNavigationFrame"></a> </p> </body>
"Main Navigation Frame Description" Code
<head> <title>Main Navigation Frame Description</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <p>Main Navigation--This frame provides the main navigation for the site, containing links to the Tutorial, Tags, Formats, Tools, Resources and Accessibility sections. <a href="MainNavigationFrame.html" title="Return to Main Navigation frame" target="_self" tabindex="41">Return to Main Navigation Frame</a>. Go to the <a href="FrameExplanations.html" tabindex="42" title="Explanation of frames used in the Accessibility Website frames example" target="_blank">Frames Explanations Page</a> for descriptions and links to other frames. Note: It will open in a separate window.</p> </body>
