back to CATS home

Knowledge Base

Web Accessibility - Skip Navigation Link

Creating a Skip Navigation Link

INSERT INTO HTML DIRECTLY AFTER <body> TAG 


<div id="skiplinks">
<a href=“#content”>Skip to Content</a>
<!-- additional skip links here -->
</div>

 

ADD ANCHORS IN THE PLACES YOU WOULD LIKE TO TARGET WITH THE LINKS

<!-- this anchor should go immediately before the content section -->
<a name="content"></a> 

 

INSERT INTO CSS FILE

#skiplinks a {
position: absolute;
left: -9999px;
}
#skiplinks a:focus {
position: absolute;
left: 10px;
top: 10px;
background-color: white;
color: blue;
}

 

You must be logged in to save your changes.

Login