Aprendiendo mas de HTML5

DEFINICION:

HTML 5 (HyperText Markup Language, versión 5) es la quinta revisión importante del lenguaje básico de la World Wide Web, HTML. HTML 5 especifica dos variantes de sintaxis para HTML:

Un «clásico» HTML (text/html), la variante conocida como HTML5 y una variante XHTML conocida como sintaxis XHTML5 que deberá ser servida como XML (XHTML) (xhtml+xml).

Esta es la primera vez que HTML y XHTML se han desarrollado en paralelo.

Exactamente HTML 5, ya que no es simplemente una nueva versión del lenguaje de marcación HTML, sino una agrupación de diversas especificaciones concernientes a el desarrollo web. Es decir, HTML 5 no se limita sólo a crear nuevas etiquetas, atributos y eliminar aquellas marcas que están en desuso o se utilizan inadecuadamente, sino que va mucho más allá.

HISTORIA

Durante sus primeros cinco años (1990-1995), HTML pasó por una serie de revisiones principalmente alojados en primer lugar en el CERN y, a continuación, en la IETF.

Un primer intento abortado a extender HTML en 1995 conocido como HTML 3.0, hizo camino a un enfoque más pragmático, conocido como HTML 3.2, que fue completado en 1997. Luego nació la idea del HTML4 llegando a la conclusión en 1998.

En este momento, el número de miembros del W3C decidió detener la evolución HTML y en su lugar comenzar a trabajar en un XHTML equivalente, llamado basado en XML. A qui comenzó con una reformulación del HTML4 en XML, conocido como XHTML 1.0, que no añadió nuevas características excepto la serialización nueva, y que fue completada en el año 2000.

Alrededor de la época en que la evolución del HTML se detuvo en 1998, partes de la API para HTML desarrollado por proveedores de navegador se especificaron y publicaron bajo el nombre de DOM Nivel 1 (en 1998) y DOM Nivel 2 Core y DOM Nivel 2 HTML (comenzando en el año 2000 y culminando en 2003). Estos esfuerzos, a continuación, apagando, con algunas especificaciones de DOM Level 3, publicados en 2004, pero el grupo de trabajo se cierra antes de que se completaron todos los borradores de nivel 3.

En 2003, la publicación de XForms, una tecnología que se posicionó como la próxima generación de formularios Web forms, despertó un interés renovado en la evolución de HTML por sí mismo, en lugar de encontrar reemplazos para él. Este interés recae desde la realización despliegue de ese XML como un sitio Web de tecnología se limitaba a enteramente nuevas tecnologías (como RSS y Atom posterior), en lugar de como un sustituto de los existentes implementado tecnologías (como HTML).

Una prueba de concepto para demostrar que era posible extender las formas del HTML4 para proporcionar muchas de las características que XForms 1.0 introducido, sin necesidad de que los exploradores para implementar motores de procesamiento que eran incompatibles con las páginas HTML Web existentes, fue el primer resultado de este renovado interés. En esta etapa inicial, mientras que el proyecto ya estaba disponible públicamente, y entrada ya fue siendo solicitada de todas las fuentes, la especificación fue sólo bajo copyright de Opera Software.

La idea de que debe abrirse de evolución del HTML fue probada en un taller de W3C en 2004, donde algunos de los principios que subyacen en la obra de HTML5 , así como la propuesta de proyecto principios antes mencionados que abarca funciones sólo relacionadas con las formas, se presentaron a la W3C conjuntamente por Mozilla y opera. La propuesta fue rechazada debido a que la propuesta entra en conflicto con la dirección previamente elegida para la evolución de la Web.
Poco después, Apple, Mozilla y Opera conjuntamente anunciarón su intención de seguir trabajando en el esfuerzo bajo el paraguas de un nuevo lugar llamado el WHATWG (Web Hypertext Application Technology Working Group).

El WHATWG se basa en varios principios fundamentales en particular que:

  • Las tecnologías tienen que ser compatible con versiones anteriores.
  • Que las especificaciones e implementaciones que coinciden incluso si esto significa cambiar la especificación, en lugar de las implementaciones, y que deben ser las especificaciones detalladas suficiente las implementaciones puede lograr interoperabilidad completa sin ingeniería inversa entre sí.

Este último requisito necesario en particular que el ámbito de la especificación de HTML5 incluye lo que anteriormente había sido especificado en tres documentos separados: HTML4, XHTML1 y DOM2 HTML.

En 2006, el W3C indicó un interés para participar en el desarrollo de HTML5, después de todo y en 2007 formó un grupo de trabajo fletado para trabajar con el WHATWG sobre el desarrollo de la especificación HTML5. Apple, Mozilla y opera permitió el W3C publicar la especificación bajo los derechos de autor del W3C, manteniendo una versión con la licencia menos restrictiva en el sitio WHATWG.

Desde entonces, ambos grupos han estado trabajando juntos.

La especificación HTML publicado por el WHATWG no es idéntica a esta especificación. En el momento de esta publicación, las principales diferencias eran que la versión WHATWG incluye características no incluidas en esta versión de W3C: algunas de las características que se hayan omitido, pero podrán ser considerados para futuras revisiones de HTML más allá de HTML5; y otras características fueron omitidos porque en el W3C se publican como especificaciones separadas.

DIFERENCIAS ENTRE HTML4 Y HTML5

NOVEDADES DE HTML 5 

HTML 5 incluye novedades significativas en diversos ámbitos. Como decíamos, no sólo se trata de incorporar nuevas etiquetas o eliminar otras, sino que supone mejoras en áreas que hasta ahora quedaban fuera del lenguaje y para las que se necesitaba utilizar otras tecnologías.

  •  Estructura del cuerpo: La mayoría de las webs tienen un formato común, formado por elementos como cabecera, pie, navegadores, etc. HTML 5 permite agrupar todas estas partes de una web en nuevas etiquetas que representarán cada uno de las partes típicas de una página.
  •  Etiquetas para contenido específico: Hasta ahora se utilizaba una única etiqueta para incorporar diversos tipos de contenido enriquecido, como animaciones Flash o vídeo. Ahora se utilizarán etiquetas específicas para cada tipo de contenido en particular, como audio, vídeo, etc.
  •  Canvas: es un nuevo componente que permitirá dibujar, por medio de las funciones de un API, en la página todo tipo de formas, que podrán estar animadas y responder a interacción del usuario. Es algo así como las posibilidades que nos ofrece Flash, pero dentro de la especificación del HTML y sin la necesidad de tener instalado ningún plugin. Puedes conocer más sobre este nuevo elemento en el manual de canvas que estamos creando en DesarrolloWeb.com
  •  Bases de datos locales: el navegador permitirá el uso de una base de datos local, con la que se podrá trabajar en una página web por medio del cliente y a través de un API. Es algo así como las Cookies, pero pensadas para almacenar grandes cantidades de información, lo que permitirá la creación de aplicaciones web que funcionen sin necesidad de estar conectados a Internet.
  •  Web Workers: son procesos que requieren bastante tiempo de procesamiento por parte del navegador, pero que se podrán realizar en un segundo plano, para que el usuario no tenga que esperar que se terminen para empezar a usar la página. Para ello se dispondrá también de un API para el trabajo con los Web Workers.
  •  Aplicaciones web Offline: Existirá otro API para el trabajo con aplicaciones web, que se podrán desarrollar de modo que funcionen también en local y sin estar conectados a Internet.
  •  Geolocalización: Las páginas web se podrán localizar geográficamente por medio de un API que permita la Geolocalización.
  •  Nuevas APIs para interfaz de usuario: Temas tan utilizados como el “drag & drop” (arrastrar y soltar) en las interfaces de usuario de los programas convencionales, serán incorporadas al HTML 5 por medio de un API.
  •  Fin de las etiquetas de presentación: Todas las etiquetas que tienen que ver con la presentación del documento, es decir, que modifican estilos de la página, serán eliminadas. La responsabilidad de definir el aspecto de una web correrá a cargo únicamente de CSS.

 

ELEMENTOS CAMBIADOS

Estos elementos de HTML5 son imcompatibles con HTML4.

  • El elemento <a /> sin href ahora creará un enlace al sitio.
  • El elemento <address /> es ahora un nuevo concepto de sección.
  • El elemento <b /> ahora representa un trozo de texto a ser estilizado sin ninguna importancia.
  • Para elementos <label /> el navegador no debe mover el foco desde la etiqueta al control a menos que el comportamiento sea estandar para el interfaz utilizado en la plataforma.
  • <menu /> ha sido redefinido para ser usado con los actuales menús.
  • El elemento <small /> ahora representa una impresión pequeña.
  • El elemento <strong /> definitivamente representa el enfasis puesto en trozo de nuestro texto.

ELEMENTOS ELIMINADOS

Como decía, estos son los elementos eliminados y las razones de por qué son prohibidos:

  • Los siguientes elementos (muy usados hace pocos años) se quitan de HTML5 porque son puramente presentacionales (no tienen semántica) y todo el tema estético se debe tratar con CSS:
    • § basefont
    • § big
    • § center
    • § font
    • § s
    • § strike
    • § tt
    • § u
  • Los elementos para trabajar con frames (frame, frameset y noframes) se quitan del estándar por razones obvias: afectan negativamente a la usabilidad y accesibilidad de la web. Además, prácticamente rompen la web, y si se necesita algo similar se puede acudir a los iframe, más potentes y mejor pensados.
  • El elemento acronym se elimina simplemente porque crea confusión sobre su uso, y los desarrolladores no entienden demasiado bien para qué usarlo. Las abreviaciones y acrónimos se pueden marcar con abbr, que sí se mantiene en el estándar.
  • El elemento applet se ha declarado obsoleto y hoy en día no se utiliza. El elemento object reemplaza sus funciones y es lo común hoy en día.
  • El elemento isindex se quita definitivamente. En la era de las cavernas se utilizaba para mandar información al servidor, pero con la llegada de los formularios su uso es arcaico y poco útil.
  • El elemento dir también se declara obsoleto (ya lo era en HTML4), y simplemente se recomienda usar listas normales con ul.
  • El elemento noscript se mantiene en HTML pero no en XML/XHTML, ya que su contenido está en HTML. No estoy muy de acuerdo con este movimiento, pero así será.

ATRIBUTOS ELIMINADOS

Para empezar, todos los atributos referentes a la presentación han sido eliminados, por la misma razón de antes: CSS sirve mejor ese propósito. Recuerdo que el atributo style (que contiene CSS) es ahora universal y puede ser aplicado a todos los elementos, así que si queremos indicar su presentación sin añadir una hoja de estilos aparte, tendremos que usar este atributo. Atención a la lista porque esto sí que es importante, ya que algunos de estos elementos son muy usados, aunque otros están muy obsoletos:

  • Atributo align en todos los elementos.
  • Atributos alink, link, text y vlink en el elemento body.
  • Atributo background en el elemento body.
  • Atributo bgcolor en los elementos table, tr, td, th y body.
  • Atributo border en todos los elementos.
  • Atributos cellpadding y cellspacing en el elemento table.
  • Atributos char y charoff en los elementos col, colgroup, tbody, td, tfoot, th, thead y tr.
  • Atributo clear en el elemento br.
  • Atributo compact en los elementos dl, menu, ol y ul.
  • Atributo frame en el elemento table.
  • Atributo frameborder en el elemento iframe.
  • Atributo height en los elementos td y th.
  • Atributos hspace y vspace en los elementos img y object.
  • Atributos marginheight y marginwidth en el elemento iframe.
  • Atributo noshade en el elemento hr.
  • Atributo nowrap en los elementos td y th.
  • Atributo rules en el elemento table.
  • Atributo scrolling en el elemento iframe.
  • Atributo size en el elemento hr.
  • Atributo type en los elementos li, ol y ul.
  • Atributo valign en los elementos col, colgroup, tbody, td, tfoot, th, thead y tr.
  • Atributo width en los elementos hr, table, td, th, col, colgroup y pre.

Como vemos, algunos de estos atributos sí que se mantienen para ciertos elementos, como la anchura y altura en las imágenes. Sin embargo estos no son los únicos atributos que se eliminan, también hay otros que se quitan por redundancia, por evitar confusiones, por su bajo uso o porque simplemente se han quedado obsoletos.

  • Atributo accesskey en los elementos a, area, button, input, label, legend y textarea.
  • Atributos rev y charset en los elementos link y a.
  • Atributos shape y coords en el elemento a.
  • Atributo longdesc en los elementos img y iframe.
  • Atributo target en el elemento link.
  • Atributo nohref en el elemento area.
  • Atributo profile en el elemento head.
  • Atributo version en el elemento html.
  • Atributo name en los elementos img y a. Para obtener un comportamiento similar se recomienda usar id.
  • Atributo scheme en el elemento meta.
  • Atributos archive, classid, codebase, codetype, declare y standby en el elemento object.
  • Atributos valuetype y type en el elemento param.
  • Atributo language en el elemento script.
  • Atributo summary en el elemento table.
  • Atributos axis y abbr en los elementos td y th.
  • Atributo scope en el elemento td.

OTROS CAMBIOS

  • Hay diversos elementos que no se eliminan por su extendida fama, pero que siendo un tanto ortodoxos deberían eliminarse. Para evitar esto los que están escribiendo el estándar han tenido que redefinir su definición, de tal forma que se tratan de manera similar pero semánticamente son diferentes.
  • Un ejemplo muy claro es u e i, muy usados pero que progresivamente pierden importancia frente a strong y em. Estos dos elementos, que indicaban negrita y cursiva respectivamente, pasan a definirse de una manera muy vaga para indicar un texto diferente en alguna manera al texto normal. Otros elementos se redefinen, particularmente me resulta curioso que se mantenga small mientras big se elimina. De cualquier manera, no es demasiado relevante para los desarrolladores web, en el sentido de que podrán seguir usándolos como ahora.

EJEMPLOS DE UNA APLICACION DE HTML5

Quake en HTML 5

Una aplicación impresionante de HTML 5 fue el port del juego Quake en un navegador.

Photobucket

Imagina de lo que son capaces 3 desarrolladores de Google… Han creado una versión del célebre Quake II corriendo en un navegador. Este Quake II GWT emplea HTML5 y WebGL para la aceleración gráfica.

CONCLUSIONES 

Tal y cómo hemos ido viendo, las novedades de HTML5 se centran en facilitar la implementación de aplicaciones web, avanzar hacia la web semántica y limpiar un poco toda la basura heredada de las anteriores versiones de HTML. Aunque todo eso parezca lejano, lo cierto es que muchos navegadores ya implementan algunas partes sueltas de HTML5, y ya existen varias páginas experimentales que juegan con estos elementos. Por ejemplo, cerramos este minucioso especial precisamente en el día en que Firefox 3.5 es lanzado, pero Safari, Opera, Chrome e incluso IE8 ya soportan algunas cosas.

Anuncios