Читать книгу El gran libro de HTML5, CSS3 y Javascript - Diego Gauchat Juan - Страница 30

La etiqueta <figure> fue creada para ser declarar el contenido del documento de una forma más específica. Antes de que fuera introducido este elemento, no era posible identificar el contenido que formaba parte de la información, sino el que era independiente, por ejemplo, ilustraciones, fotos, videos, etc. Por lo general, esos elementos forman parte de los contenidos relevantes pero pueden ser removidos sin afectar o interrumpir el flujo de un documento. Cuando este tipo de información está presente, puede ser identificada con las etiquetas <figure>.

Código 1-20

Uso de los elementos <figure> y <figcaption>.

En el Código 1-20, insertamos en la primera entrada una imagen (<img src=“http://www.minkbooks.com/content/myimage.jpg”>) después del texto del mensaje. Ésta es una práctica habitual, pues a menudo el texto está enriquecido con imágenes o videos. Las etiquetas <figure> nos permiten encerrar estos elementos visuales y diferenciarlos de la información más relevante.

También en el Código 1-20 se encuentra un elemento adicional dentro del elemento <figure>. Por lo general, las unidades de información como imágenes o vídeos vienen acompañadas de un breve texto, normalmente ubicado bajo ellas, que las describe. HTML5 aporta un elemento para ubicar e identificar esta leyenda descriptiva. Las etiquetas <figcaption> encierran la leyenda relacionada con el elemento <figure> y establecen una relación entre ambos elementos y su contenido.