Otros elementos estructurales y de información HTML5

Los siguientes tags HTML5 han sido introducidos para mejorar la información y la estructura  ...

- details guarda información oculta, entre sus etiquetas, a través del atributo open se puede definir si es visible el contenido o no, como texto visible se utilizar la etiqueta summary, que al hacer click sobre ella mostrará la información oculta. Por el momento sólo está disponible para google crhome.

<details open="open"> 

<summary>Mostrar información</summary> 

<p>Información oculta</p> 

</details>

- figure es una etiqueta HTML5 que permite estructurar una determinada información como es el caso de imágenes, diágramas, gráficas ... en su interior, esta etiqueta va acompañada de otra etiqueta HTML5 figcaption que es utilizada como título de la información almacenada entre las etiquetas figure.

<figure> 

<figcaption>Imagen de muestra</figcaption> 

<img src="imagen.png" width="100" height="100"> 

</figure>

hgroup es una etiqueta estructural y semántica que permite ordenar contenido entre las etiquetas h1-h6, puede ser útil para utilizarla en el título de un post, portada de una noticia, para anidar artículos o secciones.

<section> 

<hgroup> 

<h1>Sección Primera</h1> 

<section> 

<h2>Subsección Primera</h2> 

</section> 

</hgroup> 

</section>

mark es una etiqueta de información, la principal función de este tag e remarcar el contenido que se encuentre en su interior, de modo que sea llamativo para el usuario.

<mark>Texto resaltado</mark>

progress es otro de los elementos que nos trae HTML5, este elemento es de información y puede ser util unido a javascript, por ejemplo para mostrar el proceso de carga de un AJAX, o un proceso de descarga o cualquier otro proceso de tiempo.

<progress value="60" min="0" max="100"></progress>