Cando usar o elemento SECCIÓN HTML5

E cando usar ARTICLE, ASIDE e DIV

O novo elemento SECCIÓN HTML5 pode ser algo confuso. Se estivo a construír documentos HTML antes de HTML5, é probable que xa estea a usar o elemento para crear divisións estruturais dentro das súas páxinas e, despois, estea as páxinas con elas. Polo tanto, pode parecer algo natural simplemente substituír os elementos DIV existentes cos elementos SECTION. Pero isto é técnicamente incorrecto. Entón, se non simplemente substitúe elementos DIV con elementos SECCIÓN, como usalos correctamente?

O elemento SECTION é un elemento semántico

O primeiro que hai que entender é que o elemento SECTION é un elemento semántico . Isto significa que proporciona significado a ambos os axentes de usuário e aos humanos sobre o contido pechado que é específicamente unha sección do documento.

Isto pode parecer unha descrición semántica moi xeral, e iso é porque o é. Existen outros elementos HTML5 que proporcionan máis distincións semánticas ao teu contido que debes usar antes de utilizar o elemento SECTION:

Cando usar o elemento SECTION

Utiliza o elemento ARTICLE cando o contido é unha parte independente do sitio que pode quedar só e ser sindicada como un artigo ou publicación no blog. Use o elemento ASIDE cando o contido se relaciona de forma tanxente co contido da páxina ou co propio sitio web, como as barras laterais, as anotacións, as notas ao pé ou a información do sitio asociada. Use o elemento NAV para o contido que é a navegación.

O elemento SECTION é un elemento semántico xenérico. Úsalo cando ningún dos outros elementos semánticos dos contedores son axeitados. Úsalo para combinar partes do documento xuntas en unidades discretas que pode describir de maneira relacionada. Se non pode describir os elementos da sección nunha ou dúas frases, probablemente non debería usar o elemento.

En cambio, debes usar o elemento DIV. O elemento DIV en HTML5 é un elemento contedor non semántico. Se o contido que está a tentar combinar non ten un significado semántico, pero aínda cómpre combinalo para o estilo, entón o elemento DIV é o elemento axeitado para usar.

Como funciona o elemento SECTION

Unha sección do documento pode aparecer como o contedor exterior para artigos e elementos ASIDE. Tamén pode conter contido que non forma parte dun ARTIGO ou ASIDE. Tamén se pode atopar un elemento SECTION dentro dun ARTÍCULO, NAV ou ASIDE. Podes incluso nestar seccións para indicar que un grupo de contido é unha sección doutro grupo de contido que é unha sección dun artigo ou da páxina no seu conxunto.

O elemento SECTION crea elementos dentro dun contorno do documento. E como tal, sempre debe ter un elemento de cabeceira (H1 a H6) como parte da sección. Se non podes atopar un título para a sección, entón de novo o elemento DIV é probablemente máis apropiado. Lembre, se non quere que o título da sección apareza na páxina, sempre pode enmascaralo con CSS.

Cando non usar o elemento SECTION

Máis alá do consello anterior para usar os elementos semánticos máis específicos en primeiro lugar, hai unha área definida que non debería usar o elemento SECTION: só para estilo.

Noutras palabras, se o único motivo polo que está a poñer un elemento nese lugar é achegar propiedades de estilo CSS, non debería usar un elemento SECTION. Atopar un elemento semántico ou usar o elemento DIV no seu lugar.

En definitiva non pode importar

Unha dificultade para escribir o HTML semántico é que o que é semántico pode ser absurdo para ti. Se pensas que podes xustificar a utilización do elemento SECTION nos teus documentos, debes usalo. A maioría dos axentes de usuário non lles importa e mostrará a páxina como podería esperar se desexa crear un DIV ou unha SECCIÓN.

Para os deseñadores que desexen ser semánticamente correctos, é importante o uso do elemento SECTION dunha forma semánticamente válida. Para os diseñadores que só queren que as súas páxinas funcionen, isto non é tan importante. Eu creo que escribir HTML semánticamente válido é unha boa práctica e mantén as páxinas máis protexidas no futuro. Pero ao final depende de ti.