El diseño responsivo es el dolor de cabeza de todo los días. Casi a donde quiera que miremos hay alguien que habla (o escribe) sobre él.
Entonces, ¿Qué hace que un esquema de diseño web sea más responsivo? El diseño responsivo es un enfoque para el diseño de la web que se adapta al usuario, a los diferentes tamaños de navegador en un dispositivo. El concepto ha estado presente desde hace unos pocos años, pero el 2013 es el año del diseño responsivo y se espera un enorme efecto ya que se implementa en un exponencial número de sitios.
El diseño responsivo funciona con el uso de media queries que detectan el dispositivo o la resolución del dispositivo y luego acceder a ellos. Una vez que esta determinación se ha hecho, una combinación de imágenes flexibles, tipos y tablas se ajustan a la pantalla en que se ve el sitio. Si quieres ver el diseño responsivo en acción, ajusta el tamaño de tu navegador en el que se ha implementado el diseño responsivo. Mashable es un gran ejemplo. Los ajustes te permitirán ver los que los diseñadores tenían en mente cuando lo crearon y lo diferente que esto puede ser.
Hace casi dos años, Mozilla anuncio “Boot to Gecko” (B2G), un proyecto cuyo objetivo primario era proporcionar un sistema operativo centrado en la web y que fuera además independiente, en el cual la plataforma preferida (de hecho la única) para el desarrollo de aplicaciones en HTML5. En esencia, este sistema operativo se habría llenado con un vacío que impedía que los desarrolladores crearan verdaderas aplicaciones nativas.
Este anuncio fue recibido con un sentido real de excitación por parte de la comunidad de desarrolladores para móviles. Firefox OS, como seria pronto nombrado apropiadamente, cautivó y emocionó a los desarrolladores web debido a la adopción de HTML5 por parte de Mozilla. Sin más elecciones entre Objective C y Java -HTML5 sería un primer ciudadano. En teoría, con ajustes menores a aplicaciones de HTML5, los desarrolladores podrían portar estas aplicaciones a Firefox OS sin dedicarle mucho tiempo (al igual que desarrolladores de PhoneGap han estado haciendo para otras plataformas).
Tan poderoso como nuestros pequeños dispositivos móviles, tienen una debilidad. No, no es la criptonita roja. Es la fuerza de la señal. Yo vivo en una ciudad de tamaño medio y todavía encuentro áreas donde mi teléfono misteriosamente deja de cargar datos. Es frustrante, pero lo que hace más frustrante situaciones como ésta, son aplicaciones que no manejan correctamente el estado offline.
Ciertamente algunas aplicaciones no pueden hacer mucho realmente si no están online. Siendo capaz de reconocer tu conexión de red y manejar los cambios es la marca de una aplicación superior. Vamos a empezar haciendo algunas modificaciones básicas en nuestra aplicación para manejar la comprobación de la conexión inicial, así como un cambio en la conexión.
Si alguna vez has construido un sitio web móvil, sabrás que el probar y depurar a través de múltiples dispositivos puede ser engorroso y, en ocasiones, doloroso. Adobe Edge Inspect ayuda a resolver esto al permitirte controlar fácilmente la navegación a través de múltiples dispositivos. Complementa tu flujo de trabajo con herramientas de depuración e inspección que te ayuden a determinar las causas exactas de un problema. Una vez se ha integrado Edge Inspect dentro del flujo de trabajo, se puede comenzar rápidamente a ver lo mucho que mejora ese flujo de trabajo cuando se prueban aplicaciones basadas en el navegador. Mientras más dispositivos necesites probar para tu aplicación web, más tiempo y esfuerzo te evitara Edge Inspect.
Adobe Edge Inspect
Este articulo cubre como configurar Edge Inspect en tu computadora y tus dispositivos y entonces menciona algunas de sus habilidades. Edge Inspect esta disponible con una suscripción gratuita a Creative Cloud. Si compras la suscripción completa a Creative Cloud o la suscripción a Edge Inspect, obtendrás la versión completa. La versión gratuita te permite un solo dispositivo conectado, mientras que la versión completa no tiene limite de dispositivos conectados al mismo tiempo.
PhoneGap es una tecnología de código abierto, que permite que los desarrolladores construir aplicaciones móviles nativas para todas las plataformas móviles. La mejor manera de pensar en una aplicación PhoneGap, es pensar como un navegador "Chromeless", donde la vista web ocupa todo el ancho y alto de la pantalla. Puedes construir la interfaz de toda la aplicación usando HTML, CSS y JavaScript.
Desde crear aplicaciones con HTML,CSS y JavaScript, tienes el completo control sobre cómo se ve, se siente, y cómo los usuarios interactuan con ella. Sin embargo, la interfaz de usuario se basa en una visión de la web, por lo que es muy fácil crear aplicaciones que se sienten cómo páginas web en lugar de aplicaciones. Para crear experiencias de aplicación que se sienta más como "apps", tienes que tener en cuenta la experiencia general del usuario y como las personas interactúan como el contenido visual de la aplicación.
