HTML5: Introducción

HTML5 es la última versión de la especificación de HTML (HyperText Markup Language) la cual introduce nuevas características y funcionalidades de diverso tipo para facilitar el desarrollo de páginas web y evitar así el uso de librerías externas, por citar un ejemplo se cuentan con distintos tipos de input como date, time, number entre otros.

Además debemos hacer hincapié en que se sigue modificando el estándar de HTML5 con el fin de añadir nuevas características, y otras que se encuentran de manera temporal en el estándar (no se sabe si realmente quedarán en futuras versiones).

Un poco de historia

  • En 2004 se forma un grupo llamado WHATWG se encargó de la creación de una nueva especificación ya que no estaban de acuerdo con la que en ese momento se encontraba vigente, todo esto al margen de W3C (World Wide Web Consortium). Además WHATWG contaba entre sus miembros con Apple, Opera Software y la fundación Mozilla. Paralelamente el W3C se encontraba trabajando en una nueva especificación llamada XHTML 2.0 que vendría a ser el sucesor de HTML4.
  • En 2007 la W3C reconoce el trabajo realizado por WHATWG y lo adopta como parte de un borrador de una especificación vigente. En este mismo año se abandona cualquier intento de terminar la especificación XHTML 2.0 y concentra todos sus esfuerzos en terminar la de HTML5.
  • En 2008 se finaliza la primera versión de HTML5, la cual fue adoptada por Mozilla Firefox y luego por Internet Explorer, Google Chrome y Safari.
  • En 2010 el popular sitio de vídeos Youtube comienza a ofrecer la posibilidad de visualizar los vídeos usando HTML5 como alternativa al uso de Flash. Además ese mismo año se crea el Google Web Store, el cual usa HTML5.
  • En 2011 según Alexa ya el 34% de los 100 sitios más importantes usaban esta nueva especificación.
  • En 2014 la W3C publicó la versión definitiva de la nueva especificación.

¿Cuales son los puntos más llamativos de esta nueva versión?

Algunas de las mejoras más importantes que se han introducido son:

  • Se agregaron nuevas etiquetas para poder reproducir tanto audio como vídeo en varios formatos
  • Nuevas etiquetas con una semántica particular para poder estructurar mejor el documento (header, footer, article).
  • Posibilidad de almacenar datos del lado del cliente (Local Storage).
  • Etiquetas que nos permiten validaciones sin necesidad de agregar código JavaScript como por ejemplo: url, email, date, time, etc
  • La incorporación de Websockets con lo cual se pueden usar sockets de forma nativa sin necesidad de agregar librerías
  • Se añadió la funcionalidad de poder hacer drag-and-drop o usar el Geoposicionamiento

¿Cual es la especificación oficial?

El W3C es el organismo que se encarga de elaborar la especificación de HTML, las mismas se encuentran escritas en ingles y las pueden encontrar aqui:

¿Cuales son las navegadores que lo soportan?

Actualmente la mayoría de los navegadores soportan HTML5, aunque quizás no todos soportan todas las funcionalidades, por eso es importante antes chequear en la tabla de compatibilidad para saber que navegadores soportan esa funcionalidad o característica. La tabla de compatibilidad la pueden chequear en este link.

Elementos que fueron actualizados

Algunos elementos sufrieron cambios con el fin de reducir su sintaxis y hacerla mas entendible, ejemplo de esto ultimo son:

  • Doctype

Este elemento tenia varias formas de declararlo en HTML4, veamos algunos ejemplos:

Mientras que en HTML5 esto se reduce a:

  • Meta

En HTML4 se tenia que indicar http-equiv:

En HTML5:

  • Script

En este elemento antes (HTML4) se debía indicar el type

Mientras que en HTML5 el browser ya se encarga de inferir el type

  • Link

Al igual que con script en el caso de este elemento también debíamos indicar el type

En HTML5 el browser se encarga de inferir el type

Elementos que fueron actualizados en HTML5

En la nueva especificación algunos de los elementos fueron actualizados cambiando su semántica entre ellos están: i, b, em y strong.

Tag HTML4 HTML5
i Para colocar el texto en italic Para representar un texto en una voz o estado de ánimo alterno, por ejemplo un pensamiento.
b Para colocar el texto en bold Un texto hacia el cual se llama la atención para  propósitos utilitarios.
em Para enfatizar un texto Para representar un texto enfatizado con un acento de intensidad.
strong Para enfatizar fuertemente un texto Un texto especialmente  importante

Conclusión

HTML5 nos provee grandes ventajas ya que cuenta con varios tags nuevos que nos evitan tener que colocar librerías adicionales, ademas la gran mayoría de los navegadores (browsers) soportan las características que se han agregado a esta especificación.

You may also like...

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *