La “fobia” hacia flash va extendiéndose rápidamente. En esta batalla siempre se nombra HTML5 como el nuevo estándar para la web, con etiquetas específicas que harán un poquito mejor y más fácil la visualización de contenidos y la programación de los mismos. De todas formas, HTML5 viene acompañado de CSS3, el nuevo estándar para las hojas de estilo que pondrá el toque glamuroso en todo este “nuevo horizonte”.
Mi novia me ha regalado una camiseta muy buena que resume lo que intento explicar: “You are the CSS to my HTML” que se viene traduciendo como “Tú eres el CSS de mi HTML” y es que el segundo sin el primero… un poquito soso. Existe un movimiento, llamado “CSS Naked Day” (Día del CSS desnudo), en el que los webmasters eliminan el CSS de sus webs dejándolas en HTML plano, es decir, muy feo. Sin extenderme más, creo que se entiende la idea.
Pues bien, de la mano de este nuevo estándar tenemos el segundo envite a flash. Primero los vídeos y ahora las panorámicas en 3D abandonan flash para pasarse a CSS3 y así ganar compatibilidad con dispositivos que no soportan esta tecnología de Adobe (¿Escucho iPhone e iPad?), gracias a un desarrollo de krpano.com que, aunque ahora es algo justo por las limitaciones de CSS3, seguro evolucionará mucho más con el tiempo (Puede que cuando las APIs 3D para web como O3D o WebGL lleguen) ya que tiene muchas posibilidades. Para muestra un par de ejemplos en vídeo:
¿Cómo funciona? Bueno, vamos a intentar explicar de un modo sencillo cómo funciona el invento: La base de todo este trabajo está en JavaScript y CSS3.
De JavaScript poco voy a comentar, más que nada porque es simplemente lo que ya se venía utilizando antes, y su potencia y flexibilidad permite aplicarlo tanto a cosas viejas como a nuevos conceptos. La propiedad que utiliza de CSS3 es “CSS 3D transforms” (Transformaciones en 3D para CSS3) que está disponible, por ahora, como un plugin de webkit (el motor que utiliza el navegador Safari, tanto su versión mobile como para MAC). Esta propiedad ya existía en una versión mucho más simple, *”CSS Transforms” (Transformaciones para CSS), que sólo permitía escalados, movimientos y rotados.
Como comentaba hace un par de párrafos esta propiedad, que permite renderizar en espacios 3D las imágenes directamente con una propiedad CSS sin necesidad de operaciones externas, es un poquito limitada por el momento ya que sólo permite cosas “sencillas” basadas en renderizado triangular tales como el famoso “Ojo de pez”. Otras limitaciones son debidas a los dispositivos a los que va dirigida, como la calidad y cantidad de las imágenes destinadas a realizar el montaje, que no deben ser demasiado grandes ni demasiado pesadas porque la memoria de los dispositivos no daría abasto y el navegador dejaría de funcionar. De todas formas la aplicación es suficiente para poder visualizar las panorámicas 360º a las que estamos acostumbrados en la mayoría de los casos y, viendo el vídeo de arriba, en un iPad se ve la mar de bien.
Tal yo como lo han implementado los chicos de krpano, la configuración de su visor 360º para flash sirve también para este nuevo visor (escrita en XML) por lo que el impacto y las horas dedicadas no se verán incrementadas. Todo un lujo.
Para los curiosos que les apetezca probarlo, en Safari para MAC pueden hacer lo siguiente para cambiar la configuración.
- Click en la barra de menú de Safari e ir a Preferencias.
- Pestaña de “Avanzado”.
- Marcar la casilla de “Mostrar menú de desarrollo en la barra de menú”
- Ahora se mostrará la barra de desarrollo para poder acceder a ella
- Click en esa nueva barra y seleccionar “User Agent”
- Seleccionar “Mobile Safari 3.1.2 - iPhone item”.
- Recargar la página de la panorámica creada con esta utilidad.
Espero que os guste y que me comentéis que os parece estes nuevos pasitos hacia adelante. ¿Son necesarios? ¿Son mejores que lo que hay?
No hay comentarios:
Publicar un comentario