HTML5 семантика: Къде принадлежи основното заглавие на съдържанието?

Всеки път, когато създавам HTML5 страница, се боря с това къде да поставя заглавието на основната страница. Всички шевове, за да се справят с това по различен начин ...

Ето ситуацията:

Да предположим, че имам уебсайт, който се нарича „Приключенията на Meo's frontend". На този сайт има страница, наречена „Abracadabra Semantics" с подзаглавие това не е важно, като "lorem ipsum delor"

Има и навигация, която е в горната част на сайта, долен колонтитул и някакво съдържание.

В HTML 4.0 бих го направил по следния начин:

- div.header
   + div.nav
   + a.siteName:  "Meo's frontend adventures"
- div.contents
   + h1.pageTitle: "Abracadabra Semantics"
   + strong.lead: "lorem ipsum delor"
   - div.cn
     + h2
     + p
     + etc..
+ div.footer 
     +ul.footerNav

Сега , в HTML5 основно всеки структурен елемент получава H1 . Къде да поставя заглавието на действителната страница?

Бих искал така:

- header
   + h1.siteName:  "Meo's frontend adventures"
   + nav
- section.contents
   - header
      -hgroup
        + h1: "Abracadabra Semantics"
        + h2: "lorem ipsum delor"
   - article
     - header
       +h1.ArcticleTitle
     + p
     + etc..
- footer
     + nav 

Не съм сигурен дали е правилно да поставете заглавието на действителната страница в главния раздел или ако трябва да е в заглавката на документа. Просто го направих по този начин от старото ми мислене в HTML4.

За мен би било по-логично да изведете го в заглавката на документа, тъй като тази страница е за тази тема. Но във всеки пример, който намерих, заглавието на страницата е в главния раздел, а заглавието на уебсайта е в заглавката.

В HTML 4 е лесно да се реши: h1 = заглавие на темата. Но не ми е толкова ясно в HTML5.

Как Google или четец на екрана определя какво е заглавието на съдържанието? Каква структура бихте използвали?