Post Actualizado en julio 25, 2013


HTML5, todo lo que necesitas saber para diseñar tu web

En ocasiones anteriores hemos compartido artículos sobre diseño básico web, optimización de sitios en HTML y consejos básicos de maquetación web. Una de las últimas tecnologías del diseño web es la última versión del lenguaje marcador de hipertexto, HTML5. En el Html5 se incluyen una serie de nuevos elementos y atributos como <canvas>, <footer> o los […]

En ocasiones anteriores hemos compartido artículos sobre diseño básico web, optimización de sitios en HTML y consejos básicos de maquetación web. Una de las últimas tecnologías del diseño web es la última versión del lenguaje marcador de hipertexto, HTML5.
En el Html5 se incluyen una serie de nuevos elementos y atributos como <canvas>, <footer> o los bloques de navegación <nav>. Algunas de las etiquetas de la nueva versión de HTML han sido modificadas e incluso eliminadas.
html5 diseño web

 

Cuáles son las novedades del HTML5 y cómo podemos aplicarlas a una web?
El HTML5 trae consigo un diseño dinámico, responsive, rápido y más seguro. Es por eso del cambio o adaptación de esta nueva tecnología en el diseño de nuestros sitios. Las combinaciones de HTML5 y CSS3 traen una seria de nuevas funciones y efectos que vienen a sustituir algunos elementos creados por Flash anteriormente, los cuales causaban problemas de navegación en la web.
La aplicación de esta nueva versión del marcador de hipertexto se basan en vectores, graficos 2 y 3D, animaciones y multimedia.
Aquí tenemos un ejemplo de un dibujo con la API de canvas y ver cómo funcionan las nuevas etiquetas del HTML5: http://www.desarrolloweb.com/articulos/dibujo-api-canvas.html .Además, también se han incluido nuevas etiquetas usadas para formularios como METER, PROGRESS, KEYGEN y OUTPUT.
Elementos de la web semántica en HTML5.
La Web Semántica se ocuparía de resolver estas deficiencias. Para ello dispone de tecnologías de descripción de los contenidos, como RDF y OWL, además de XML, el lenguaje de marcado diseñado para describir los datos. Estas tecnologías se combinan para aportar descripciones explícitas de los recursos de la Web (ya sean estos catálogos, formularios, mapas u otro tipo de objeto documental).  (wikipedia)
De esta forma el contenido queda desvelado, como los datos de una base de datos accesibles por Web, o las etiquetas inmersas en el documento (normalmente en XHTML, o directamente en XML, y las instrucciones de visualización definidas en una hoja de estilos aparte).
Esas etiquetas permiten que los gestores de contenidos interpreten los documentos y realicen procesos inteligentes de captura y tratamiento de información. Desde ya puedes empezar a descargar y explorar plantillas webs creadas en HTML5, así como themes para WordPress y otros administradores de contenido gratuitos.
En nuestros siguientes artículos estaremos publicando ejemplos más específicos y detallados acerca de las etiquetas semánticas y como se aplicarían a una pagina web.