Sections: elemento nav – Parte 2

Se você não leu o primeiro artigo da série, é interessante que o faça agora. O elemento nav representa uma seção da página que contém link para outras páginas ou partes do mesmo website. Resumindo: nav é uma seção de links de navegação. Essa definição é muito mais complexa do que se imagina. A tag

Se você não leu o primeiro artigo da série, é interessante que o faça agora.

O elemento nav representa uma seção da página que contém link para outras páginas ou partes do mesmo website. Resumindo: nav é uma seção de links de navegação.

Essa definição é muito mais complexa do que se imagina. A tag nav pode agrupar uma série de elementos que anteriormente faríamos com div. Nem todos os grupos de links da página precisam ser um elemento nav, mas apenas as seções que consitem em blocos principais. Imagine uma sidebar (agora descrito com a tag aside) com uma série de links, como por exemplo uma sidebar de um portal como o G1, R7, UOL e etc… Nestas sidebars é normal você encontrar os diversos links das diversas categorias de assuntos. Anteriormente, se quiséssemos agrupar por exemplo um Título e uma lista de links faríamos assim:

Resolvia nosso problema de formatação. Poderíamos utilizar div que envolve o título e a lista para fazer algum detalhe visual e etc. Mas a nível de informação, não havia nenhuma indicação de que o título estivesse ligado ao conteúdo. Não há nenhuma referência de que o título ESPORTE apresenta a lista de links sobre esporte abaixo. Os sistemas de busca não podem se basear apenas na posição dos elementos, é algo muito genérico para eles confirmarem que a lista e o título que a precede estão ligados em um mesmo assunto.

Com o HTML5, isso muda. Veja o código abaixo:

Com a tag nav, há uma indicação de que aquele grupo é uma seção (nav é um tipo de section. Enquanto a tag section serve para indicar seções no site, a tag nav indica que um determinado grupo é uma seção de navegação) é um bloco de navegação.

Dentro da nav você pode agrupar uma série de listas de links.

A tag nav também pode estar em todos os elementos do HTML. Você pode colocá-la no header para definir menus, no footer para definir grupos de links, sidebars, articles e etc.

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *