O Flávio usa duas <section>s dentro da <header>, existe alguma referência embasando essa estrutura semântica?
Num caso como este, eu colocaria as informações do evento e o CTA numa única <section>, ou até mesmo os deixaria soltos pois já estão dentro da <header> e sempre entendi que a <header> nada mais é do que uma <section> que é cabeçalho.
EDIT 1
Concordo que especificar as tags por valor semântico é melhor, entretanto, ao pensar em semântica, penso em SEO e no impacto positivo que um código mais semântico pode me trazer.
Me acompanhe aqui: - HTML tradicional, usando classes como .header e .footer para definir a semântica dos elementos dificultava a interpretação do código por buscadores; - HTML5 trouxe tags semânticas para que os buscadores possam interpretar melhor os sites; - Sites mais semânticos são interpretados com mais facilidade e o indexamento nos buscadores (deveria) acaba sendo melhor, trazendo benefícios em SEO; - Estes benefícios vem porque buscadores podem interpretar melhor o conteúdo do site.
Logo, se cada um escreve HTML, mesmo que seja semântico, da forma que achar melhor, voltamos ao problema inicial: Os buscadores não entendem o que aquele conteúdo significa.
Portanto, é necessário entender EXATAMENTE qual é a utilidade semântica de cada tag, para que possamos usa-las somente nos momentos corretos.
Caso minha dúvida ainda não esteja clara....
- Usamos
<header>para cabeçalhos; - Usamos
<footer>para rodapés; - Usamos
<aside>para conteúdo paralelo; - Usamos
<main>para o conteúdo principal.
O que quero entender é: quando devemos usar <section>?
De acordo com a W3S, o uso deve ser o seguinte:
Por isso meu espanto ao ver <section>s dentro de um <header>.
