Introducción:
HTML es el lenguaje de etiquetas que utiliza una Web, nace en
la década de los noventa producto de Tim Berners-Lee, el hombre que inventó la
Web. Se actualiza en varias versiones hasta que llegamos a la 4.01, que es el
actual estándar en el año 1999. Pasa mucho tiempo hasta que HTML5 comienza a
moldearse, a partir del año 2008 y en el 2009 comenzamos a ver el soporte en varios navegadores. Continua
evolucionando, ya que aún no es estándar, se encuentra en Working Draft (Borrador de Trabajo), sin
embargo ya podemos verlo en muchas webs importantes. Varias empresas
importantes están apoyando el HTML5 e impulsando su estandarización y perfeccionamiento,
entre ellas cabe destacar Google, Mozilla, Adobe y Microsoft, entre otras.
En cambio, HTML5 es un lenguaje que llega con un conjunto de
tecnologías que permiten construir la nueva Web. Como decíamos anteriormente,
gran parte de este estándar aún está en Draft, es decir, en borrador, pero ha
tenido que salir a la luz para brindar soluciones necesarias en el mundo de la
telefonía móvil y en nuevas tecnologías.
Flash llega en la década de los noventa de la mano de Macromedia, empresa absorbida por Adobe en 2005. A diferencia de HTML, Flash no es un lenguaje de libre comercio, sino que es una aplicación de pago que funciona como un entorno de desarrollo multimedia, muy famosa sobre todo entre diseñadores. Flash crea películas en formato SWF que se reproducen en un navegador con el plugin adecuado. Su éxito se basó en la popularidad de este plugin, el reproductor de Flash, instalado en la mayoría de los navegadores de escritorio. Con la expansión de las plataformas móviles y la negativa de algunas empresas, con Apple a la cabeza, de incluir este reproductor entre sus dispositivos, Flash se encontró en una encrucijada difícil de salir ¿el desenlace? Hacia finales de 2011, en el mes de Noviembre, Adobe anunció que no habría nuevas versiones de Flash para móviles, y que pondrían sus energías y gran parte de su gente a trabajar en soluciones para HTML5. También se anunció que se redefinía el enfoque de Flash. Probablemente esta ha sido una de las grandes noticias para el mundo del desarrollo Web en el 2011 y aún hoy sigue siendo un tema controvertido.
Un aspecto que vale resaltar en esta historia es que Flash no está muerto aún, simplemente se ha redefinido su aplicación para enfocarse en juegos y algunas necesidades particulares, pero sí deja de tener peso en lo que a desarrollo Web se refiere.
¿Porqué es mejor HTML5? Simplemente porque es una instancia superadora a HTML4; porque llega de la mano de CSS3, una evolución notable de las hojas de estilo que conocíamos y porque revaloriza el papel de JavaScript en la Web, como el lenguaje que “sabe hablar” con las nuevas APIs que llegan con HTML5.
¿Porqué HTML5 puede reemplazar a Flash en nuestros desarrollos Web? Porque ofrece un soporte nativo para los nuevos navegadores, tanto mobile como desktop, y porque también existen opciones para que muchas de sus funciones tengan compatibilidad crossbrowser con navegadores antiguos. Claro que no todas las características pueden emularse con la misma fidelidad y performance, pero también es cierto que el IE6 countdown ya marca que Intenet Explorer 6 en Argentina solo tiene el 1,6% de la cuota del mercado, en Venezuela 2,5 y en Estados Unidos menos del 1%. La renovación de IE7 e IE8 también llegará y el problema de compatibilidad con versiones anteriores cada vez será menor.
------------------------------------
Concretamente,
siete ejemplos demuestran la potencia del HTML5: un visor de vídeos que
nos permite “jugar” con él, un editor de fuentes, una galería de imágenes y
ejemplos de las posibilidades respecto a transiciones de imágenes, vistas de
360 grados y audio. Por supuesto todo esto sin necesidad alguna de instalar
complementos adicionales y con unos consumos más que aceptables.
Algunos
cambios más importantes del HTML5 son:
Audio y Video
La
reproducción de video y audio, que se lleva a cabo mediante etiquetas como en
los siguientes ejemplos:
Video:
<video id="video"
width="640" height="480" volume=".7" controls
autoplay>
<source src="video.ogg"
type="video/ogg"> </source>
</video>
y, en el
caso del audio:
<audio>
<source src="music.oga" type="audio/ogg">
</audio>
Nueva estructura
Teniendo en cuenta la utilización que dan a algunos elementos div con identificadores muy comunes, los desarrolladores crearon una nueva estructura de elementos que cambiarán la manera de elaborar el contenido (sobre todo de blogs) y la manera en que los buscadores lo analizan.Se trata de las etiquetas:
article : Una
entrada independiente en un blog, sitio o revista.
footer : El
final de la página, donde se incluyen los modos de contacto, etc.
header : No
el elemento head, sino la cabecera de una determinada página.
nav : Una
colección de vínculos a otros sitios o páginas.
section : Una
sección determinada que incluye su propio encabezamiento.
Mark, Aside y Time
Mark se utiliza para dar importancia a un texto en concreto:<p>La <mark>etiqueta mark</mark> es utilizada para llamar la atención.</p>Por otro lado, han creado una etiqueta que mejora el manejo de fechas y horas (esto se hacía en HTML4 mediante la etiqueta abbr):
<time datetime="2010-03-29">Marzo</time>.<time>09:00</time>Mejoras en <input type…>
Se han añadido nuevos tipos de ingreso de texto, ahora se puede especificar si se trata de una url o un email, un entero, una fecha, etc. Algunos ejemplos:<input type="email"><input type="url"><input list="title-list"> <datalist id="title-list"> <option value="..."></datalist>Cuadro de diálogo
Con la etiqueta <dialog> podemos incluir cualquier tipo de diálogo.<dialog> <dt> Usuario 1: <dd> Hola! <dt> Usuario 2: <dd> Hola! :)</dialog>Barra de progreso, canvas y puntuación
Con la etiqueta <progress> podremos incluir el progreso de una tarea que se esté ejecutando, mas trabajando en conjunto con JavaScript podremos incluir también una barra de progreso visual.<progress> <span id="objprogress">76</span>%</progress>y con <meter> insertamos un valor fraccional de una medida escalar, que seguramente usaremos junto a JavaScript para incluir de manera muy simple el típico gráfico de una a cinco estrellas.
Con <canvas>, implementado por primera vez por Apple para sus widgets, podremos dibujar gráficos dinámicos e interactivos.
Finalmente, la etiqueta <device> permitirá al cliente acceder a varios dispositivos, como puede ser una webcam, en tanto con <embed> podemos determinar contenido embebido, como por ejemplo un plug-in.
No hay comentarios:
Publicar un comentario