Adobe se da por vencido y saca a Flash de los móviles

Desde que Apple anunció que sus aparatos móviles (iPhone, iPod Touch y el iPad) no incluirían la capacidad de reproducir Flash y jamás la añadirían, todo ha ido cuesta abajo para el que era (y tal vez sigue siendo) una de las partes más importantes de la web.

Flash fue el primer ambiente de desarrollo que permitió crear animaciones y programación compleja del lado del cliente para sitios web. Implementó por primera vez cosas que hasta ahora podemos hacer con javascript y canvas, muchas otras todavía no pueden hacerse.

Tuvo mucho éxito y se calcula que más del 96% de las computadoras tienen el reproductor de Flash instalado, lo cual lo convirtió prácticamente en la primera opción para muchos que necesitaban desarrollar un sitio. El problema fue que muchos diseñadores mal-usaron Flash para hacer sitios pesados, inaccesibles e inútiles, metiendo cosas sólo porque se puede y sin pensar en el usuario final.

Sin embargo, los obstáculos más grandes para Apple fueron que: 1) es un ambiente cerrado, bajo control de Adobe (liberaron el lenguaje después, pero no Flash Player) y a Apple no le gusta ceder control en nada, y 2) se convirtió en un software demasiado pesado, complejo y con grandes requisitos de hardware.

Esto último fue de mucho peso en la decisión de Apple de no incluir Flash en sus dispositivos. El tremendo consumo de potencia del CPU y de batería simplemente lo hacen demasiada carga para un aparato móvil.

En vez de Steve Jobs decidió que si había que presentar contenido rico en la web éste debería hacerse con estándares (HTML, CSS y JavaScript). Por supuesto esto alegró mucho a los que llevamos varios años abogando por lo mismo. Al mismo tiempo provocó una serie de críticas basadas en que estos aparatillos no podrían mostrar la verdadera “web”, presentar una parte importante del contenido que existe en ella, sobre todo la enorme cantidad de videos que dependen de Flash Player para reproducirse.

Tal vez las críticas hubieran tenido más fundamento si los dispositivos de Apple no hubieran resultado tan populares. Los que resultarían perdiendo no fue Apple, sino los dueños del contenido que ahora no se podía ver en el sector de más rápido crecimiento entre visitantes de la red. Muchos sitios mudaron su contenido a estándares, abandonando Flash casi por completo.

Esto no detuvo a Adobe, quienes desarrollaron una versión de Flash Player para dispositivos Android, pero nunca funcionó bien. Es lento, consume mucha batería y no soporta todas las funciones. Un sitio desarrollado en Flash para el escritorio simplemente no funciona nada bien en un teléfono, aunque pueda verse. Por lo menos los videos sí se ven bien.

Pero el problema más grave fue que la gente se dio cuenta que realmente no necesitan Flash, no se le extraña. Así que al fin Adobe ha decidido tirar la toalla, y anuncian que no desarrollarán más Flash Player para móviles.

Esto no significa la desaparición de Flash, va a continuar como aplicación para desarrollar contenido en la web, pero ahora junto con el tradicional swf también va a generar aplicaciones en formato nativo para Android, iOS y tal vez otros sistemas móviles (usando Air como plataforma). Flash Player va a seguir existiendo para PCs (Mac, Windows y Linux).

No está aún claro si esto quiere decir que también va a poder compilar animaciones en canvas y JavaScript, es decir, apegadas a los estándares de la web, pero no se antoja imposible.

Por otra parte, Flash aún ofrece funcionalidad que no es posible recrear con estándares, así que es muy poco probable que desaparezca por completo. Por lo menos pronto.

La web ha ganado

Uno de los principios de crear sitios web estandarizados es que estos deben ser accesibles, es decir, deben poder utilizarse por cualquier dispositivo o medio que tenga acceso a la web, no poner barreras artificiales a ciertos navegadores o equipos. Esto no quiere decir que funcionen igual, sino que se vean lo mejor posible aprovechando las fortalezas del medio donde se está mostrando.

Bajo este principio muchos de nosotros mantenemos que la “web móvil” no existe, solo la web. Los sitios que no se pueden utilizar en un dispositivo móvil es por estar mal hechos. Las razones por las que se hace mal un sitio va desde la falta de interés del diseñador por usar tecnologías estandarizadas, hasta la ignorancia de los dueños del sitio de que están perdiendo buenas oportunidades y visitantes por no tener un sitio que pueda verlo cualquier persona.

Uno de los más grandes culpables es Flash. Bueno, en realidad no es su culpa, si uno quisiera se podrían hacer sitios con Flash que puedan verse bien en una pantalla pequeña, optimizados para anchos de banda estrechos y se pueden usar técnicas de detección para servir Flash cuando tenga sentido y HTML tradicional cuando no.

El verdero problema es que muchos diseñadores han insistido en recargar sus “sitios” Flash de animaciones, imágenes y sonidos que no tienen razón de ser, dificultando su acceso y limitando su uso a unos cuantos dispositivos y anchos de banda. Todo por entender mal la finalidad de un sitio web.

Por lo mismo el plug-in de Adobe se ha vuelto cada vez más recargado y pesado, más grande, exigente e inestable. Los primeros en declararlo indeseable en dispositivos móviles fue Apple, quienes no lo implementaron en su versión de Safari para el iPhone. Android sí lo implementó, pero a menos que uno vea videos es fácil ver en un listófono Android todas las fallas de un sitio desarrollado en Flash y convencerse que Apple tenía razón: usar Flash en el móvil no tiene sentido.

La mayor parte de los dispositivos con que la gente accedera a la web en el 2015 serán móviles

Y en un mundo en que los dispositivos móviles se están convirtiendo rápidamente en la vía de acceso principal a la web esto es una falla terrible de parte de cualquier interesado en tener un sitio web.

Los últimos en darle la espalda a Flash son los de Microsoft. Windows 8 incluye la interfaz Metro, esta será la manera principal de usar una tableta o laptop con pantalla táctil, incluyendo la navegación por la web. Y el navegador web no puede usar Flash (ni otros plug-ins).

La razón oficial es la seguridad y simplicidad (o sea que esperan que esa interfaz la use gente insegura y simplona… que es lo más probable) y aunque es posible usar Flash si uno cambia la interfaz a la tradicional es casi seguro que la favorita para usar mientras se anda en la calle será Metro.

Ahora más que nunca es cuando los diseñadores que todavía están atados a Flash deben comenzar a aprender tecnologías estándar. Ni modo, van a tener que abrir el editor de texto y aprender HTML5 y CSS3 en lo que llegan herramientas gráficas que estén a la altura. Lo cierto es que ya no van a poder desarrollar el mismo tipo de sitio abigarrado y pesado. Y no nada más por las limitaciones de HTML5 y CSS3, sino también por las nuevas exigencias del medio: pantallas pequeñas, anchos de banda limitados; y el contexto en que la gente va a usar internet: en la calle no tienes tiempo de ver la animación de entrada ni de adivinar la navegación del sitio, simplemente quieres entrar, hacer lo que tienes que hacer y salir. Todo esto mientras estás en un alto, el autobús, en un restaurant o esperando en una esquina.

Este nuevo contexto exige una nueva mentalidad en el diseño y la capacidad de crear sitios que funcionen bajo diversas modalidades (de pantalla, de usuario, de lugar). Hasta el momento la mayor parte de los diseñadores ha demostrado ser muy inflexible, incapaces de pensar más allá del papel y adoptar un medio fluido y alterable por el usuario, siguen atados mentalmente a los viejos conceptos. Lo peor es que luego se burlan de los contadores e ingenieros cuando pueden ser igual de cuadrados o más.

Sin embargo, cada vez más son los verdaderos creativos que están experimentando con código, diseño y casos de uso para construir una web adaptada a esta década (iba a decir al siglo, pero quien sabe que pase en 10 años, menos en 100). Lo que me parece será el primer clavo en el ataúd de Flash y el diseño web “tradicional” (el ataúd lo construyeron los móviles, pero falta clavar la tapa y echarlo al hoyo) es el nuevo sitio del Boston Globe.

El diseño cambia y se adapta al dispositivo donde se esté mostrando, siempre de manera atractiva y teniendo en cuenta las necesidades de quien lo está leyendo. Intenta cambiar la ventana del navegador para que veas a lo que me refiero. Ethan Marcotte de hecho fue quien propuso por primera vez el concepto de “diseño responsivo” para describir este conjunto de técnicas y el Boston Globe es el primer sitio de gran tráfico que lo implementa. Aún más, este sitio se va a convertir en la “app” móvil para el periódico quienes podrán comercializarlo en cualquier plataforma sin gastar más o pagar derechos de piso por estar en la App Store.

Con esto solo los más recalcitrantes seguirán aferrados a Flash, ocultando a sus empleadores la verdad: Flash en la web está muriendo, excepto algunos casos de uso muy específicos usar Flash es una desventaja. Y esos casos disminuyen a cada instante.

Así que si eres “creativo” aferrado al Flash o “diseñador web” que no sabe que es CSS, ahora es el momento de empezar a aprender. Te quedan uno o dos años antes que tu especialización se vuelva un lastre, todavía estás a tiempo.

¿En realidad la pelea es entre HTML y Flash?

Armando Sosa opina sobre la trifulca del iPad y HTML5 vs Flash:

Dentro de un mes, más o menos, tendremos en el mercado la iPad, el nuevo producto de Apple que viene siendo anunciado como “La mejor forma de experimentar la web”. Lo que no dice Apple, es que la web que vas a experimentar no es la web del mundo real.Dupermag: ¿Flash contra HTML5? ¡Webkit vs. Flash!

En general estoy de acuerdo con Armando. HTML5 y Flash son soluciones distintas a problemas distintos, similares pero distintos.

Flash nació a principios del neolítico (1996 más o menos) como respuesta a la incapacidad de la web de ese entonces de mostrar gráficos de vector, animaciones y la interactividad limitada a hacer clic en ligas. Además le daba a los diseñadores un conjunto de herramientas de desarrollo que les permitían crear de manera fácil y más cercana a su experiencia aplicaciones en línea que podían servir a través de internet u otro medio (como CDs, aunque creo que se usaba más Shockwave para eso).

A partir de entonces HTML se ha desarrollado a pasos agigantados: css, javascript, html 4, xhtml y ahora html 5 han hecho posible que se puedan recrear muchas, pero no todas, las capacidades de Flash.

Por su parte Flash tampoco se ha quedado estático y es, hoy por hoy, el principal medio para servir video en internet. Del mismo modo las herramientas de creación de contenidos de Flash siguen sin tener comparación.

Flash no es perfecto: es un sistema propietario (aunque abierto), tiene problemas de accesibilidad y de indexabilidad, aunque se pueden solventar casi en su totalidad si el diseñador sabe como.

Sin embargo el problema más grande de Flash son los diseñadores que no entienden las limitaciones, sus ventajas y desventajas. Durante muchos años se abusó del uso de Flash y ahora suele asociársele con animaciones de introducción y sitios perfectamente inútiles.

Los estandaristas nos podemos regocijar un poco con la guerra de Apple vs Flash por la concientización hacia estándares que esto ha provocado, pero no debemos confundirnos. El enemigo a vencer no es Flash, sino el abuso de querer usar la ultimísima tecnología, lo más nuevo y vistoso sin ponernos a pensar en los objetivos del sitio ni los principios de usabilidad y accesibilidad que los deben acompañar.

Igual que pasó con AJAX, mucha gente está salivando ante HTML5 y CSS3 por la novedad, pero sin preocuparse por crear un sitio utilizable.

La iPad y el diseño web

Steve Jobs llamó a la nueva iPad “el aparato definitivo para navegar en la web”, algo así. Claro, está por verse que pasará pero lo más seguro es que la iPad se venda muy bien sobre todo en un segmento del mercado más o menos afluente y que de pronto se encontrará con que tiene en sus manos una nueva manera de acceder a la información de la red: desde cursos y videos de gatitos en Youtube, blogs, foros y aplicaciones en línea.

Todo esto tendrá un impacto en los diseñadores y desarrolladores de sitios. Aunque el iPad es un aparato muy flexible con una resolución generosa para un dispositivo portátil, no deja de ser más pequeña que un monitor normal en estos días. Además que se puede voltear para cambiar la orientación.

Por lo que hemos visto en el iPhone esto no será gran limitante pero de todos modos querrás hacer tu sitio adaptable a las diferentes resoluciones del iPad. Por ejemplo, aunque es posible que el iPad haga un zoom automático para meter la página en su pantalla conservando todas las proporciones, tal vez no quieras conservar las proporciones y sea más importante mantener un área con cierto ancho.

O tal vez quieras hacer ciertos elementos y contenido más prominentes en la pantalla del iPad de lo que son en una pantalla de escritorio. Esto implica diseños líquidos y flexibles, el diseñador tendrá que pensar en términos de distintas resoluciones y orientaciones. Es algo que algunos hacían hace un par de años pero con las nuevas funcionalidades de zoom se dejó de hacer. Ahora va a rescatarse.

Afortunadamente el iPad incluye un gran navegador con soporte para HTML5, CSS3 y JavaScript por lo que hacer estas cosas no representará gran dificultad técnica. De hecho, si eres de los que sigue las mejores prácticas de desarrollo web probablemente no tengas que hacer absolutamente nada.

Lo más complicado será cambiar la mentalidad del diseñador, sobre todo aquellos que no entienden bien el medio en que se están desenvolviendo. En más apuros estarán los diseñadores que no saben hacer sitios flexibles o que no se molestan en aprender html (esa cosa que sale cuando le aprietas en vista de código en el Dreamweaver). Si sus clientes se comienzan a dar cuenta que su sitio no se ve bien en el iPad (a ver si friegan igual que como cuando no se ve en IE6) muchos van a tener que ponerse al día de manera acelerada.

Más color de hormiga la tendrán los flasheros. Por flashero no me refiero a todos los desarrolladores de flash, sino nada más a los que todo lo hacen con flash sin consideración por la accesibilidad y usabilidad del sitio.

El iPad, hasta donde sabemos ahora, no soportará Flash. Así que si has hecho un sitio que sea puro Flash o que tenga elementos importantes, como la navegación, hecha en Flash, no se verá nada o será inutilizable para quienes tengan un iPad.

A lo mejor no te importa mucho, pero tus clientes van a estar perdiendo clientes y visitantes, así que no les va a agradar (ok, a los que se den cuenta), y finalmente te va a repercutir.

En las filas de Adobe no están nada contentos y culpan a Apple de la falta de soporte para Flash. No dudo que tengan parte de razón, sobre todo cuando señalan que el iPad no puede ser el dispositivo definitivo para navegar por la red si no soporta Flash.

Para bien o para mal Flash es parte importante de la red y pasará mucho tiempo antes que HTML5 alcance una presencia suficiente para desbancarlo (y que se desarrolle un IDE con el que los diseñadores puedan trabajar de un modo parecido a que lo hacen en Flash).

Adobe dice que no hay por que temer, la versión CS5 te permitirá crear una aplicación lista para iPhone simplemente haciendo click en “Save As…”, pero una aplicación no es un sitio web y habría que ver que tan bien se implementa esta característica.

Por lo pronto los fans de Flash están haciendo trinchera, pero si el iPad es tan exitoso como el iPod a mí me parece que no les quedará otra que admitir derrota y aprender estándares si no quieren ser arrollados por la Appleanadora.

El diseñador británico Andy Clarke está de acuerdo conmigo, por lo menos en la parte sobre el diseño líquido.

Tecnoblips 1

Las notas más interesantes que me he encontrado en la red este día.

Hoy tengo:
Jimmy Wales dice que la apertura no es enemiga de la calidad.
Flash CS5 llega los móviles y creará aplicaciones para el iPhone.
Microsoft desarrolla nuevos ratones táctiles.
Telcel piratea publicidad de Sprint.
Y Paul Boag comparte una interesante plática de Leo Laporte.

Lucha libre de relevos australianos 2.0: Microsoft y MySpace vs Facebook y Adobe

Arm wrestling in Bricklane II

Imagen de fabbio via Flickr

¡Damas y caballeros! ¡Pelearán a dos de tres caídas, sin límite de tiempo, por el título de red social y aplicaciones más chipocludas! En la esquina azul, Microsoft y MySpace, los emeses. En la esquina contraria, de azul con rojo, Facebook y Adobe, los fabs.

Resulta que MySpace y Microsoft se aliaron para portar una versión de MySpace a la plataforma Windows Mobile y usar Silverlight como plataforma oficial de aplicaciones en MySpace. Por el lado contrario, Facebook y Adobe también se aliaron para impulsar el desarrollo de aplicaciones hechas en Air y Flash.

MySpace era la primer red social por tamaño hasta hace poco cuando cedió ese lugar a Facebook, mientras que Microsoft es el desarrollador de los navegadores más usados en el escritorio (aunque nos pese a muchos) y también muy importante en los listófonos con acceso a web. De hecho hay más listófonos con Internet Explorer pero la gente lo usa mucho menos que el iPhone para navegar por la red porque… bueno, pues porque no es nada agradable usar IE para Windows Mobile. Sin embargo, Microsoft ha anunciado que pretenden cambiar esta experiencia de navegar por la red en su sistema en la próxima versión de WM, la 6.5.

Por el otro lado, Facebook es la red social más importante y todavía con un crecimiento importante, a pesar de hacer enojar a sus usuarios de vez en cuando con los cambios de interfaz. Adobe es el fabricante de Flash, la plataforma de desarrollo para web interactiva más extendida y Air, la plataforma para desarrollar aplicaciones de internet basadas en el escritorio. Esto permitiría a los desarrolladores de aplicaciones para Facebook el poder hacer cosas mucho más vistosas, más complicadas, usar herramientas ya conocidas y bien documentadas y combinarlas con aplicaciones de escritorio lo cual les daría mucha flexibilidad, tanto a ellos para desarrollar y distribuir la aplicación, como a los usuarios para utilizarla.

MS tiene algo similar en Silverlight, pero hasta el momento no se encuentra tan expandido como Flash, pero quienes han visto el nuevo Silverlight 3.0 dicen que tiene bastante para poner a Flash en aprietos; además de que también usa herramientas de desarrollo sumamente extendidas.

Nada más para hacer las cosas interesantes y ya para abrir las apuestas hay que hacer notar que Microsoft también tiene una inversión importante en Facebook, mientras que Google (arroz de todos los moles) tiene inversiones en MySpace. Y, claro, no olvidar que Microsoft tiene su propia red social, que no sabemos que pasará con ella. Así que no te pierdas lo que promete ser una interesante y divertida saga durante los próximos meses.

Flash por debajo de los menús

Esta es una duda con la que todavía me topo muchas veces a pesar de estar bien documentada. El caso es que muchas veces cuando tenemos algún contenido en flash, como un video, banner interactivo, menú, etc. y queremos que otro contenido en html se expanda sobre él nos encontramos con que no importa qué hagamos el flash siempre se ve encimado y tapa lo que queremos que se muestre.

Para comprender lo que está pasando necesitamos tener en cuenta que los plugins siempre se ejecutan independiente de la página a menos que le digamos otra cosa. A pesar de que nosotros lo vemos como parte de la página lo que el navegador hace es crear una ventana encima de nuestra página pero que no es parte de ella, y le pasa el control al plugin de flash o lo que sea para dibujar ahí todo lo que quiera. Es como poner una pintura en un cuadro sobre la pared.

Lo que nosotros queremos hace es que raye las paredes en vez de poner este cuadro encima. Para lograr esto flash reconoce una variable que se llama wmode. Esta variable puede tener los valores transparent, opaque o window. Si no le indicamos nada wmode toma el valor window y éste es el que causa que flash se ejecute en su propia ventana independiente.

O sea que la solución que buscamos es poner wmode en transparent u opaque. La diferencia entre estos dos es que transparent te permitirá tener áreas transparentes en el flash, que permitirán que se vea el fondo de la página. Por ejemplo, puedes dibujar una dona con un hoyo por el que se vea lo que está abajo en la página html. El modo opaque no se transparenta hasta la página, sino que la cubre (pero le puedes poner cosas encima).

Aunque Adobe recomienda el uso de transparent, este método ocupa más capacidad de procesamiento y puede hacer más lento tu flash en algunas computadoras. Es mejor ponerlo en opaque, hacer pruebas y si algo no funciona bien entonces cambiarlo a transparent.

Para cambiar el valor de wmode simplemente tienes que indicarlo en el <object> y <embed> que estés usando para llamara a tu película:

<object bla bla ... >
...
<param name="wmode" value="opaque" />
...
<embed bla bla ... wmode="opaque" ... />
</object>

¡Y ya!