HTML5 – Etiqueta Section

Después de explicar el elemento article en el articulo anterior, hoy intentaré explicar lo mejor posible el elemento section.

Según nos define el W3C:

El elemento sectión representa un agrupamiento de contenido con la misma temática dentro de un documento o aplicación. Una sección, en este contexto, es un grupo temático de contenido, con su cabecera y, en ocasiones, con un footer. Ejemplos de secciones podrían ser capítulos de un libro, el contenido de cada una de las pestaña de una aplicación, o el número de secciones de una tesis.

Tag Section – whatwg

Por lo tanto el elemento section se refiere a un conjunto de elementos o contenido que tengan una misma temática. Para mi, se deberá utilizar para contener un conjunto de elementos con un mismo sentido temático y con una relación semántica con los elementos que le rodean.

[html]

Deportes

Un gran pasatiempo

Los deportes son un gran pasatiempo para la gente.

Fútbol

El fútbol es un deporte de equipo en la que juegan 2 equipos de 11 jugadores con una pelota de forma esférica. Es el deporte más popular…

Baloncesto

Deporte que se juega entre dos equipos de cinco jugadores cada uno, (en un campo reglamentario), en el que botando una pelota, tratan de acercarse a un aro …

[/html]

En este ejemplo, podemos ver un artículo donde se habla de deportes, en él se explican los distintos deportes. Incluimos la definición de cada uno de los deportes dentro de una sección porque se trata de un contenido con una misma temática, en este caso, la explicación de que es cada uno de los deportes.

Otro ejemplo podría ser la página de inicio de una Web, la cual podríamos dividir en distintas secciones con una misma temática, como serían la introducción, un grupo de noticias sobre el mismo tema o la información de contacto.

[html]

Mi Blog

Contando nuestras historias

¿Quienes somos?

Somos un grupo de amigos dedicados a contar las cosas que nos ocurren diariamente.

Historias de Actualidad/h1>

Hoy en el mundo

Hoy celebramos las conmemoración de dos echos muy tristes en la historia de los últimos años…

Contacta con Nosotros

Si quieres contactar con nosotros, hazlo a través de Facebook, Twitter o correo electrónico


[/html]

Una recomendación que hace el WHATWG y el W3C, es que por norma general el elemento section cominece con un elemento h1 y una seccion de cabecera. De manera, que si vemos que esta cabcera no es necesaria a lo mejor deberiamos utilizar un elemento div.

Otro dato a tener en cuenta, es que no debemos utilizar el elemento section como un contenedor genérico, ya que ese no es su propósito. Si deseamos incluir una animación o únicamente deseamos darle unos estilos a un elemento, debemos seguir utilizando el elemento div. Tampoco debemos utilizarlo si en su lugar se pueden utilizar los elementos article, aside o nav.

Espero que haya quedado más o menos claro el uso de la etiqueta section. Después de buscar mucha información sobre este elemento, me he dado cuenta que existe muchísima controversia en relación a su uso y sobre cuando utilizar el elemento article o el elemento section.