web analytics

Guía Rápida de anchos de pantalla para diseño web en smartphones y tablets

por

Este es un complemento a lo que explico con más detalle en otro artículo.

Desarrollar y diseñar para móviles o tablets es mucho menos complicado de lo que parece, al considerar sus resoluciones de pantalla. Uno puede marearse con las dimensiones estratosféricas en pixeles que los fabricantes presumen de sus smartphones más caros y avanzados, pero la realidad es que hay un patrón, una serie de anchos tanto en horizontal como en vertical que se repiten constantemente entre todos ellos, lo que permite hacer una tabla común agrupando diferentes tipos de aparatos. Todo esto lo explico con mayor detalle en este artículo. La siguiente, es una guía rápida de referencia, pera complementar y resumir lo que ahi se expone.

Landscape: La guía rápida para dispositivos con la pantalla en horizontal

landscapefinal

TAMAÑO ¿PARA QUÉ?
1920 El ancho de todos los monitores y televisores a 1080p ó “Full HD”
1440 MacBook Pro “Retina” de 15 pulgadas, notebooks con pantallas enormes y algunos monitores de PC de 17 pulgadas
1366 El estándar en buena parte de monitores de notebook (incluído el MacBook Air)
1280 La mayoría de los tablets de 10 pulgadas y algunos notebooks más antiguos (de los tiempos de Windows Vista). Es la resolución efectiva del MacBook Pro “Retina” de 13 pulgadas
1024 Todos los iPad, incluido los mini, sea cual sea su generación, tengan o no pantalla “retina”.
1024 Por lo menos el 40% de tablets Android de 7 u 8 pulgadas
960 El otro 60% de tablets Android de 7 u 8 pulgadas. También la PlayStation Vita
800 Teléfonos móviles con pantallas muy grandes o especiales. No es un largo muy común. Ejemplos: HTC Desire y (de verdad grande) Samsung Galaxy Grand
640 El preferido por buena parte de los teléfonos de gama alta vendidos desde 2012. Ejemplos: Galaxy S3 y S4, HTC One, Optimus L9, entre otros.
596 Promedio entre teléfonos de gama media vendidos desde 2013 y otros de gama alta que encuentran que 640 de alto es mucho (puede ser un poco más o menos dependiendo del dispositivo). Ejemplos: Moto G, LG G2, Nexus 5, Galaxy Nexus.
568 iPhone 5, 5S, 5C y iPod touch de 5ta generación
533 Equipos de gama media vendidos desde 2012 y gama alta desde 2010, para conseguir una pantalla a 16:9 siguiendo con la norma de los 320 pixeles de ancho. No son pocos: Nexus S, Galaxy S, S2, Ace 2, varios HTC Desire y HTC One menos caros, Optimus L7, Optimus Black, Optimus 2X…
480 El largo del primer iPhone, que se impuso como estándar y lo sigue siendo para parte considerable de celulares inteligentes. iPhone 4S y anteriores, Galaxy Ace, todos los Nokia Lumia, Xperia Mini, Optimus L5… e incluso los nuevos con Firefox OS
400 Samsung Galaxy Mini
320 Los pequeños androides: Optimus L3, Galaxy Y. También la Nintendo 3DS en su pantalla inferior.

En la segunda parte, la guía rápida para las resoluciones en vertical o “portrait”

Este artículo es demasiado largo. Asi que lo dividí en más de 1 parte