Friday, 8 July 2011

Adding accessibility 'skip to' links

<div id="accessibility">
<a href="#skiptonavigation" accesskey="n">Skip to navigation</a>
<a href="#skiptocontent" accesskey="c">Skip to content</a>
</div>

<a name="skiptocontent"></a>


#accessibility {display: absolute; }
#accessibility a
{
position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
}
#accessibility a:focus
{
position:static;
width:auto;
height:auto;
}

from http://webaim.org/techniques/css/invisiblecontent/

No comments:

Post a Comment