html - How to properly use h1 in HTML5

Question

Which of the following is the correct way to structure a page:

1) h1 only in header

<header>
    <h1>Site title</h1>
    <nav>...</nav>
</header>
<section>
    <h2>Page title</h2>
</section>

If I use h1 exclusively inside header as the site's title, every page will have the same content for the h1 tag. That doesn't seem very informative.

---

2) h1 in header and section, for both site and page title

<header>
    <h1>Site title</h1>
    <nav>...</nav>
</header>
<section>
    <h1>Page title</h1>
</section>

I've also seen examples of using h1 more than once, in both header and section tags. However, isn't it wrong to have two titles for the same page? This example shows multiple header and h1 tags http://orderedlist.com/resources/html-css/structural-tags-in-html5/

---

3) h1 only in section, emphasizing the page title

<header>
    <p>Site title</p>
    <nav>...</nav>
</header>
<section>
    <h1>Page title</h1>
</section>

Lastly, W3 seems to recommend using h1 within the main section element, does that mean I shouldn't use it in the header element?

Sections may contain headings of any rank, but authors are strongly encouraged to either use only h1 elements, or to use elements of the appropriate rank for the section's nesting level.

Answer 1

As I state in my comment and you quote in the W3C, h1 is a heading and not a title. Each sectioning element can have its own heading element(s). You cannot think of h1 as being the title of a page only but as the heading of that particular section of the page. Just like the front page of a newspaper, each article can have its own heading (or title).

Here is a good article on this.