Cómo puede adaptar un desarrollador web sus sitios web a la pantalla Retina Display


http://www.ipadizate.es

Cómo puede adaptar un desarrollador web sus sitios web a la pantalla Retina Display

 Cómo puede adaptar un desarrollador web sus sitios web a la pantalla Retina Display

Que la pantalla Retina Display del nuevo MacBook Pro es alucinante no lo puede negar nadie que la haya visto en directo. Una pantalla con 5 millones de píxeles y una resolución de 2880×1800 es algo completamente extraordinario, se mire por donde se mire. Pero hay algunas personas que quizás no la vean con tan buenos ojos, y estos son los desarrolladores web. Las pantallas Retina Display ya están en el iPhone 4 y 4S, iPad de tercera generación y MacBook Pro, y lo más probable es que se empiecen a extender a otros equipos como los iMac, MacBook Air, etc… Así que los sitios web deberán adaptarse.

Thomas Fuchsdesarrollador web de Ruby on Rails, ha publicado un diagrama donde muestra qué pasos se deben seguir para adaptar un sitio web para que se visualice correctamente en las pantallas Retina. Thomas demuestra así que no solo hay que doblar la resolución de la imagen, tal y como opinan muchos otros.

El diagrama muestra que lo que se debe hacer es dividir por el tipo de contenido, y así adaptar solo lo necesario. Si es desarrollador web entenderás mejor el diagrama, pero podemos como ejemplos podemos comentar que si el contenido es texto no hay que tocar nada; pero con las imágenes se complica un poco la cosa, ya que tendremos que doblar su resolución  y además incluir código CSS adicional en la hoja de estilo.

De momento no parece que haya muchos sitios web adaptados más allá del site oficial de Apple. Tampoco creo que los desarrolladores tengan demasiada prisa en hacer estos cambios, al fin y al cabo solo hay 3 equipos que tienen pantalla Retina Display y dos de ellos son “móviles”.

¿Alguno de vosotros tiene un MacBook Pro con pantalla retina y puede contarnos como se ven los sitios web?

Comparte este artículo con tus amigos en Facebook, Google+ y Twitter con los botones que encontrarás al principio del mismo. ¡Muchas gracias!

Diagrama completo | Enlace

Vía | Applesfera