100 puntos a saber sobre...
Desarrollo de una web de diseño eco

Cuando pensamos en diseño web sostenible, es fácil pasar por alto una solución que está a no más de un brazo de distancia: nuestros teléfonos móviles. Diseñar para móviles es una técnica que ha ganado popularidad en parte por la prevalencia del uso de teléfonos móviles hoy en día, pero también por la comodidad y adaptabilidad de estos dispositivos.

Mira el breve vídeo a continuación para descubrir el alcance, la historia y la importancia del diseño mobile first.

El diseño mobile first: ¿Qué es y cómo se ha desarrollado en el diseño web? (2:05)

Transcripción del vídeo:

Diseño mobile-first
¿Qué es y cómo se ha desarrollado en el diseño web?

---NUEVA DIAPOSITIVA---
El diseño mobile first es un enfoque de diseño en el que la experiencia en línea se desarrolla para móviles antes de diseñar para escritorio o cualquier otro dispositivo.

Los usuarios móviles superaron a los de escritorio en 2016. El 51% de la población utiliza internet solo desde sus teléfonos móviles. Para 2025, se espera que esa cifra aumente hasta el 72,5%.

---NUEVA DIAPOSITIVA---
El uso del móvil no crece solo porque los dispositivos sean cada vez mejores.
También se están abaratando.
Quienes no pueden permitirse un ordenador ahora pueden conectarse utilizando dispositivos móviles con planes de datos baratos.
El diseño mobile first no sólo abre nuevas oportunidades de crecimiento, sino que puede mejorar la experiencia general del usuario de un sitio web o una aplicación.
Luke Wroblewski
Director de Producto de Google que acuñó por primera vez el término mobile first.

---NUEVA DIAPOSITIVA---
La evolución del diseño mobile first
Primera parte: Degradación gradual (desktop first)

Antes de los móviles y las tablets, los sitios web se desarrollaban sólo para ordenadores de sobremesa.
Cuando aumentó el uso de otros dispositivos, los desarrolladores empezaron a modificar sus diseños exclusivos para ordenadores de sobremesa para adaptarlos a móviles y tablets.
Los diseños modificados tuvieron que recortar funciones y contenidos de la versión de escritorio más avanzada para adaptarse a los dispositivos más pequeños.

---NUEVA DIAPOSITIVA---
La evolución del diseño mobile first
Primera parte: Degradación gradual (mobile first)

Este enfoque de crear sitios web totalmente funcionales para ordenadores de sobremesa y degradarlos para adaptarlos a otros dispositivos se denomina degradación gradual o enfoque desktop first.

¿Cuál es el inconveniente?

Muchos elementos web no se adaptan bien a tamaños de pantalla más pequeños. El resultado es un sitio web cuya apariencia es menos atractiva visualmente en dispositivos más pequeños.

---NUEVA DIAPOSITIVA---
¿La solución?
Parte 2: Avance progresivo (mobile first)

Para solucionar este problema de mala adaptación, los desarrolladores adoptaron otro enfoque llamado avance progresivo o diseño mobile first.

Este nuevo enfoque animaba a los expertos a empezar a diseñar primero para dispositivos más pequeños y luego ir añadiendo más funcionalidades para pantallas más grandes.

---NUEVA DIAPOSITIVA---
¿La solución?
Parte 2: Avance progresivo (mobile first)

Por lo tanto, en lugar de desarrollar todas las funciones desde el principio, una página web se construye primero usando las funciones que admiten todos los navegadores y las que se consideran esenciales.

A continuación, se añaden funciones más avanzadas como capas a pantallas más grandes.

---NUEVA DIAPOSITIVA---
Para saber más sobre el diseño mobile first, consulta el libro de Luke Wroblewski "Mobile First":

Gracias por vuestra atención