Herramientas de usuario
¡Esta es una revisión vieja del documento!
Tabla de Contenidos
HTML5
Básico
Evolución de elementos
Definición del DOCTYPE
<!DOCTYPE html>
Header
Representa una agrupación de elementos para la navegación.
<header> <hgroup> <h1>...</h1><h2>...</h2> </hgroup> </header>
Footer
Información de final de página. Debe contener cosas tales como el copyright, los documentos relacionados, autores…
Nav
Para indicar navegación interna a la página. Un ejemplo podría ser la tabla de contenidos de un artículo.
Aside
Para elementos que no pertenecen al contenido principal de la página, a la cabecera (header) o al pie (footer). Por ejemplo los nav.
Article
Generalmente el contenido principal de la página. Puede ser combinado con los elementos hx y mejorado con los section.
Section
Subelementos de un artículo.
Figure
Bloque para un elemento multimedia (como una imágen). Permite agregar texto.
<figure> <img src="..." /> <figcaption> some text to define the image </figcaption> </figure>
Details
Define una parte que se muestra y oculta automáticamente en respuesta a las acciones del usuario sin necesidad de implementarlo con JavaScript.
Time
Para codificar fechas y horas.
Nuevos tipos de inputs
<input type=“search”>, para búsquedas.<input type=“number”><input type=“range”>, para sliders<input type=“color”><input type=“tel”><input type=“url”><input type=“email”><input type=“date”><input type=“month”><input type=“week”><input type=“time”><input type=“datetime”><input type=“datetime-local”>
Además existe la propiedad placeholder que permite indicar un valor por defecto dentro de un cuadro de texto:
<p><label>Name: <input type="text" name="fullname" placeholder="John Ratzenberger"></label></p>
Tags y propiedades anticuados
Nueva estructura
Tags de script y de estilo
Para la tag de estilo únicamente es necesario indicar el tipo:
<style type="text/css"> h1 {color:red} p {color:blue} </style>
Elementos
Canvas
El canvas es un elemento que permite el dibujo dinámico en una página web.
Video
Geolocation
Almacenamiento en cliente
Notas
Desarrollo en JavaScript
Para facilitar el desarrollo en JavaScript existe el apartado de wrappers para HTML5.
Links
Herramientas de la página
