E finalmente, depois muita discussão, a nova tag do HTML foi lançada. A discussão envolvia o real motivo de ter ou não uma nova tag para definir o conteúdo principal do documento. O Ian Hickson – mestre dos mestres do HTML – era contra essa nova tag. Aqui tem uma entrevista com ele, muito interessante, onde há uma parte que ele explica o motivo de não querer essa nova tag.
A tag MAIN tem uma única função semântica: definir o conteúdo principal da página ou da aplicação. Ele representa o conteúdo mais importante da página, que está diretamente relacionado ao tópico central do documento ou a funcionalidade principal de uma aplicação.
The main element represents the main content section of the body of a document or application. The main content section consists of content that is directly related to or expands upon the central topic of a document or central functionality of an application.
Por exemplo:
<main> <h1>Skateboards</h1> <p>The skateboard is the way cool kids get around</p> <article> <h2>Longboards</h2> <p>Longboards are a type of skateboard with a longer wheelbase and larger, softer wheels.</p> <p>... </p> <p>... </p> <h2>Electric Skateboards</h2> <p>These no longer require the propelling of the skateboard by means of the feet; rather an electric motor propels the board, fed by an electric battery.</p> <p>... </p> <p>... </p> </article> </main>
O MAIN não pode ser filho de elementos como aside, article, footer, header ou nav. A tag MAIN não é um elemento de seção de conteúdo e ele não afeta o fluxo do documento. Ou seja, ele não tem margin, padding, borda ou qualquer outro valor padrão.
É muito recomendado que utilizemos o ARIA role=”main” para que usar agents implementem esse mapeamento.
Um detalhe importante: você não pode colocar mais do que UMA tag main no seu documento. Claro, por motivos óbvios.
Já vale a pena usar
Já. Embora nenhum navegador ainda tenha suporte oficial, o elemento não provoca nenhum problema no layout. Então eu aconselho atualizar seu código assim que puder. Quando os browsers suportarem, seu código já estará atualizado. Outra motivo é a adesão.
Se acontecer alguma coisa e a galera voltar atrás, é simples de arracar o elemento de lá. Sem chororo. 😉
Link para a documentação oficial.