El Kindle Fire es el nuevo reto para los diseñadores web

07-12-2011

El desarrollo web se pone interesante con la aparición de nuevos dispositivos móviles

Hace unos pocos días salió a la venta el muy anticipado Kindle Fire, el nuevo “lector de libros” de Amazon que además de leer libros es algo así como una tableta.

Y digo “algo así” porque en realidad no es una tableta, competencia del iPad u otras similares, sino es un dispositivo diferente que ocupa un nicho entre el lector antiguo y el iPad, el Xoom, el Galaxy Tab y demás.

Como tal es más limitada. Lo que no es muy limitado es la pantalla, tiene una resolución de 1024 x 600 pixeles, lo que la coloca en la categoría de algunos monitores de 14 o 15″ de antaño. El problema es que su pantalla es de solo 7″, por lo que todo se ve mucho más pequeño.

La resolución de la pantalla del Kindle hace que nuestros sitios web se vean completos, pero la densidad, es decir, el número de puntos por centímetro, es mucho mayor, los pixeles son mucho más pequeño y por tanto todo nuestro sitio se verá más pequeño: tamaño de letra, botones, imágenes, etc.

El experto en usabilidad Jakob Nielsen dejó al Kindle por lo suelos cuando se trata de usar sitios web. De plano recomendó a los desarrolladores a presentar el contenido móvil en un Kindle. El problema es que la pantalla es bastante más grande que un móvil por lo que no estaremos aprovechándola bien.

¡Qué dilema! El Kindle es apenas el primero de una clase nueva de dispositivos: pantallas pequeñas con una gran densidad de pixeles. Además es un dispositivo móvil, así que de todos modos el contexto en que se usará seguramente será muy diferente al de una computadora de escritorio, o incluso un teléfono. Así que estaría mal darle la misma página que le damos a una PC o a un iPhone.

La mejor manera de acercarse al desarrollo de un dispositivo como estos sería usando la característica resolución para un media query en css:

media: screen and (min-resolution: 99dpi);

Esto nos ayudaría a determinar si la pantalla de nuestro visitante es de muy alta densidad y poder así presentarle botones más grandes e imágenes de mejor calidad, y tal vez ocultarle o quitar relevancia a partes que tienen sentido en otro tipo de aparatos pero no en una tableta.

La diferencia entre una pantalla de 10″ y una de 7″ es notoria y presenta nuevos retos para el diseño de sitios web. Foto de Gadgetmac.

Desafortunadamente no tengo un Kindle Fire para probar (se aceptan donaciones :) ) y no sé si aceptará este tipo de media query. Sería lo ideal porque así nos aseguramos que otros dispositivos en el futuro también podrán ver nuestro sitio correctamente.

Si no tendremos que recurrir a métodos un poco más salvajes, como la detección por medio de javascript, lo cual tiene inconvenientes.

Es un reto más para los diseñadores y desarrolladores web. Nos dificulta un poco más el trabajo, pero es parte de lo que lo hace emocionante. Y eso que no mencioné que el usuario puede estar usando el Kindle horizontal o verticalmente.

Comentarios: 2

Roberto Baca

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

09-11-2011

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 [...]

Comentarios: 0

Ventajas de usar WP sobre un sitio estático

06-10-2011

Hace poco tiempo me encontré con alguien que quería hacer un sitio web, una página estática simple y buscaba alguien que se la hiciera en puro html. -¿Por qué no en WordPress de una vez?- le pregunté yo. -¿Qué ventajas me da WordPress sobre un html para un sitio estático? Después de todo no lo [...]

Comentarios: 0

La web ha ganado

18-09-2011

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 [...]

Comentarios: 1

Usando CSS para poner guiones automáticamente

18-08-2011

En la escuela nos enseñaron que para usar toda la hoja al escribir deberíamos separar las palabras que no quepan al final del renglón con un guión al final de una sílaba. De esa manera podríamos usar mejor el papel. Esa solución se ha utilizado en la tipografía desde las primeras imprentas. En la web [...]

Comentarios: 0