De resoluciones

Los que leáis esto a través de sindicación tendréis que visitar el original para ver las gráficas, me temo. Fuente: StatCounter Global Stats – Screen Resolution Market Share

Era la noticia de ayer (yo me enteré por un tuit de @lucascepeda): StatCounter publicaba nota de prensa proclamando que sus datos sobre el mes de marzo marcan un sorpasso: la resolución de pantalla más común en el mundo ya no son los sempiternos 1024×768, sino la resolución típica de los ultrabooks de 13″ y las pantallas panorámicas ‘pequeñas’ (hace unos años, decir que una 19″ era ‘pequeña’ habría provocado comentarios de todo tipo…): 1366×768. La noticia, en sí, tiene su interés, pero plantea un par de notas adicionales…

¿Dónde?

Sí, el cambio mundial ha tenido lugar en el último mes… en el mundo. Pero, por ejemplo, en Europa, el 1024×768 perdió la hegemonía hace seis meses:

Fuente: StatCounter Global Stats – Screen Resolution Market Share

Sí, Europa es un continente “avanzado” y con un panorama diferente. Y ni siquiera toda Europa se comporta igual. En España…

Fuente: StatCounter Global Stats – Screen Resolution Market Share

Esto es: aunque tuviese sentido pensar en la “la resolución más usada” a la hora de pensar una web (que, en mi opinión, hace bastante tiempo que no lo tiene), mejor no hacer caso de las presuntas tendencias porque la foto va a ser muy diferente dependiendo de dónde esté nuestro público, pero también de muchos otros factores (con el poder adquisitivo a la cabeza). Si tenéis que hacerlo, ignorad la tendencia y considerad los datos de vuestra analítica web…

Ojo con la línea de puntos

Repasad las gráficas. En el mundo, hace tres años el 60% del mercado se cubría con dos resoluciones, y el ‘top 10’ representaba el 88% de pantallas, mientras que hoy hacen falta las tres resoluciones más comunes para pasar del 50% y el ‘top 10’ sólo cubre el 82% de pantallas. En España, la situación es similar. Las colas de la distribución se están alargando y la línea de puntos, la que representa a las “otras resoluciones” cada vez pesa más. El ecosistema se diversifica y, lo queramos o no, no va a quedar más remedio olvidar el concepto de dirigirse a una cierta resolución.

Un píxel ya no es lo que era

Una de las cosas complicadas de colocar cosas en una pantalla es que hace tiempo que dejamos de saber a priori qué tamaño físico tiene esa pantalla, ni la ratio (¿4:3, 16:9, 16:10, 2.35:1?) ni cuántos píxeles tenemos a mano (ni, por tanto, la densidad de esos píxeles en pantalla, que hoy en día puede ir de algo más de 100 para una pantalla de ordenador a más de 200 en algunos dispositivos móviles).

Parece ser que el hecho de que esto sea así desde hace tiempo no ha evitado que cobre especial atención ahora por el rumor de que la próxima iteración de hardware del iPhone se va a ir a unos muy espectaculares 960×480 píxeles, lo que ha hecho que, naturalmente, se inquieten los desarrolladores, tanto web como de aplicaciones nativas, que obviamente no quieren que sus aplicaciones se encojan hasta niveles ridículos en una pantalla muy grande. Es fácil suponer que Apple no va a meter la pata con una cosa así, pero me ha llevado a QuirksBlog, que le dedica una entrada al tema, A pixel is not a pixel is not a pixel que habla, a su vez, de la solución que tiene Android para el tema (la diversidad de pantallas de los dispositivos Android provoca vértigo y, en más ocasiones de las deseables, nauseas…). Copio-y-traduzco de la página de soporte para múltiples pantallas:

Density-independent pixel (dip)

Una unidad de píxel virtual que pueden utilizar las aplicaciones para definir su IU para expresar dimensiones de ‘layout’ o posicionado independientemente de la densidad.

El píxel independiente de densidad es equivalente a un píxel físico en una pantalla de 160 ppp, la densidad base asumida por la plataforma […]. Se recomienda fuertemente usar unidades dip para definir la IU de la aplicación, como forma de asegurar una buena presentación de la IU en diferentes pantallas.

Cosas veredes, Sancho…

Tree Style Tab. Las pestañas de Firefox, en vertical

Capura de pantalla de Firefox con hasta 18 pestañas abiertas en vertical
18 pestañas abiertas sin problemas

No nos engañemos. Pocas webs hay que, pasados los 1024 puntos de resolución horizontal, sean legibles sin derrochar espacio en blanco en grandes cantidades a los lados. Y no creo que la cosa vaya a cambiar a medio plazo. Dice Google Analytics que más de los visitantes de este blog tienen la mágica resolución horizontal de 1024, alrededor del 28% están en los 1280 y menos del 9% están por encima (Nota: en el último mes Analytics registra hasta 98 resoluciones distintas entre los visitantes a otro blog más. Por arriba llegamos hasta 2560×1600, pero cada vez abundan más las resoluciones de los dispositivos móviles: 320×396, 240×320, 480×272… Son aún una ínfima minoría, pero van en aumento). Con la implantación de los ‘smartphones’ de todas las marcas y colores y la llegada de los ‘netbooks’, vuelve a haber cada vez navegadores de 800 y 1024. Si sumamos a ello lo difícil de diseñar una web legible a grandes resoluciones que no se descuajaringue entera si se le baja la resolución, poco probable es que encontremos muchas web que rellenen la pantalla de ese monitor de 17, 19 o incluso más pulgadas que tenemos sobre la mesa. Más aún si es panorámico.

¿Y qué hacer con todas esas pulgadas cuadradas? Vista propone su ‘Windows Sidebar’ pero, entre nosotros, muy muy útil a mí no me resulta, al menos. Otra solución: girar el monitor (si se deja) y convertir el espacio horizontal en vertical que, curiosamente, hace más falta. Pero sí hay algo que hace que me quede sin espacio horizontal navegando: abra usted 15 pestañas (o más, como era el caso cuando se me ha ocurrido hacer la entrada) en el navegador de turno. O se ‘caen’ por los lados o se estrechan hasta que no sabemos qué hay dónde… a no ser que en vez de colocarlas en horizontal bajo las barras de herramientas las pongamos a un lado, una sobre otra, aprovechando todo ese espacio hasta ahora malgastado, gracias a la extensión Tree Style Tab para Firefox. No evitará que nos quedemos sin espacio si nos ‘regalamos’ con lo de las pestañas, pero habrá que pasar de 30 abiertas en un monitor de 1024 puntos de resolución vertical…