Este documento resume las principales características de HTML5, incluyendo nuevas etiquetas para estructurar documentos, tipos de entrada de formularios, gráficos mediante Canvas y SVG, reproducción de audio y video, almacenamiento local y APIs asociadas para crear aplicaciones web. HTML5 define la estructura mientras que CSS3 se encarga de la presentación. El documento también discute brevemente las futuras mejoras planeadas para HTML5.
2. Una evolución de HTML 4 y DOM2. Redefinición de las etiquetas de marcado Formalización de APIS para la ayuda al desarrollo de Aplicaciones Web W3C Working Draft 24 June 2010 http://www.w3.org/TR/html5/ ¿Qué es HTML 5?
4. Nuevas etiquetas y atributos HTML APIs asociadas para ayudar a crear Aplicaciones Web No todo es HTML5 Audio y Video Edición en línea Aplicaciones Offline Histórico Drag & Drop Geolocalización API 2D con Canvas Almacenamiento Local Web Workers Web Sockets API Web Socket Protocol Mensajería
6. HTML 4.01 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> HTML 5 <!DOCTYPE HTML> Un único y simple DOCTYPE
7. Abandonar el uso de tablas y div para la maquetación de la página. Nuevas etiquetas: Estructurar un documento HEADER SECTION ARTICLE ASIDE FOOTER NAV FIGURE DIALOG
8. HTML5 incluye nuevas etiquetas para identificar datos como las fechas, cantidades o realizar énfasis en palabras o textos: MARK, TIME, METER y PROGRESS También se incluyen etiquetas para la publicación y manejo de datos: DATAGRID, DETAILS y DATALIST Otras etiquetas
9. Nuevos tipos para la etiqueta input: HTML Forms 2.0 datetime datetime-local date month week time number range email url Nuevos atributos: required, placeholder, list
10. Basefont, big, center, font, s, strike, tt y u Frame, frameset y noframes acronym, applet, isindex, dir Etiquetas no soportadas
20. Creación de gráficos vectoriales bidimensionales Integrado con XHTML, DOM, CSS, XSL y SMIL (animaciones) Tipos de objetos Formas gráficas Imágenes Textos SVG (Scalable Vector Graphics)
21. Inclusión del gráfico SVG en el navegador Embebido en el código HTML o XHTML (<svg>) Apertura del documento SVG (*.svg) Como imagen en CSS Usando el objeto object Usando imgo embed SVG (Scalable Vector Graphics) <?xmlversion="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svgwidth="100%" height="100%" version="1.1« xmlns="http://www.w3.org/2000/svg"> <rect x="20" y="20" rx="20" ry="20" width="250" height="100" style="fill:red;stroke:black;stroke-width:5;opacity:0.5"/> </svg>
22. Nueva etiqueta HTML5 para la generación dinámica de gráficos a través de la API Canvas 2D API API para la generación de Gráficas, animaciones, juegos, etc… Aceleración por hardware en IE9 utilizando la GPU CANVAS
25. Las etiquetas audio y video permiten incorporar audio y video en páginas HTML Admiten etiquetas para arrancar al inicio, ejecutarse en bucle y mostrar controles Se admiten múltiples fuentes para asegurar la visualización en todos los navegadores API para el acceso a los elementos y poder manipularlos Audio y Video
29. Permitir almacenar datos estructurados en el lado del cliente de forma «semejante» a las cookies HTTP Los datos se almacenan como un listado de pares clave/valor Con sessionStorage Almacenamiento durante la sesión de la página Con localStorage Almacenamiento compartido entre múltiples páginas y sesiones, restringido al dominio. Almacenamiento local
31. En cada actualización se adoptan nuevas características de HTML 5 WebGL: API 3D para CANVAS Acceso a dispositivos Webcam, micrófonos, almacenamiento externo API para el trabajo con audio Manipular, analizar y generar Mejoras en videos: Streaming TouchScreen … ¿FUTURO?