El primer diseño web móvil
Video: Conferencia: Miguel Angel y diseño web para móviles #mejorandomx
Dos grandes categorías de estrategias se han empleado en los últimos años para apoyar el diseño web para dispositivos móviles: Degradación agraciada y mejora progresiva. Gran parte de la web es actualmente casi inutilizable en los dispositivos móviles, ya que fue diseñado para navegadores de escritorio y no se adapta bien a las pequeñas pantallas.
Video: Seminario Web Movil -- Primera Parte - Diseño Web Movil Sin Código
los usuarios de Internet móvil se ven obligados a ampliar, desplazarse, pellizco, estrabismo, y hacer que sus dedos lo más pequeño posible de utilizar la mayoría de los sitios web diseñado hace más de un par de años.
estrategia de diseño web degradación elegante para dispositivos móviles
La idea detrás de degradación elegante es el diseño de su sitio web principalmente para los usuarios de escritorio, sino también diseñarlo de tal manera que las características del sitio de escritorio que no funciona o encajar en los dispositivos móviles seguirá siendo utilizable - si no es bonito o como funcional - en los dispositivos móviles.
degradación elegante era una buena filosofía de diseño en los días antes de los teléfonos inteligentes con navegadores con todas las funciones existía. Sin embargo, la degradación elegante tiene grandes problemas. Lo más importante, degradación elegante obliga al usuario a descargar toda su sitio web, sólo para ser mostrado una versión degradada de la misma. En los dispositivos móviles, que a menudo han limitado ancho de banda, esto no es una buena cosa.
estrategia de diseño de páginas web mejora progresiva para dispositivos móviles
Como resultado de las limitaciones de gracia de degradación, una nueva estrategia denominada mejora progresiva se ha vuelto popular. mejora progresiva comienza con el sitio web muy más básico y agrega las características dependiendo de lo que es compatible con el navegador del usuario.
mejora progresiva permite a los sitios web para ser utilizable incluso cuando se utiliza un teléfono móvil muy básico. El navegador móvil no necesita descargar una gran cantidad de código CSS y javascript (por ejemplo) que no sabe qué hacer con él.
Una manera de visualizar la mejora progresiva es como un sistema que añade capas en un sitio web en función del tamaño del navegador o por las características del navegador es compatible.
Video: Curso de diseño de interfaces móviles
He aquí un ejemplo sencillo de cómo dos enlaces de hojas de estilo se pueden utilizar para mejorar una página web para móviles para los navegadores más grandes:
El primer enlace incluye style.css para cualquier pantalla o dispositivo de mano. En este caso, style.css contiene estilos que están optimizados para un dispositivo móvil.
El segundo enlace es para una hoja de estilo llamado enhanced.css. Si nos fijamos en el medios de comunicación atribuir a este enlace, se dará cuenta de que tiene una min-width condición. los enhanced.css archivo sólo se incluirá si el dispositivo es mayor que 800px. Dentro enhanced.css, el diseñador de páginas web puede anular las propiedades de la style.css hoja de estilo para hacer que el navegador escala para anchos de navegación más grandes.
El primer diseño móvil resuelve el problema de tamaño del navegador
Mobile primera es una filosofía de diseño que emplea las ideas de mejora progresiva para construir sitios web para móviles primero y luego mejorarlos para el escritorio. Lo bueno de móvil primer diseño es que cuando se construye el sitio móvil en primer lugar, en lugar de a la inversa, se obtiene un sitio funcional de escritorio de forma gratuita!
Video: Diseño web móvil en Málaga
Piense en todos los sitios web que usted ha visto que no encajan en los navegadores móviles. Ahora, imagina visitar un sitio web móvil con un ordenador de sobremesa. Un sitio web que está optimizado para una pantalla pequeña siempre funciona en un navegador de escritorio - incluso si no terminan de llenar toda la ventana del navegador.