TinySrc, una pequeña gran idea para servir imágenes en la web

Más que nunca, y pese a lo que diga el W3C, no vivimos en una web (el W3C lo sabe, y hasta lo explica bastante bien, pero lo de ‘One Web’ a mí me suena fatal como nombre, la verdad).

Existen tipos de contenidos que no se adaptan bien a la inmensa diversidad de dispositivos y resoluciones de la web de hoy. Un ejemplo son las tablas: quien espere que una tabla mínimamente compleja se presente bien cuando el ancho de pantalla es de 400 píxeles, no sabe de qué habla. Sí, con los móviles actuales hacer scroll es fácil, pero las tablas, o al menos muchas tablas, sólo tienen sentido si podemos ver (y leer) simultáneamente las cabeceras y los contenidos. Hablamos de separación de presentación y contenidos, pero para que una tabla tenga sentido en un dispositivo de baja resolución (incluso un iPhone 4, con sus brutales DPIs), o te comes la tabla o le añades una capa de comportamiento para que la cosa tenga un mínimo de legibilidad.

Con las imágenes pasa otro tanto. Hoy en día, una imagen para la web puede nacer perfectamente como una foto digital de tres o cuatro mil píxeles de ancho. Y la podemos querer servir a una pantalla de 1920 píxeles de ancho, a otras de 1280, a dispositivos móviles con 200, 300 o 400 píxeles de ancho (u 800 o 900 si apuntamos al Retina Display)… y hasta podemos querer conservar toda la resolución original para la versión para imprimir.

Un CMS actual, como WordPress, hace lo que puede y, si el tamaño de la imagen no se le atraganta, genera un ‘thumbnail’, una versión ‘mediana’ y otra ‘grande’ de lo que le subamos, en el momento de subirla. Pero eso no suele ser suficiente. ¿Qué podemos hacer con una imagen de 6 o más megapíxeles, para servirla ‘como dios manda’ a todos los dispositivos, presentes y futuros?

Una imagen de ejemplo de escritura cuneiforme, presentada a 550 píxeles de ancho
Imagen tomada en el Louvre. Un clic lleva al original, a 3587 por 2373 píxeles

Podríamos servir una imagen ‘grande’ siempre y fiarnos del reescalado del navegador. Pero eso es un derroche de recursos bastante irresponsable (la imagen de arriba, a resolución completa, pesa 2 megas, y un plan móvil de datos te da 500 al mes… Además, muchos navegadores siguen haciendo verdaderos destrozos al reescalar imágenes.

Lo que hace falta, pues, es un servicio web que a partir de la imagen original genere ‘al vuelo’ (y almacene en caché) la imagen de turno a la resolución y necesaria, en el formato adecuado. Y, a poder ser, en caso de necesidad, nos deberíamos poder fiar del servicio para pedirle una imagen «a la resolución necesaria para el dispositivo, por favor»).

Y esa es la proposición que hace, precisamente, tinySrc, un servicio que lleva al menos año y medio dando vueltas por ahí. Si queremos la imagen a 1280 píxeles de ancho, por ejemplo, basta pedirle http://i.tinysrc.mobi/1280/URL_de_la_imagen. Y si la queremos a 400 píxeles de ancho…

La imagen anterior, a 400 píxeles de ancho
¡Magia!

De hecho, uno preferiría una implementación de código abierto, a poder ser integrada a través de un plug-in con WordPress, claro :-). Si alguien conoce algo similar, que deje comentario, por favor. Pero, mientras tanto, una herramienta más a añadir al arsenal.

Un navegador es un programa MUY complicado de usar…

Y no lo digo yo. Que levante la mano el que opine que cambiar la página de inicio del navegador es una tarea compleja. ¿Nadie? Nadie. Y sin embargo, ¿cómo nos está saludando estos días Facebook?

En la cabecera de Facebook se dan las instrucciones "para tontos" sobre cómo hacer que Facebook sea la página de inicio del navegador
Facebook opina que para muchos de sus usarios, es difícil

Opine uno lo que opine sobre Facebook y sus políticas, creo que estaremos todos de acuerdo en que tienen más éxito que nadie y que buena parte de su éxito se basa en conocer a sus usuarios mejor que nadie. Y también estaremos de acuerdo en que, para centenares de millones de usuarios, el mejor candidato a ‘home’ es Facebook.

De ello podemos concluir que Facebook ha comprobado, antes de hacerle esa atrocidad a su cabecera, que el porcentaje de usuarios que no tienen Facebook como ‘home’ es alto, y que valía la pena explicarlo «para tontos», porque los usuarios que van a alucinar en colores (como todos los presentes, sin ir más lejos) pesan mucho menos que todos aquellos que, muy probablemente, ni sabían que podían hacer que la página de inicio del navegador no fuese ni Google ni MSN…

Deprimente, sí. Pero más vale ser consciente del mundo en que nos movemos que fracasar porque opinamos que el usuario medio es como nosotros…

WorldWideWeb: Proposal for a HyperText Project

Qué velocidad. Ayer, 12 de noviembre de 2010, se cumplían 20 años de que un señor, de nombre Tim Berners-Lee, enviase un correo presentando un proyecto para elaborar una ‘cosilla’ en el CERN llamada ‘WorldWideWeb’… Como documento fundacional, hay unas cuantas constituciones y leyes por el mundo que probablemente sean más importantes, pero es difícil pensar en algo escrito en el siglo XX que haya tenido más importancia para la humanidad…

El documento original, WorldWideWeb: Proposal for a HyperText Project, puede consultarse en la web del W3C, pero he pensado que sería un buen ejercicio traducirlo y dejarlo aquí…

Como de costumbre, las advertencias habituales: a pesar de que es una traducción hecha con cariño, seguro que no está exenta de fallos (tenéis los comentarios para avisar de ellos :-) ). Y, en cualquier caso, siempre que sea posible, mejor acceder al texto original.
Continuar leyendo «WorldWideWeb: Proposal for a HyperText Project»

Drumbeat: hacking education

A veces vas a un evento con el absoluto convencimiento de que no puede ser tan bonito como lo pintan. En el caso del festival Drumbeat, que ha organizado esta semana la fundación Mozilla esta semana en Barcelona (con más que notable colaboración local), era imposible que funcionase. Una ‘unconference’ de magnas proporciones, con un programa-wiki, con pocos oradores (aunque no por falta de nombres, que uno a veces tenía la impresión de que el universo geek en pleno estaba allí) y colaboración constante. Decían que

We are educators, hackers and innovators from around the world making, teaching and inventing the future of education and the web.

(Somos educadores, hackers e innovadores de todo el mundo, creando, enseñando e inventando el futuro de la educación y la web.)

Una promesa imposible de cumplir…

Una foto de una red social construida con post its y rotuladores sobre un tablón
LoFi vs redes sociales vs MACBA

Y sin embargo el miércoles por la noche presencié como un ejército de, efectivamente, educadores, hackers e innovadores, tomaba al asalto el MACBA, para una recepción inicial puntuada por una nanocharla de Joi Ito (lo cuenta Carlos en *gonzolog, donde encontraréis hasta tres entradas más sobre el tema: ¡qué más da la universidad, tenemos la www!, Aprenda usted como quiera y Laboratorio prácTICo). Y la recepción quedó eclipsada por la ‘science fair’ que debía ser una parte: el mundo ignorando a los camareros y el catering para ir de mesa en mesa, conversar, aportar, construir. Y me pareció que, quién sabe, a lo mejor se podía cumplir parte de la promesa…

Grupo de académicos discutiendo cómo llevar la educación adelante
No se ve en la foto, pero eso es una tienda en medio de la plaza del MACBA, que durante un par de días dejó de ser 'territorio skater'

Y me volví a pasar el jueves. Sólo un rato, porque tenía otros compromisos por la tarde, con Aníbal de la Torre (@anibaldelatorre). Creo que su ‘twitter stream’ de la mañana siguiente, resume perfectamente qué es Drumbeat…

formato #drumbeat se parece muchísimo a lo que a mi me gustaría que fuera un evento formativo-educativo, MUCHíSIMO - organizar un evento implica promover previamente una actitud de participación determinada - Hay que saber que se acude a participar y comprender qué tipo de implicación se espera de nosotros - Los eventos deben marcar dos o tres principios ideológicos explícitos - Solo se puede hablar de "mi libro" desde la perspectiva de buscar agujeros negros, mejoras, errores... - Las estrellas y protagonistas son los espacios físicos (temáticos), no los ponentes (casi ni existen) - Lo que marca el éxito de un evento es la actitud del participante y eso se debe trabajar previamente - Los participantes pueden participar en CUALQUIER espacio y en TODO momento - de eso que suspiras al salir diciendo... ¿cuántos años nos quedan para trabajar así aquí?
Yo no lo podría haber dicho mejor...

El rato se acabó convirtiendo en unas pocas horas. Y nos fuimos porque no nos quedaba más remedio… Y las cosas que vimos. No quiero olvidarme, sobre todo, de ver a todo un grupito de geeks aprendiendo sobre los ritmos del flamenco, con las palmas que provenían, en vídeo de alta definición, sin apenas latencia, del MusicLab, en Cornellà, gracias a la red ciudadana de guifi.net. Tecnología libre para enseñar flamenco a una panda de geeks. Grande… Y el problema es que mejor que lo que vimos fue lo que no llegamos a ver. P.T. Barnum inventó el circo con tres espectáculos simultáneos. El programa del Drumbeat, con sus once espacios paralelos, no cabe en una pantalla de 1024 píxels de ancho… Software libre, ‘badges’ para la educación, Arduino, un ‘hackbus’, contenido abierto, repensar la academia, Mediawiki, entornos personales de aprendizaje… Todo a la vez. Una auténtica sobredosis :-). Una de las cosas que me perdí: Aza Raskin haciendo una sesión de prototipado ‘en vivo’. Suerte que lo ha recogido en su blog, How To Prototype And Influence People (momento fan: la entrada la acabó de escribir cuando le tenía a un par de metros de distancia, mientras escuchaba a Brian Lamb & Co explicar las virguerías que hacen con MediaWiki y WordPress en la UBC).

Sesión de trabajo en el Drumbeat...
Toca remangarse...

El viernes, afortunadamente, sí pude pasarme desde primera hora de la mañana. Uno de los espacios se dedicaba al arte y tecnología de hacer la web (la etiqueta, ‘webcraft’, para comenzar, ya me encanta) y era de obligada asistencia para mí… Y la primera cuestión, la que ilustra para mí qué es el Drumbeat, es que la noche anterior, a raíz de la traducción del curriculum de estándares web de Opera que hicimos en la UOC, me encuentro con un correo de Chris Mills (‘Developer Relations Manager, Opera’, nada menos) que me pedía que fuese a una de las sesiones. Y allí me encuentro a Christian Heilmann, d3e la Yahoo Developer Network, o a Pippa Buchanan, o a Henny Swan, que no han venido [solamente] a explicar lo mucho que saben, sino a preguntar y escuchar. Y a trabajar. Ahí arriba, en la foto, tenéis a Henny en el suelo, currando duro.

Porque ese es otro de los aspectos destacables de Drumbeat: sesiones que comienzan con una breve presentación, una llamada al trabajo práctico, organización en grupos, trabajo intenso y presentación de conclusiones… todo en cincuenta minutos. Agotador. Alucinante.

Todavía me dura la resaca. Y espero que dure :-). Como dice Aníbal más arriba, me pregunto cuántos años quedan para que el modelo Drumbeat se imponga.

PS Por cierto, que para dar fe de que pasé por allí…

Foto del autor en el Festival Drumbeat
Foto de Christian Heilmann, clic en la foto para acceder al original. Foto licenciada 'cc atribución'

La web móvil, vista desde Opera Mini

Interesantes los números del State of the Mobile Web, September 2010 de Opera, que recoge el tráfico generado por su navegador para móviles Opera Mini. Algunos detalles destacados:

  • Globalmente, más de 70 millones de usuarios únicos y treinta y seis mil millones de páginas servidas. Para 30 días, no está mal, y sale a alrededor de 50 páginas por usuario y mes…
  • España es su séptimo mercado… dentro de la UE. Y ninguno de sus ‘top 10’ está en la UE. El top 10 lo componen Indonesia, Rusia, India, China, Ucrania, Sudáfrica, Vietnam, Estados Unidos, Nigeria y Brasil.
  • Es interesante ver en qué dispositivos se usa Opera Mini dependiendo del país. En Indonesia, India o Nigeria, los diez dispositivos más usados son de Nokia (que nadie entierre a Nokia antes de tiempo: el mercado de los smartphones no será suyo, pero siguen siendo los reyes en unidades vendidas). En Brasil manda el Sony Ericsson W800, y en muchas listas aparecen Samsungs y LGs. Eso sí, allí donde se venden iPhones, estos mandan: es el dispositivo número uno en Estados Unidos, Reino Unido, Alemania, Italia, Francia, la República Checa, Holanda y España (y el sexto en Brasil, el quinto en Polonia y Eslovaquia y el tercero en Rumanía). Que quiere decir, de regalo, que aceptar otros navegadores en la App Store de Apple sí tenía un cierto sentido (aunque, aún sin saber los números exactos, es fácil suponer que el uso de Opera en el iPhone es muyminoritario).
  • Por lo que respecta a España, el crecimiento en páginas vistas desde el año anterior es del 205%, y del 58% en usuarios únicos: por tanto, se dobla el consumo en páginas vistas por usuario, hasta llegar a 200 páginas por usuario y mes, con un peso medio por página (después de la compresión que hace Opera) de 27 KBs. Las páginas más vistas (en usuarios únicos) son: Google, Facebook, Marca, Youtube, El Mundo, Tuenti, live.com, my.opera.com, Wikipedia (míranos qué cultos) y ElPaís.com.