Accessibility - Refactoring HTML: Improving the Design of Existing Web Applications - page 224

Regardless, a skip link right at the beginning is helpful. You can place this just inside or immediately preceding
the first div on the page:
<div id="header">
<a href="#main">Skip to main content</a> Blah blah blah
</div>
<a href="#main">Skip to main content</a>
<div id="header">Blah blah blah</div>
Whichever approach is more convenient for you is fine.
Some sites aren't bothered by the extra link at the top and just choose to show it to everyone. However, it's not
hard to hide if you don't like it. The simplest approach is to set the CSS display property to none :
<a href="#main" style="display: none">Skip to content</a>
Like most things CSS, this is inconsistently supported across browsers, but it's not a big deal if a browser shows
it anyway. More seriously, some screen readers may omit it, too.
The second approach is the perennial white-on-white trick (or whatever your background color happens to be).
This trick is normally used for black-hat search engine optimization, but here we use it for a good cause. For
example:
<a href="#main" style="color: white">Skip to content</a>
Again, this is not a perfect solution, but it's good enough most of the time.
My favorite variation is to make the link content a small image that matches the background color. Then place
the text, such as "Skip to main content," in the alt attribute. This way, only screen readers will see it.
<a href="#main"><img src="blank.png"
alt="Skip to main content"
width="1" height="1"/></a>
Whether you display the link or not, the key is to make sure the page has one so that blind readers can skip to
the main content. It's hard enough to listen to a page without being forced to listen to three minutes of
navigation links from a sidebar.