HTML Document markup for accessibility

Question

I was wondering about a proper way of structuring a document-like html page. It's obvious that the title of the page should be marked as <h1> and section headings as <h2> .

As for the footer, right now, I have:

<div id="footer">Footer content</div>

and this will be displayed in every page of the document. I realized that screen reader will not notify the users if it's reading the footer content. I feel that uses should have the option to skip reading the footer content.

Is it necessary to let screen reader announce that it's going to read the footer content and is there a proper way to do so?

Thanks!

Answer 1

A common way to allow screen readers to skip over repeated parts of your website are to include hidden a anchor to a position right after the element you'd like to skip.

For example, on one of our websites, we do this to allow skipping over our navigation bar.

<div id="navbar">
  <a title="Skip Navigation" href="#skipnav"></a>
  <a href="/"><img id="home" src="transparent.gif" alt="Home" /></a>
  ...
</div>
<a id="skipnav"></a>

The "Skip Navigation" a is selectable by using the keyboard and the screen reader will read "Skip Navigation". The user can then "click" on it to jump later into the page. In this case, right after the navigation.

Answer 2

Can you use html5? If so it contains a <footer> tag.

Answer 3

I'm a screen reader user and the h1 and h2 headings will work well. There's no good way to allow a screen reader to skip certain text that I know of which will work with all screen readers and browsers. Assuming your content is something like the following though

<h1>title</h1>
<h2>section1</h2>
section content
<div id="footer">Footer content</div>
<h2>section2</h2>
section 2 content
<div id="footer">Footer content</div>

A screen reader user should be able to figure out they hit the footer again after hearing it the first time. They can then use quick navigation keys provided by all modern screen readers to skip to the next heading thus not listening to the footer again.