Históricamente, la mayoría de los diseñadores web y sus clientes se han acercado primero al lado del escritorio de cualquier proyecto, dejando la parte móvil como un objetivo secundario que se logrará más adelante. Incluso con el auge del diseño responsivo, muchos de nosotros comenzamos con el "tamaño completo". Sitio y trabajo nuestro camino hacia abajo.
Sin embargo, hay una tendencia creciente en la industria a invertir este flujo de trabajo y comenzar realmente con consideraciones móviles y luego trabajar con una versión de escritorio más grande. ¿Por qué habrías enfocado un proyecto de esta manera? ¿Cuáles son algunas de las ventajas y desventajas de esta estrategia? ¡Sigue leyendo para descubrirlo!
Este artículo es parte de nuestra serie sobre "mirar más allá del diseño de escritorio", presentado en colaboración con Heart Internet VPS.
El diseño web móvil no es un nicho
Si aún tiene en mente que el diseño web móvil y el desarrollo de aplicaciones es una industria de nicho, necesita cambiar su forma de pensar. El móvil no es una tendencia, ni es el futuro, es el presente. No me crees Aquí hay algunas estadísticas locas para considerar de Mobithinking del mes pasado.
- Hay más de 1.2 billones usuarios de web móviles en todo el mundo
- En los EE. UU., El 25% de los usuarios de la web móvil son solo móviles (rara vez usan una computadora de escritorio para acceder a la web)
- Las aplicaciones móviles han sido descargadas 10.9 mil millones de veces.
- Las ventas de dispositivos móviles están aumentando en general con más del 85 por ciento de los nuevos teléfonos que pueden acceder a la web móvil
Uno de los datos más potentes aquí es el segundo elemento, que revela que muchos usuarios probablemente solo verán la versión móvil de su sitio. Esa es una revelación asombrosa, ¿no es así?
Más que nunca antes, la web es algo que llevamos en nuestros bolsillos, no algo que simplemente cuelga cerca de nuestro escritorio o incluso en nuestros hogares. Esta es una tendencia global que solo continuará experimentando un crecimiento en los próximos años. ¿Estás listo para esto? ¿Su conjunto de habilidades profesionales incluye desarrollo web para todas las plataformas importantes o solo para el entorno de escritorio?
¿Por qué móvil primero?
Lo más probable es que ninguna de las personas que lean esto haya aprendido algo nuevo hasta este momento. Los teléfonos de más de $ 200 en los bolsillos de todos los que conoces son la única indicación de que la web ha salido de su caja en forma de computadora.
Sin embargo, el hecho de que el acceso a la web móvil sea popular no hace casi nada para convencerme de que necesito seguir una estrategia que realmente ponga al móvil en primer lugar. La otra cara del 25% de los usuarios móviles que solo son móviles es que el 75% de ellos no lo son. Obviamente, el escritorio todavía es un medio importante, que no debe olvidarse ni trasladarse a un segundo plano todavía. Entonces, ¿por qué estamos considerando tomar la primera ruta móvil?
Uno de los principales catalizadores para el surgimiento del primer diseño web móvil fue el anuncio de Eric Schmidt en 2010 de que Google tomará este enfoque de ahora en adelante, hasta el punto de decir: creo que ahora es el proyecto conjunto de todos. ¿De nosotros para hacer móvil la respuesta a casi todo? (fuente). ¿Por qué este drástico cambio de enfoque?
Degradación agraciada vs. mejora progresiva
Estas son algunas de las principales palabras de moda de hace unos años que aún pueden aportar una gran cantidad de información sobre la noción de primer diseño web móvil y por qué es un concepto importante a considerar.
La degradación elegante surgió de la necesidad de tener una función de diseño en tantos navegadores y plataformas como sea posible. Los diseñadores y desarrolladores querían aprovechar la nueva tecnología sin excluir a los usuarios con configuraciones que no tenían soporte. La conclusión general fue crear y ofrecer la mejor experiencia posible, y luego explicar cada posible degradación y garantizar que, a pesar de cualquier deficiencia, el sitio permanezca en funcionamiento.
En términos de diseño web móvil, esto significaba que un sitio web completo y estándar reduciría y eliminaría gradualmente el contenido y las funciones a medida que la ventana gráfica se hacía más pequeña y el sistema más simple (sin compatibilidad con Flash, etc.).
De esta tendencia surgió una nueva idea poderosa: la mejora progresiva. En esta versión del cuento, usted pone su mejor pie en la plataforma móvil, brindando a los usuarios un espacio mínimo de pantalla, poder de procesamiento y complementos de terceros, una experiencia increíble que se ve excelente y funciona perfectamente. A medida que surja la necesidad, el sitio puede mejorarse gradualmente. e incluso replanteado completamente para plataformas más grandes con menos restricciones.
¿Por qué gana progresiva mejora
De un vistazo, estas dos metodologías parecen aproximadamente equivalentes. ¿A quién le importa dónde comienza el proceso de diseño, siempre y cuando se haga, verdad?
Sin embargo, la realidad de la situación es un poco más compleja. Cuando comienzas con la plataforma de escritorio, tiendes a querer aprovechar todo lo que la plataforma tiene para ofrecer. Construyes un producto increíble que aprovecha una gran tecnología, solo para darte cuenta de que nada de eso se reduce al móvil. Esto puede, y de hecho conduce, a productos móviles severamente diluidos que se parecen más a una idea tardía que a un producto acabado pulido. ¿Ocurre esto con cada proyecto? Quizás no, pero la historia es probablemente mucho más común de lo que te gustaría creer.
Si examinamos el flujo de trabajo de mejora progresiva, el resultado tiende a ser una historia diferente. Aquí estamos comenzando con un proyecto que es a la vez super magro y bastante impresionante. Ha tomado toda esa energía inicial y la ha puesto en la creación de un producto que se ve y funciona bien a pesar de las muchas restricciones que enfrentó.
Más importante aún, ya ha pasado por el problema de reducir el contenido a sus elementos más vitales. Ahora, cuando llega el momento de llevar este diseño al escritorio, en lugar de tomar la decisión de qué cortar y cómo diluir su producto, ¡en cambio, decide cómo hacerlo aún más robusto!
Contenido Web: Mejor Servido Selectivamente
El argumento anterior proviene de su punto de vista puramente filosófico, con la conclusión final de que el resultado final es tiende para ser mejor si se toma un primer acercamiento móvil. Si quieres una discusión con un poco más de sustancia observable detrás de ella, no busques más que la forma en que sirves tu contenido.
Si tomamos el punto de vista de la degradación elegante, todo el contenido (texto, imágenes, video, audio, etc.) se entrega al mismo tiempo a lo que se supone que es la plataforma más grande. Desde aquí, se tienen en cuenta las versiones móviles que simplemente ignoran o eliminan gran parte de este contenido de la página. Sin embargo, el problema es que ya estaba cargado en si la plataforma dada lo necesitaba o no. Nos encontramos sirviendo más contenido del que es necesario en la plataforma que a menudo se asocia con las velocidades de descarga más lentas. ¿Ves algo malo con eso?
Con un primer punto de vista móvil, comenzamos cargando los elementos esenciales absolutos en las plataformas más pequeñas. Esto conduce a una experiencia más rápida que evita retrasos innecesarios. Los recursos adicionales se cargan estrictamente según las necesidades de las plataformas que pueden manejarlos bien.
¿Qué pasa con el diseño responsivo?
¿Cómo encaja todo esto con el diseño responsivo, la otra tendencia que se está apoderando de la web? La buena noticia es que estas dos estrategias no son competitivas. De hecho, se podría decir que fueron hechos el uno para el otro.
El diseño responsivo se basa en el concepto de consultas de medios que se dirigen a dispositivos específicos y tamaños de vista. Con esto en mente, puede codificar su CSS inicial desde una perspectiva móvil y luego usar consultas de medios para ofrecer un estilo adicional de forma selectiva a medida que aumenta el tamaño de la ventana gráfica.
Es probable que esto sea lo contrario del método que usualmente toma con un diseño responsivo: comience a lo grande y luego reduzca. Sin embargo, dados los argumentos anteriores, obviamente hay mucha lógica detrás de la estructuración de sus consultas de medios de comunicación de pequeñas a grandes.
El gran inconveniente gordo
Hurra por el primer diseño web móvil. Obviamente, es lo mejor que ha llegado a la web desde The Oatmeal. Entonces, ¿por qué no estoy entusiasmado con eso? ¿Por qué, a pesar de que me gusta el diseño receptivo, a menudo he evitado el tema del diseño web móvil primero?
La respuesta aquí es simple: no es ni divertido ni fácil. El diseño seguro es complicado, pero me permite realmente flexionar los músculos de mi diseño y aprovechar una gran cantidad de funciones integradas del navegador para realizar algunas cosas interesantes. El diseño sensible hace que mi caja de juguetes sea más grande, no más pequeña.
Sin embargo, con el primer diseño móvil, me golpean en la cabeza con restricciones en el paso uno. ¡Eso no es divertido en absoluto! De inmediato, me enfrento a una pantalla más pequeña, menos recursos y un montón de dolores de cabeza. Además, simplemente no es territorio cómodo. He pasado la mayor parte de mi carrera de diseño web en el espacio de escritorio, creando experiencias alrededor de pulsaciones y pulsaciones del mouse, no con toques de dedo. He hecho un montón de trabajo móvil, pero no lo llamaría mi fuerte.
Lo más importante es que, desde una perspectiva estricta de diseño, me resulta muy difícil sumergirme en un diseño si estoy empezando con el móvil y estoy trabajando en ello. Mencioné esto en un artículo reciente a un montón de? Huzzahs? en los comentarios e incluso he escuchado a profesionales líderes de la industria cantar una melodía similar.
Subiendo al desafío
Veamos un segundo en mis argumentos a favor y en contra de un primer enfoque de diseño móvil. En el? Para? En esta categoría, tenemos argumentos directos y lógicos que son difíciles de minimizar. ¿En el? Contra? Categoría Tengo muchas quejas y dudas personales. ¿De qué lado crees que gana esta batalla?
Tal vez tenga mejores argumentos en contra de los dispositivos móviles primero que yo, pero si lo veo desde un punto de vista objetivo, es evidente que el primer enfoque móvil es el candidato más fuerte.
Esto significa que probablemente deba superarme y enfrentar el desafío de comenzar proyectos con un punto de vista móvil. Si no me siento cómodo diseñando para dispositivos móviles primero, bueno, eso significa que tengo espacio para crecer y técnicas para aprender.
En última instancia, si mis razones para adoptar un primer enfoque móvil están centradas en el usuario y mis razones en contra son personales, entonces debo renunciar a un poco de comodidad en nombre de ser un mejor diseñador.
¿Qué te está frenando?
Ahora sabes todo sobre lo fantástico que es el primer diseño web móvil para tus usuarios. Sabe que las grandes empresas como Google están adoptando este enfoque y puede ver claramente los beneficios de un primer flujo de trabajo móvil. Entonces, ¿qué te está frenando?
¿Compartes mi perspectiva personal de que lo móvil es una estrategia difícil de implementar y acuerdas que solo necesitas unirte (o una mujer si lo prefieres) y dar el salto? ¿O hay algo más sustancial que te retiene? ¡Deja un comentario abajo y haznos saber!
Imágenes a través de BigStock: Reno Martin, Yellowj y PixelsAway.