Hoy vamos a comentar lo que consideramos que es un diseño web de respuesta para que sea visible en cualquier resolución. Algo que no siempre podemos cumplir por tiempos o costes de los proyectos, o porque nuestros clientes no están interesados en llegar a ese nivel de compatibilidad con dispositivos y ordenadores. Mostraremos algunos ejemplos de sitios webs que no solo se ven bien a máxima resolución, sino que se escalan perfectamente a cualquier tamaño de pantalla, incluso dispositivos móviles como teléfonos, tabletas, netbook, … un mismo diseño aplicado a una gran gama de formatos siempre bien presentado.
¿Qué que es el diseño web de respuesta?
Nuestros sitios web ya no son visto solo desde un monitor de ordenador. Móviles, smartphones, netbooks, tabletas, … todos con una gran variedad de resoluciones y tamaños de pantalla diferentes que no hace más que complicar el trabajo de los diseñadores. La idea de dar soporte para múltiples resoluciones ofreciendo la respuesta correcta en cada situación no es nueva. Todo empieza con el diseño de sitios estáticos y con anchos e imágenes fijas, o la creación de sitios líquidos y flexibles donde las áreas se basan en porcentajes, las imágenes se escalan según la resolución, … todo posible con un buen trabajo de CSS para determinar ancho mínimo (min-width) y orientación (orientation) del dispositivo. Un primer paso puede ser crear una versión móvil, seguido de buscar la mejor solución para personalizar el diseño para una serie de resoluciones.
Ejemplos de webs en inglés con aplicación de diseño web de respuesta
No vamos mostrar una lista completa de este tipo de sitios, pero podéis ver la lista completa en el artículo en el que tenemos la referencia, que está en inglés en Line25. Cada ejemplo muestra una vista previa de la web completa como un ejemplo con una resolución pequeña, pero para conseguir una experiencia completa lo mejor es que visites el sitio web y juegues a cambiar la resolución de la ventana, incluso visualizarlo en dispositivos móviles y tabletas.
Hora del planeta (francés)
Laufbild Werkstatt (diseño cocinas/muebles)
