Una excelente web para móviles

Cómo hacer una web móvil increíble

escrito por kevin altamirano

Diseñar páginas web para teléfonos móviles, sobre todo si estamos diseñando Mobile First, no tiene por qué ser complicado. Más de un web developer está emocionado con este nuevo tipo de diseño, a pesar de la naturaleza “restrictiva” de las pequeñas pantallas que son los teléfonos celulares y que ha cambiado la forma en que se diseñan las páginas web.

Implementando las estrategias que leerás a continuación tu página web será efectiva para los dispositivos donde tus usuarios realmente te están visitando, y no sólo para computadoras. Recuerda que en estos días debes pensar primero en los usuarios móviles y estas estrategias serán una buena guía inicial para basar tus decisiones de diseño en tu sitio.

Más corto es mejor… hablando de contenido web

Durante mucho tiempo la regla fue que el contenido largo vendía más y retenía más tiempo a tus usuarios y tu audiencia. Bueno los tiempos han cambiado y hemos llegado a la conclusión favorita de todo internet… depende.

Contenido largo y escrito más a detalle incrementa la retención en ciertos tipos de usuarios, particularmente los que visitan un artículo informacional técnico o visitan tu página durante ratos de ocio.

Pero la mayoría de los usuarios navegan por internet en pequeñas pantallas portables, para diseñar Mobile First tu contenido tiene que ser conciso y limpio. Utilizar tipografías grandes y mensajes cortos harán el consumo del contenido de tu sitio web mucho más digerible y fácil de leer en dispositivos móviles.

Mantén tu sitio web simple

La minimización está apoderándose de nuestra cultura, porque la realidad es, que el ser humano adora la simplicidad. Nos da calma, hace todo más claro y nos hace más felices.

Esto aplica también para el diseño web. Realmente menos es más. Nuestra recomendación siempre es conservar los elementos que realmente son imprescindibles para tu web, y deshacerse del resto.

Pregúntate a ti mismo, de verdad, si cada elemento que tiene tu web es necesario. Por ejemplo ¿Realmente necesitas todos esos campos en tu formulario de contacto? ¿Puedes reducir el número de elementos en tu menú?

Aquí te damos unos tips para simplificar tu sitio web.

  • Reduce el número de páginas en tu sitio
  • Añade una búsqueda avanzada con mínima iconografía
  • Incrementa el espacio vacío entre elementos
  • Usa líneas claras y bordes anchos
  • Usa una tipografía sencilla y hazla más grande
  • Mantén un número mínimo de colores en tu web

Presta atención a tus Calls to Action (CTAs)

Hay pocas cosas peores que hacer click en un link de un sitio web desde tu teléfono celular que no se ve bien porque, aunque la página de inicio del sitio es Mobile Friendly, la landing page no lo es.

O nuestro favorito, cuando haces click para llenar un formulario y la mitad de las cajas están fuera de la pantalla, haciendo imposible llenar la forma.

Tus Call to action son inútiles si no estás pensando en dispositivos móviles, lo que significa pérdidas de ventas y leads reales. Si tuviéramos que optimizar para móviles solamente una cosa, haríamos los CTAs. Deja de tirar dinero al drenaje y haz los elementos webs encargados de traerte dinero, visualizables en teléfonos celulares.

Utiliza métodos de comunicación de teléfonos móviles

No cabe duda que los teléfonos celulares han cambiado la forma en la que nos comunicamos entre nosotros y con las marcas y empresas.

Los clientes quieren respuesta a sus preguntas ahora. Y no quieren tener que llamar si no es necesario.

¿Ya ajustaste tus métodos de contacto a las preferencias de comunicación de tus clientes hoy en el 2019? Chat integrado a tu web, Facebook Messenger con soporte real, y contacto por WhatsApp es lo que tus clientes prefieren para contactarte, después de todo están visitándote desde un celular.

Diseña tus gráficos para teléfonos celulares

Te podrías haber preguntado antes si el diseño gráfico realmente importa cuando se trata de diseño web para teléfonos móviles. La respuesta es ¡Por supuesto que sí!

Páginas web bien diseñadas también son consideradas más confiables, más memorables y más fáciles de usar.

¿Y cómo es el diseño web para teléfonos móviles?

Estas son las tendencias en gráficos web que hemos recopilado para el 2019

  • Colores vívidos
  • Elementos tipográficos fuertes
  • Formas geométricas y patrones abstractos
  • Paletas de colores con mucho contraste
  • Gradientes y tonos duales
  • Minimalismo brillante
  • Ilustraciones y diseños dibujados a mano
  • Fotografías reales

¿Qué significa todo esto en la práctica?

Utiliza formas fuertes, líneas claras, colores llamativos y elementos tipográficos. Utiliza mucho el espacio vacío que es tanto visualmente atractivo como fácil de navegar en móviles.

Haz un sitio web que cargue funcione rápido y furioso

Afortunadamente diseñar para móviles significa diseñar sin funcionalidades complejas en mente, nada innecesario que sobrecargue el sitio web, toma en cuenta que gran cantidad de personas nos visitarán usando sus datos móviles.

Aún así hay mucho que optimizar para tener un sitio realmente rápido, aquí te damos unas recomendaciones:

  • Empieza por la elección del hosting, tiene que ser un hosting rápido con buen servicio de soporte, considera contratar un servidor dedicado si planeas que tu web tenga más de un par de miles de visitas al mes.
  • Utiliza herramientas de medición de rendimiento y trabaja en las recomendaciones para incrementar tu score.
  • Instala un CDN, que almacena el contenido de una caché cerca al usuario
  • Comprime las imágenes de forma que se vean bien, pero carguen rápido
  • Considera utilizar Lazy Load, que carga los elementos de forma separada para que el usuario pueda ver algo de contenido de inmediato

En conclusión, hay formas correctas e incorrectas de diseñar un sitio web para móviles. Recuerda que para optimizar la experiencia de un usuario que quiere llegar desde el punto A al punto B lo más rápido posible sin distracciones se requiere un criterio distinto a como seguramente estás acostumbrado en páginas web para computadoras. El diseño Mobile First es más simple, más limpio, más mínimo, más conciso, más sencillo.

Sin embargo, no es necesario cambiar todo tu proceso de diseño al diseñar para móviles. Sólo significa reinventar cómo creamos contenido, imágenes, CTAs, y comunicaciones manteniendo el enfoque a los usuarios de teléfonos celulares.

Deja de desperdiciar tanto tiempo y dinero en sitios para escritorio que los usuarios móviles detestan. Utiliza estos tips para diseñar páginas web que los buscadores y (más importante aún) los usuarios amarán.

Comparte este post

Share on facebook
Share on google
Share on twitter
Share on linkedin
Share on pinterest
Share on print
Share on email