El nuevo estándar, HTML5, nos promete una larga lista de cambios grandes e interesantes, tanto para usuarios como para profesionales del medio. Vamos a ver algunos de especial relevancia.

 

HTML5 proporciona a los desarrolladores una manera más sencilla de crear aplicaciones Web con más potencia y menos fallos.

Los usuarios verán las aplicaciones Web en tiempo real de forma más suave y con menos errores. Ya que HTML5 promete un camino más fácil para los desarrolladores en la creación de sitios web que se actualizan en tiempo real.

Los desarrolladores deben realizar complejas tareas de codificación que, fácilmente, pueden acabar introduciendo errores y haciendo que las aplicaciones fallen.

Bruce Lawson, que evangeliza sobre los estándares web abiertos de Opera Software, señala que al grupo que trabaja en el HTML5, se le asignó la difícil tarea de hacer que la especificación fuera más tolerante que sus predecesores, para que los sitios web más antiguos o mal codificados funcionaran mejor en navegadores habilitados para ejecutar HTML5. 

• Web Sockets: conexión permanente entre una página y un servidor.
  Una de las mejoras más interesantes que puede ofrecer HTML5 es la característica Web Sockets: proporciona un sitio web con una interfaz de programación de aplicaciones (API) que abre una conexión permanente entre una página y un servidor, para que la información pase entre ellos en tiempo real, (sin tener que hacer una solicitud cada vez que se quiere una actualización). Web Sockets promete una forma fácil de que los desarrolladores creen páginas web que cambien en tiempo real.
• Mayor velocidad y mejor funcionamiento:
  Las páginas se cargan más rápido (sobre todo en dispositivos móviles), y funcionan mejor, gracias a la red de comunicaciones de HTML5 y a un navegador de almacenamiento.
• Web Storage
  HTML5 también puede ayudar a que las aplicaciones web funcionen mejor cuando los dispositivos están desconectados (o intermitentemente) de Internet, como los teléfonos inteligentes. Una característica llamada Web Storage permite a las aplicaciones Web almacenar más datos en el navegador, recuperarlos de forma más inteligente, y controlar cómo los navegadores guardan ciertas partes de páginas para agilizar la carga.

Una fórmula mágica:

• Mejor manejo de formularios, reduciendo el código javascript:
  HTML5 también mejorará el rendimiento de los navegadores con un mejor manejo de los formularios: menos javascript, más velocidad de carga de la página…
• Funciones CSS diseñadas para trabajar con HTML5:
  Además varias características de la nueva versión de CSS, están diseñadas para trabajar con HTML5, haciendo a las páginas Web más sensibles a la entrada del usuario y permitiendo gráficos de alta calidad.
• Muchas web profesionales funcionan como aplicaciones de escritorio (suite de oficina o herramientas de edición de fotografías p.e.). Pero las funciones más sofisticadas dependen de conexiones que los desarrolladores crean entre diferentes tecnologías Web, como HTML, JavaScript y hojas de estilo (CSS). Esto hace a esos sitios más lentos y vulnerables a los agujeros de seguridad.
  Con las nuevas características de HTML5, como Web Sockets, también estos sitios serán más rápidos, potentes y seguros.
• Más interoperabilidad entre navegadores:
  Otra importante mejora es el ‘parser’ del HTML5. Es un analizador del navegador que lee las etiquetas utilizadas para construir una página y busca cómo mostrarlo. Esto hace que los navegadores sean más interoperables en la forma en que manejan el código mal escrito: el analizador especifica cuáles son las respuestas a los errores, en lugar de dejar que cada creador del navegador decida cómo manejar el código imperfecto. Esto ofrece una experiencia de usuario más sólida, sin importar el navegador que se utilice.
• Vídeo en el navegador, sin plugin, gracias a HTML5:
  HTML5 ha atraído la atención por su capacidad de mostrar vídeo dentro de un navegador web, sin necesidad de plug-ins como Flash de Adobe. Aunque esta no es la característica más importante de HTML5, ni mucho menos, está claro que es una gran novedad y alivio para los usuarios y que podremos disfrutar de lo lindo de este nuevo formato para el vídeo.
  
  YouTube acaba de anunciar que cambia el código para embeber vídeos. El nuevo código utilizará un iframe que permitirá ver los vídeos embebidos tanto en Flash como enHTML5, en función de la configuración del navegador del usuario.
  Por defecto se mostrará HTML5, cambiando a Flash siHTML5no está disponible.
  El ejemplo del nuevo código, mucho más corto:
  <iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0">
  </iframe>

Naturalmente llevará su tiempo hasta que todo esto esté bien implementado.
Actualmente sólo Chrome, Safari, Firefox y Opera soportan la mayoría de las características de HTML5, (no todas).

Con este enlace podrás comprobar en qué medida tu navegador soporta HTML5. http://www.html5test.com/

 

Consideraciones personales:

"La base de HTML5 es implacablemente pragmática"

Bueno, sin duda un momento emocionante para los desarrolladores web, pero también los usuarios lo notarán bastante, sobre todo en algunos aspectos.

Y, sin duda, HTML5, también traerá nuevas normas.

Felicitemos al grupo de trabajo HTML5 y a todos los que están detrás de todo esto ya que estas innovaciones encaminadas a mejorar la web, no sólo permiten aumentar la sofisticación en el diseño y la funcionalidad de los sitios web, sino que contribuyen a reforzar la libertad del usuario y a abrir más el horizonte y las mentes…

…Alabados sean…!

Aquí te dejo algunos enlaces a contenidos muy interesantes sobre HTML5 para que vayas haciendo boca y te relajes ante lo que se nos viene con la implementación del nuevo lenguaje de marcas HTML5:

HTML5 gallery

Canvas Vídeo 3D

Chrome Experiments

SlidesHTML5Rocks – magnífica presentación y demo, en uno, (no se ve en IExplorer7).

Guía de HTML5 para desarrolladores web

Hojas de apoyo HTML5 y CSS3

fuente Technology Review

Los microformatos, no son otra cosa que trozos de código (X)HTML enriquecidos con una serie de atributos o clases CSS para identificar el contenido.
Pero Google entendió enseguida que marcar con ciertas etiquetas la información relevante de nuestros sitios web para poderla presentar mejor, era una oportunidad de oro que había que aprovechar.

Hoy te traigo la información acerca de los microformatos y la web semántica en este nuevo y espléndido artículo, escrito por abarainka, en Hello Google:

Qué son los microformatos y cómo utilizarlos:

Microformatos: El eslabón perdido

Uno de los grandes avances que se prometen en la Web del futuro, supuestamente inmediato, es la irrupción de la Web semántica. Llevamos ya unos cuantos años escuchando cantos de sirena acerca de las bonanzas que la irrupción que esta nueva revolución va a provocar en nuestra forma de buscar y en la forma que los motores de búsqueda van a poder indexar nuestros contenidos, así como otras muchas aplicaciones podrán interactuar con la información de nuestras páginas. Estamos hablando de lo que se ha llamado ya la WEB 3.0.

El problema es que todo esto no termina de arrancar. La Web de hoy quizá ya no sea tan 2.0 como pensamos, pero desde luego a 3.0 no ha llegado. Digamos que estamos en una fase 2.5 o algo así.

Y uno de los eslabones que están propiciando esta transición lo forman los Microformatos.

¿Qué son los Microformatos?

Técnicamente no son más que trozos de código (X)HTML enriquecidos con una serie de atributos o clases CSS para identificar el contenido. Pero en realidad son algo más.

Estamos hablando de proporcionar significado semántico a un contenido que para las personas es legible y entendible, pero para las máquinas no es más que texto puro y duro.

Todo esto se inició allá por el 2006, en una conferencia de las buenas gentes de Technorati. Allí presentaron una forma fácil y rápida de facilitarles el trabajo, que no es otra que marcar con ciertas etiquetas la información relevante de nuestros blogs (en este caso), para que ellos pudieran presentarla mejor en su página. La explicación entusiasmó a la concurrencia, y otros indexadores de contenidos vieron en ella un filón. Google sin ir más lejos entendió que debía aprovechar esta nueva forma de presentar la información.

¿Para qué sirven los Microformatos?

Como ya hemos explicado, su función es la de dar valor semántico al contenido de nuestras páginas. Esto provoca que tanto los buscadores, como los agregadores de contenidos o cualquier herramienta capaz de rastrear nuestro código, sepan distinguir la naturaleza de un contenido. Si estamos presentando un curriculum, indicando una ubicación geográfica, haciendo una crítica o comentario de un producto, etc…

¿Cómo crear nuestros microformatos?

Aunque pudiese parecer algo complicado, en realidad no hay nada más fácil. Veamos un ejemplo.

Este es de los más sencillos que pueda haber, se trata simplemente de taggear un link para distinguirlo de links normales. Basta simplemente con añadir el atributo rel="tag" a la etiqueta del link:

<a href="http://www.hellogoogle.com" rel="tag">Posicionamiento Web</a>

De esta forma, webs como http://technorati.com son capaces de distinguir tags de tu contenido y crear una estructura con ellos.

Otro de los más espectaculares y que Google muestra de una forma más elocuente, es el dedicado a las valoraciones o comentarios, conocido como hReview. Veamos un ejemplo:

<div class="hreview">
<span class="item">
<span class="fn">Avatar</span>
</span>
Crítica de <span class="reviewer">Asier Barainka</span> el
<span class="dtreviewed">
10 de Febrero de 2010<span class="value-title" title="2010-10-02" />
</span>.
<span class="summary">Una bonita historia de amor</span>
<span class="description">Avartar es la mayor superproducción del momento, y una de las grandes apuestas d ela industria del cine…</span>
Rating:
<span class="rating">4.5</span>
</div>

En el podéis observar como cada uno de los trozos de contenido está envuelto en una etiqueta HTML con un class específico, todo en un conjunto dentro del class="hreview" que otorga la condición de tal microformato al contenido que incluye.

¿No es muy complicado no? Bueno, en realidad toda la información bien explicada la tenéis en la Web oficial: Microformats.org. Aquí podréis encontrar la estructura de todos los microformatos especificados hasta el momento.

¿Y cómo mostrará Google los Microformatos?

Es evidente que Google está muy interesado en que los WebMasters utilicemos Microformatos. Digamos que les hacemos el trabajo más fácil, y además le daremos un aspecto más acorde a lo consultado a los resultados de búsqueda.

Tal es el interés de Google, que no únicamente adopta los microformatos para mostrar los “Rich Snippets”, sino que también permite utilizar etiquetas RDFa, aunque ellas no son motivo de este artículo.

Para facilitarnos el trabajo nos proporciona una herramienta para Webmasters (Rich Snippets Testing Tools) donde podremos testear la corrección de nuestros Microformatos, así como el aspecto que estos tendrán en los SERPs. Que para el ejemplo de una crítica como el que hemos mostrado antes sería algo así.

Si veis que vuestros Microformatos son correctos, pero no generan una vista previa, no os volváis locos, algunos de los Microformatos ya aprobados (el de Organizaciones y el de Productos sobre todo), aún no generan una vista especial en los Resultados de Google, pero todo llegará.

Consideraciones Finales

Todo esto parece muy goloso y muchos ya nos estamos rebanando los sesos sobre como sacar el mejor partido al marcado de información por medio de Microformatos, pero tengamos presentes unas consideraciones finales para no caer en errores.

Utilicemos los Microformatos con sentido, no es cuestión de poner por poner, hay que usarlos cuando realmente el contenido lo requiere.
No caigáis en la tentación de ocultar el contenido por medio de CSS o JS, Google no mostrará estos Rich Snippets.
No todos los links deben llevar rel=”tag”, es un error taggear todos los enlaces de mi página, hazlo solo con aquellos que realmente deban ser un tag del artículo o texto en cuestión.
No por utilizar Microformatos vas a posicionar mejor o más arriba, pero si que aparecerás en búsquedas más relevantes para tus contenidos, lo que sin duda subirá el ratio de conversión de tu página.
Informaciones como el crítico en una revisión/crítica o el autor/título de un Artículo son imprescindibles para generar una vista en los SERPs. Microformatos sin la suficiente información no serán presentados por el buscador.
En las críticas (hReview), las puntuaciones que debemos pasar en el Microformato son de 1(Mala) a 5 (Muy Buena). Si el sistema de puntuación de tu página no se adapta a este criterio, deberás buscar la forma de convertirlo.
Los Microformatos siguen en expansión, y cada vez se van adoptando más y por más gente. Lo que provoca que debamos estar continuamente atentos a su evolución.

Aquí puedes ver más sobre los Microformatos:

Microformats Wiki

Es una wiki muy limpia y clara donde puedes ver ejemplos, presentaciones, preguntas frecuentes. Puedes colaborar y proponer nuevos Microformatos:

Espero que te sirva, y si no, pide, pide… ;-)

La paciencia no es el fuerte de Google y, a medida que ha invertido su entusiasmo en lanzar su versión beta de Chrome para Mac, y que mucha de la tecnología de Gears, se está incorporando en la especificación HTML5, la compañía ha dejado que decaiga su proyecto de Gears.

Google creó hace dos años su propio software de escritorio para mejorar el navegador web: Gears, con carácterísticas como el almacenamiento en la caché sin conexión o poder arrastrar y soltar los archivos.

Gears es un software ofrecido por Google, que permite crear aplicaciones webs más poderosas, añadiendo nuevas funciones al navegador. La última versión pública es la 0.5 (febrero 2009).

Gears consiste en una aplicación que se instala como una extensión de navegador, que agrega una API que permite programar en javascript algunas interacciones con los componentes instalados localmente por la aplicación.

Componentes principales:

▪ Un servidor local, encargado de cachear y servir los datos (HTML, Javascript, imágenes, etc.). Permite que las aplicaciones web interactúen de forma natural con su escritorio

▪ Una base de datos: almacena los datos localmente en una base de datos completamente investigable.

▪ Un controlador, formado por varios hilos que sincronizan los datos en un segundo plano.

▪ La API de Geolocalización, que permite ubicar a un persona dentro del mundo según la posición desde donde se conecte.

Muchas de estas funciones estarán incluidas en la próxima revisión del lenguaje de programación estándar HTML5. Tecnologías como soporte offline y las API de geolocalización se están incorporando en la especificación HTML5 como un estándar abierto apoyado en los navegadores.

Esto es una buena noticia para los navegadores pero, por ahora HTML5 no está listo aún.

Por el momento, Gears todavía contará con una serie de herramientas que se pueden abrir con Firefox e Internet Explorer. La tecnología se basa en el navegador de Google Chrome.

El portavoz de Google aclaró en un seguimiento de e-mail, que siguen apoyando Gears de manera que no afecte nada a la funcionalidad de los sitios que lo utilizan. Y que esperan que los desarrolladores de HTML5 avancen en la utilización de estas características ya que se trata de un enfoque basado en estándares, que estará disponible en todos los navegadores.

fuente: Los Angeles times

Búsquedas en Google: hacia la web semántica, Web 3.0