Fixing a broken skip nav accessibility error

The Ohio State navbar contains a hidden skip nav link that jumps to an anchor called “page-content”.  This skip link is hidden visually (through CSS) but available for those using screen readers to use to skip the other Ohio State navbar links and go straight to a page’s content.  A review by the WAVE tool will report if the skip nav anchor is missing from a page. To correct a broken skip nav link, add an anchor near the start of your page’s main content. Here are some examples of possible anchors:

  • <a name=”page-content” id=”page-content”> – The ‘name’ attribute works in HTML 4 and the ‘id’ attribute in HTML 5.
  • <div id=”page-content”>  – In HTML 5 the ‘id’ attribute can be placed in a lot of different elements, such as a <div> or <main>.

Some more information about using anchors in HTML is available from W3 Schools. See the info about the HTML <a> name Attribute.

The WebAIM organization has some more information about “Skip Navigation” Links in their site.