HTML5 – Nuevas etiquetas

Como sabemos, HTML5 es una nueva versión de HTML (lenguaje de marcado de hipertexto). HTML5 introdujo muchas etiquetas nuevas que beneficiarán a muchos desarrolladores. Estas etiquetas generalmente son compatibles con todos los principales navegadores. Estas etiquetas pertenecen a muchos aspectos, como gráficos, medios y formularios.

Lista de todos los elementos introducidos en HTML5:

• Etiqueta <article> : La etiqueta <article> es uno de los nuevos elementos de sección en HTML5. La etiqueta HTML <article> se utiliza para representar un artículo. Más específicamente, el contenido dentro de la etiqueta <article> es independiente del resto del contenido del sitio (aunque puede estar relacionado).
• Etiqueta <aside> : La etiqueta <aside> se utiliza para describir el objeto principal de la página web de forma más breve, como un resaltador. Básicamente, identifica el contenido relacionado con el contenido principal de la página web, pero no constituye la intención principal de la página principal. La etiqueta <aside> contiene principalmente información del autor, enlaces, contenido relacionado, etc.
• Etiqueta <audio> : La etiqueta <audio> se utiliza para insertar un audio en una página web HTML.
• Etiqueta <canvas> : La etiqueta <canvas> en HTML se usa para dibujar gráficos en una página web usando JavaScript. Se puede usar para dibujar rutas, cuadros, textos, degradados y agregar imágenes. Por defecto, no contiene bordes ni texto.
• Etiqueta <comando>: La etiqueta <comando> define un botón de comando, se invoca según la acción del usuario. El botón de etiqueta <comando> se utiliza en un tipo especial de operación. La etiqueta <command> solo es compatible con Internet Explorer.
• Etiqueta <datalist> : La etiqueta <datalist> se utiliza para proporcionar la función de autocompletar en los archivos HTML. Se puede usar con una etiqueta de entrada para que los usuarios puedan completar fácilmente los datos en los formularios usando seleccionar los datos.
• Etiqueta <detalles> : La etiqueta <detalles> se utiliza para el contenido/información que inicialmente está oculta pero que podría mostrarse si el usuario desea verla. Esta etiqueta se utiliza para crear un widget interactivo que el usuario puede abrir o cerrar. El contenido de la etiqueta de detalles es visible al abrir los atributos establecidos. La etiqueta <summary> se usa con la etiqueta <detail>s para especificar un encabezado visible.
• Etiqueta <embed> :   La etiqueta <embed> en HTML se usa para incrustar aplicaciones externas que generalmente son contenido multimedia como audio o video en un documento HTML. Se utiliza como contenedor para incrustar complementos, como animaciones flash. Esta etiqueta es una etiqueta nueva en HTML 5 y solo requiere una etiqueta de inicio.
• Etiqueta <figure> : La etiqueta <figure> en HTML se usa para agregar contenido independiente como ilustraciones, diagramas, fotos o listas de códigos en un documento. Está relacionado con el flujo principal, pero se puede usar en cualquier posición de un documento y la figura va con el flujo del documento y, si se elimina, no debería afectar el flujo del documento. Esta etiqueta es nueva en HTML5.
• Etiqueta <footer> : La etiqueta <footer> en HTML se utiliza para definir un pie de página de un documento HTML. Esta sección contiene la información de pie de página (información del autor, información de derechos de autor, proveedores, etc.). La etiqueta de pie de página se utiliza dentro de la etiqueta del cuerpo. La etiqueta <footer> es nueva en HTML5. Los elementos de pie de página requieren una etiqueta de inicio y una etiqueta de finalización.
• Etiqueta <header> : La etiqueta <header> contiene información relacionada con el título y el encabezado del contenido relacionado. El elemento <header> generalmente contiene el encabezado de la sección (un elemento h1-h6 o un elemento <hgroup>), pero esto no es obligatorio. El elemento <header> también se puede usar para envolver la tabla de contenido de una sección, un formulario de búsqueda o cualquier logotipo relevante. La etiqueta <header> es una etiqueta nueva en HTML5 y requiere una etiqueta inicial y una etiqueta final. Puede haber varios elementos <header> en un documento. Una etiqueta <header> no se puede colocar dentro de un <footer>, <address> u otro elemento <header>.
• Etiqueta <hgroup> : La etiqueta <hgroup> en HTML significa grupo de encabezado y se usa para agrupar los elementos del encabezado. La etiqueta <hgroup> en HTML se usa para envolver uno o más elementos de encabezado de <h1> a <h6>, como los encabezados y subtítulos. La etiqueta <hgroup> requiere la etiqueta inicial y la etiqueta final.
• Etiqueta <keygen> : La etiqueta <keygen> en HTML se utiliza para especificar un campo generador de pares de claves en un formulario. El propósito del elemento <keygen> es proporcionar una forma segura de autenticar a los usuarios. Cuando se envía un formulario, se generan dos claves, una clave privada y una clave pública. La clave privada se almacena localmente y la clave pública se envía al servidor. La clave pública se utiliza para generar un certificado de cliente para autenticar a un usuario para el futuro.
• Etiqueta <mark> : La etiqueta <mark> en HTML se utiliza para definir el texto marcado. Se utiliza para resaltar la parte del texto en un párrafo. La etiqueta <mark> es nueva en HTML5.
• Etiqueta <meter> : se utiliza para definir la escala de medición en un rango bien definido y también admite un valor fraccionario. También se conoce como calibre. Se utiliza en uso de disco, resultado de consulta de relevancia, etc.
• Etiqueta <nav> : La etiqueta <nav> se utiliza para declarar la sección de navegación en documentos HTML. Los sitios web suelen tener secciones dedicadas a enlaces de navegación, lo que permite a los usuarios navegar por el sitio. Estos enlaces se pueden colocar dentro de una etiqueta de navegación. En otras palabras, el elemento nav representa una sección de la página cuyo propósito es proporcionar enlaces de navegación, ya sea en el documento actual o en otro documento. Los enlaces en el elemento de navegación pueden apuntar a otras páginas web o a diferentes secciones de la misma página web. Es un elemento semántico. Ejemplos comunes de elementos de navegación son menús, tablas, contenidos e índices.
• Etiqueta <output> : La etiqueta <output> en HTML se usa para representar el resultado de un cálculo realizado por el script del lado del cliente, como JavaScript. La etiqueta <output> es una etiqueta nueva en HTML5 y requiere una etiqueta de inicio y fin.
• Etiqueta <progreso> : Se utiliza para representar el progreso de una tarea. También se define cuánto trabajo se realiza y cuánto queda para descargar una cosa. No se utiliza para representar el espacio en disco o la consulta relevante.
• Etiqueta <ruby> : La etiqueta <ruby> en HTML se usa para especificar la anotación de ruby, que es un texto pequeño, adjunto al texto principal para especificar el significado del texto principal. Este tipo de anotación se utiliza en publicaciones japonesas.
• Etiqueta <section> : La etiqueta < section> define la sección de documentos como capítulos, encabezados, pies de página o cualquier otra sección. La etiqueta de sección divide el contenido en secciones y subsecciones. La etiqueta de sección se utiliza cuando se necesitan requisitos de dos encabezados o pies de página o cualquier otra sección de documentos. La etiqueta <section> agrupaba el bloque genérico de contenidos relacionados. La principal ventaja de la etiqueta de sección es que es un elemento semántico que describe su significado tanto para el navegador como para el desarrollador.
• Etiqueta <time> : La etiqueta <time> se utiliza para mostrar la fecha/hora legible por humanos. También se puede utilizar para codificar fechas y horas en un formato legible por máquina. La principal ventaja para los usuarios es que pueden ofrecer agregar recordatorios de cumpleaños o eventos programados en sus calendarios y los motores de búsqueda pueden producir resultados de búsqueda más inteligentes.
• Etiqueta <wbr> : La etiqueta <wbr> en HTML significa oportunidad de salto de palabra y se utiliza para definir la posición dentro del texto que el navegador trata como un salto de línea. Se usa principalmente cuando la palabra usada es demasiado larga y hay posibilidades de que el navegador rompa líneas en el lugar equivocado para ajustar el texto.
• Etiqueta <video> : la etiqueta <video> se usa para incrustar contenido de video en un documento, como un clip de película u otras secuencias de video.