WebAIM - Web Accessibility In Mind

E-mail List Archives

RE: Skip navigation and frames

for

From: Zwack, Melanie
Date: Sep 5, 2002 9:39AM


On the web site below:
http://www.whitehousedrugpolicy.gov/about/index.html
<http://www.whitehousedrugpolicy.gov/about/index.html>;

If you hover on the top mast between the seal on the left, and the "About
ONDCP" on the Main mast, you can see the URL with #skipnav, if you select
(click on this) this it will take you right below the navigation buttons.

We did this by making a 1 pixel width sliver in the mast in the content
frame part of the page and put an anchor around this to link to the object
of the ancher placed right below the navigation buttons.

The code is shown below:



<title>About - ONDCP</title>

<body marginheight="0" topmargin="0" leftmargin="0" marginwidth="0"
text="#333333" link="#330099" vlink="#330099" alink="#330099"
bgcolor="#ffffff">

</head>


<table border="0" cellspacing="0" cellpadding="0" width="516" valign="top">
<tr valign="top">

<td width="516" align="left" valign="top"><a href="#skipnav"><img
src="../images/mast_xpix_blue.jpg" width="1" height="89" alt="Skip
Navigation" border="0"></a><img src="../images/mast_about2.jpg" width="430"
height="89" alt="About" border="0"><img src="../images/rnav_red.jpg"
width="85" height="89" alt="About ONDCP" border="0" vspace="0" hspace="0"
usemap="#right_nav"><br>

<table cellpadding="1" cellspacing="0" border="0" width="516">
<tr>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/index.html>;
http://www.whitehousedrugpolicy.gov/index.html" target="_top"><img src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_home_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_home_button.gif" width="72"
height="30" alt="ONDCP Web Site" border="0" vspace="0" hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/about/index.html>;
http://www.whitehousedrugpolicy.gov/about/index.html" target="_top"><img
src=" <http://www.whitehousedrugpolicy.gov/images/ondcp_about_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_about_button.gif"
width="72" height="30" alt="About ONDCP" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/news/index.html>;
http://www.whitehousedrugpolicy.gov/news/index.html" target="_top"><img
src=" <http://www.whitehousedrugpolicy.gov/images/ondcp_news_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_news_button.gif" width="72"
height="30" alt="News and Public Affairs" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/policy/index.html>;
http://www.whitehousedrugpolicy.gov/policy/index.html" target="_top"><img
src=" <http://www.whitehousedrugpolicy.gov/images/ondcp_policy_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_policy_button.gif"
width="72" height="30" alt="Policy" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/drugfact/index.html>;
http://www.whitehousedrugpolicy.gov/drugfact/index.html" target="_top"><img
src=" <http://www.whitehousedrugpolicy.gov/images/ondcp_facts_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_facts_button.gif"
width="72" height="30" alt="Drug Facts" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/publications/index.html>;
http://www.whitehousedrugpolicy.gov/publications/index.html"
target="_top"><img src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_pubs_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_pubs_button.gif" width="72"
height="30" alt="Publications" border="0" vspace="0" hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/links/index.html>;
http://www.whitehousedrugpolicy.gov/links/index.html" target="_top"><img
src=" <http://www.whitehousedrugpolicy.gov/images/ondcp_links_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_links_button.gif"
width="72" height="30" alt="Related Links" border="0" vspace="0"
hspace="0"></a></td>
</tr>
<tr>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/prevent/index.html>;
http://www.whitehousedrugpolicy.gov/prevent/index.html" target="_top"><img
src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_prevention_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_prevention_button.gif"
width="72" height="30" alt="Prevention" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/treat/index.html>;
http://www.whitehousedrugpolicy.gov/treat/index.html" target="_top"><img
src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_treatment_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_treatment_button.gif"
width="72" height="30" alt="Treatment" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/science_tech/index.html>;
http://www.whitehousedrugpolicy.gov/science_tech/index.html"
target="_top"><img src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_science_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_science_button.gif"
width="72" height="30" alt="Science and Technology" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/enforce/index.html>;
http://www.whitehousedrugpolicy.gov/enforce/index.html" target="_top"><img
src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_enforcement_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_enforcement_button.gif"
width="72" height="30" alt="Enforcement" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/statelocal/index.html>;
http://www.whitehousedrugpolicy.gov/statelocal/index.html"
target="_top"><img src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_state_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_state_button.gif"
width="72" height="30" alt="State and Local" border="0" vspace="0"
hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/international/index.html>;
http://www.whitehousedrugpolicy.gov/international/index.html"
target="_top"><img src="
<http://www.whitehousedrugpolicy.gov/images/ondcp_intl_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_intl_button.gif" width="72"
height="30" alt="International" border="0" vspace="0" hspace="0"></a></td>
<td align="left" valign="top"><a href="
<http://www.whitehousedrugpolicy.gov/funding/index.html>;
http://www.whitehousedrugpolicy.gov/funding/index.html" target="_top"><img
src=" <http://www.whitehousedrugpolicy.gov/images/ondcp_fund_button.gif>;
http://www.whitehousedrugpolicy.gov/images/ondcp_fund_button.gif" width="72"
height="30" alt="Funding" border="0" vspace="0" hspace="0"></a></td>
</tr>
</table>



<blockquote>


<font size="2" face="arial, helvetica, sans-serif">


<!-- Content begins-->
<a name="skipnav"><img src="
<http://www.whitehousedrugpolicy.gov/images/clear.gif>;
http://www.whitehousedrugpolicy.gov/images/clear.gif" width="1" height="1"
alt="Start of Main Content" border="0"></a><br>



<p>The White House Office of National Drug Control Policy (ONDCP), a
component of the Executive Office of the President, was <a
href="legislation.html" target="_top">established</a> by the Anti-Drug Abuse
Act of 1988. </p>





The skip nav code is shown below:
<a href="#skipnav"><img src="../images/mast_xpix_blue.jpg" width="1"
height="89" alt="Skip Navigation" border="0"></a>

The code for the object of the anchor is shown below and is placed below the
navigation buttons:
<a name="skipnav"><img src="
<http://www.whitehousedrugpolicy.gov/images/clear.gif>;
http://www.whitehousedrugpolicy.gov/images/clear.gif" width="1" height="1"
alt="Start of Main Content" border="0"></a>




I've heard some people do this with an image map, but I've heard that
doesn't work.