Elementos semanticos

Preview:

DESCRIPTION

HTML 5

Citation preview

Es la quinta revisión mayor del lenguaje básico de la World Wide Web, HTML. HTML 5 especifica dos variantes de sintaxis para HTML: un «clásico» HTML (text/html), la variante conocida como HTML5 y una variante XHTML conocida como sintaxis XHTML5 que deberá ser servida como XML (XHTML) (application/xhtml+xml).1 Esta es la primera vez que HTML y XHTML se han desarrollado en paralelo.

Un elemento semántico describe su significado tanto para el navegador y el desarrollador.

Ejemplos de elementos no semánticos: < div > y <span>. Le dice nada acerca de su contenido .

Ejemplos de elementos semánticos: <form > , <table> y < img>. Define claramente su contenido

HTML5 ofrece nuevos elementos semánticos para definir las diferentes partes de una página web:

<article>:Especifica el contenido independiente , autónomo. Un artículo debe tener sentido por sí misma, y debe ser posible leer de forma independiente del resto del sitio web. Ejemplos en los que se puede utilizar un elemento <article> : mensaje Foro

Post de blog

artículo de periódico

Es el elemento que representa el contenido que es relacionado con el contenido que forma el flujo principal textual de un documento.

Especifica detalles adicionales que el usuario pueda ver u ocultar bajo demanda. Se puede utilizar para crear un widget de interactiva que el usuario puede abrir y cerrar. Cualquier tipo de contenido se puede poner dentro de la etiqueta <details> . El contenido de la etiqueta <details> no debe ser visible a menos que el atributo abierta se establece.

El <figcaption> define un título para un elemento <figure> . El <figcaption> puede ser colocado como el primer o el último hijo del elemento <figure>

La etiqueta <figure> especifica el contenido en sí misma, como ilustraciones , diagramas , fotos, listados de código , etc.

La etiqueta < footer > define un pie de página de un documento.

<footer> contiene normalmente : información de autoría

información de copyright

información del contacto

mapa del sitio

La etiqueta <header > representa un contenedor para el contenido de un conjunto de enlaces de navegación . <header > contiene: Uno o más elementos de encabezado ( < h1 > - < h6 > y

< hgroup > )

Un logotipo o icono información de autoría Puede tener varias < header > elementos en un solo documento.

La etiqueta < main> especifica el contenido principal de un documento.

El contenido dentro de la etiqueta < main > debe ser único en el documento. No debe contener ningún contenido que se repite a través de documentos tales como barras laterales, enlaces de navegación , información de copyright, logos del sitio, y formularios de búsqueda.

La etiqueta <mark > define el texto marcado .

Utilice la etiqueta < mark> si quieres resaltar partes de su texto.

La etiqueta < nav > define un conjunto de vínculos de navegación.

El < nav > elemento es sólo para los principales bloques de vínculos de navegación . Los navegadores , tales como lectores de pantalla para usuarios con discapacidad , puedan utilizar este elemento para determinar si se debe omitir la prestación inicial de este contenido.

El <selection> define las secciones de un documento, como capítulos , encabezados, pies de página, o cualquier otra sección del documento.

El <summary > se define en un encabezado visible. En el título se puede hacer clic para ver / ocultar los detalles.

La etiqueta <time> define una fecha / hora legible. Este elemento también puede ser utilizado para codificar las fechas y horas de forma legible por máquina, por lo que los agentes de usuario pueden ofrecer para agregar recordatorios de cumpleaños o eventos programados para el calendario del usuario , y los motores de búsqueda pueden producir resultados de búsqueda más inteligentes.

Recommended