La experiencia móvil está en camino de convertirse en uno aspectos más importantes en Internet. Google está trabajando muy insistentemente en este concepto desde hace ya algunos años. Más aún teniendo en cuenta la indexación Mobile-First desde Marzo de 2021, y que las señales de posicionamiento con la actualización de la experiencia de la página de Google se aplicarán solo a la búsqueda móvil.
Según los datos estadísticos más recientes, el 50,81 % del tráfico web mundial proviene ahora de dispositivos móviles, y eso excluye las tabletas.
Statcounter, mientras tanto, informa de una cifra muy similar para el uso de dispositivos móviles en España, 50.37%, aunque si bien es cierto que todavía no a superado claramente a la utilización de los ordenadores de sobremesa. Todo lo contrario a nivel global, ya que desde principios de 2017 el tráfico móviles está claramente por delante de los otros dispositivos.
En el gráfico anterior, se puede ver que han pasado 8 años desde el despegue antes de que el móvil finalmente alcanzó los niveles de tráfico de dispositivos de escritorio.
La experiencia del usuario móvil puede haber sido un campo medio gris en el pasado, pero las cosas definitivamente están empezando a verse mejor:
- Están surgiendo estándares.
- Las mejores prácticas se están adoptando más ampliamente.
- Y mientras todavía es posible ver un sitio sin una versión móvil aquí y allá, esos sitios están siendo empujados muy lentamente a las posiciones más bajas en las SERPs.
Y con el paso de Google a la indexación mobile-first, más propietarios de sitios web se están viendo obligados a prestar atención a sus sitios n las versiones móviles. Dado que Google ahora utiliza la versión móvil de un sitio web para la indexación y clasificación de búsquedas, tener una mala experiencia móvil resultará en un bajo rendimiento de búsqueda.
Por lo tanto, si tu experiencia móvil se siente como si todavía estuvieras viviendo en el en la edad de piedra, estos 5 consejos deberían ayudarte a encontrar una salida.
¿Qué vas a leer?
- 1. Optimiza la navegación para mejorar la experiencia móvil
- 2. Diseño para la velocidad para mejorar la experiencia móvil
- 3. Mejora la experiencia móvil de los usuarios que regresan
- 4. Agregar accesos directos para usuarios móviles
- 5. Pruebe su sitio para la experiencia móvil
- Sigue las mejores prácticas de experiencia de usuario móvil para aumentar las conversiones
El mayor desafío que seguimos viendo en muchos sitios móviles es una buena navegación.
La navegación es crucial para un sitio web móvil, ya que actúa como un mapa para usuarios, lo que les permite encontrar fácilmente el contenido o la información que necesitan. Diseñar una buena navegación significa garantizar la capacidad de búsqueda.
Puedes lograr esto haciendo lo siguiente:
- Optimizar la relación contenido-chrome
- Organizar los elementos de navegación
- Utilizar objetivos táctiles grandes para la navegación
Optimice su relación contenido-chrome
Primero, un poco de claridad en este tema.
La parte de su sitio que contiene los elementos de navegación se llama «chrome«.
El chrome es la cantidad total de espacio que su sitio utiliza para los elementos de navegación. Eso incluye la barra de URL, el botón hacia atrás, el botón hacia adelante, la navegación principal en la parte superior de una página y la navegación a la izquierda.
En las versiones de escritorios, hay mucho espacio para el chrome. Por lo tanto, tiene sentido mostrar todos los elementos de navegación principales en todas las páginas.
En el móvil, se debe optimizar mejor la relación chrome-contenido. Es decir, se debe dedicar el poco espacio que se tiene disponible a mostrar más del contenido y menos de la navegación.
Así es como se puede maximizar el contenido mostrado:
- No mostrar todas las opciones de navegación principales en todas las pantallas. En su lugar, hacer que el menú se muestre sobre algo que el usuario necesita activar. Esto significa hacer que el menú sea visible cuando el usuario interactúa con un elemento de navegación como el menú de hamburguesas.
- Asegurarse de que el disparador del menú se vea fácilmente. Una vez que los usuarios señalen que quieren ver los elementos de navegación tocando en el menú de hamburguesas, en realidad se puede dedicar tanto espacio como sea necesario a los elementos de navegación.
Sitios como Everlane dedican casi toda la pantalla al contenido, con una pequeña área para el menú de hamburguesas.
Hay una advertencia con esto.
Según el Grupo Nielsen Norman, elementos como el menú de hamburguesas tienden a dañar la capacidad de identificación al ocultar la navegación. Si bien esto es en buena medida cierto para las versiones de escritorio, la navegación oculta todavía tiene un impacto negativo en la usabilidad móvil (aunque, una penalización de usabilidad más pequeña en comparación con el impacto negativo en la usabilidad en escritorio).
El uso de una combinación de navegación oculta y visible (similar a la forma en que Nationwide lo hace a continuación) es una alternativa a considerar para la experiencia móvil. En este caso, prácticamente toda la navegación la agrupa en una sola opción en la versión móvil, mientras que mantiene los accesos directo a aquellas opciones que van en línea con la intención de la opción móvil. Y todo esto, sin el menú de haburguesa!
En cambio, WWF si que opta por el menú hamburguesa, mientras que sólo deja visibles os botones de sus redes sociales. una opción más ajustada, pero muy válida también.
Identificar a qué personas acceden más mientras usan sus teléfonos móviles es clave para mostrar las cosas correctas en los dispositivos correctos. Con tan poco espacio para trabajar, no puede permitirse mostrar todas las categorías alfabéticamente.
Cuando los usuarios tocan los menús de los dispositivos móviles, esperan que el contenido sea fácil de ordenar. Esto es lo que puede hacer para ayudar a que eso suceda:
- Revise Google Analytics u otras herramientas de flujo de clics y filtra el tráfico móvil.
- Cuando hayas identificado las áreas más visitadas, segméntalas las por puntos en común (temas comunes, categorías de productos más utilizadas, etc.).
- Muestra los temas o áreas de productos a los que se accede más comúnmente en tu menú de hamburguesas – no confíes en la clasificación predeterminada.
Una vez que el usuario toca el menú de hamburguesas, el sitio móvil Currys / PC World muestra categorías de productos segmentadas, en lugar de mostrar todo a la vez.
En realidad, deberías estar haciendo esto incluso para tu sitio web de escritorio. Es decir, priorizar elementos de navegación en base a los siguientes criterios:
- Lo que a menudo utiliza la mayoría de sus visitantes en online
- Lo que impulsa los ingresos o las ventas de tu negocio
Si tu tráfico proviene predominantemente de móviles, tienes una razón aún más convincente para organizar la navegación basada en los productos más vendidos y las preferencias de su audiencia móvil.
Por ejemplo, podrías incluir una navegación visual en el área de contenido principal, para que sus visitantes móviles vean inmediatamente sus principales categorías de productos o servicios. La misma Currys / PC World lo hace en su sitio móvil:
Cuando los visitantes tocan cualquier opción de menú, básicamente tienes la posibilidad de utilizar toda la pantalla del dispositivo móvil.
Según Smashing Magazine, la mayoría de los usuarios móviles confían en sus pulgares para las interacciones con los teléfonos inteligentes, por lo que hacer que los objetivos táctiles sean más grandes puede tener un impacto significativo la hora de los errores del usuario.
Asegúrate de que tus objetivos táctiles cumplan con el tamaño mínimo viable
Hacer llamadas a la acción más grandes como una buena práctica no es exclusivo de los sitios móviles.
Dicho esto, hay mediciones específicas que tienes que cumplir para móviles, dado que las acciones del pulgar son mucho menos precisas que las acciones que se realizan con un ratón para la versión de escritorio.
Considera esto:
- La yema de un dedo de una persona promedio tiene aproximadamente 1,6 – 2 cm de ancho.
- El pulgar de una persona promedio tiene un área de impacto de aproximadamente 2,5 cm.
Un estudio muestra que la medida física mínima de una opción táctil que provoque una acción debe ser de 1 cm × 1 cm.
Asegúrate de que el tamaño y el espaciado entre las opciones táctiles tengan en cuenta las limitaciones físicas de las personas que usan sus teléfonos.
2. Diseño para la velocidad para mejorar la experiencia móvil
La investigación revela que el 53% de los consumidores abandonarán un sitio móvil que tarda más de 3 segundos en cargarse.
Hay un par de cosas que puede hacer para evitar que la mayoría de esos visitantes abandonen tu sitio debido a la velocidad:
Ocultar la latencia
Puedes servir elementos por encima del viewport mientras carga los elementos más abajo en la página en segundo plano.
Esto se llama lazy loading, una técnica bastante común para bajar el tiempo de carga real, aunque en realidad se oculta o se difiere.
Sin embargo, ten cuidado cuando se trata de ocultar la latencia mediante la lazy loading. Google advierte que la implementación incorrecta de la carga perezosa en tu sitio móvil puede impedir inadvertidamente que Google rastree el contenido de tu sitio. Por este motivo, el lazy loading debe aplicarse a la carga de las imágenes de manera casi exclusiva, mientras que los datos asociados a éstas deben cargarse, como los datos estructurados, alt text.
Servir imágenes de menor tamaño
Hay técnicas como srcset que le permiten servir imágenes más grandes en computadoras de escritorio, mientras que sirve imágenes más pequeñas en dispositivos móviles. Puedes utilizar esto a tu favor y hacer que el tiempo de carga en dispositivos móviles sea mucho más corto porque está sirviendo una página general más pequeña.
Sin embargo, prueba esto cuidadosamente antes de la implementación, ya que no es algo fácil de implementar. Puedes utilizar PageSpeed Insights de Google para realizar una auditoría e identificar posibles áreas de mejora.
También querrás planificar los cambios en tu web con la vista puesta en el algoritmo de Google, ya que en un futuro muy cercano los Core Web Vitals serán un factor de posicionamiento.
3. Mejora la experiencia móvil de los usuarios que regresan
Si has introducido algún dato en un formulario en un dispositivo móvil, o ha intentado realizar un pago en varios pasos en un smartphone, sabes lo frustrante que es perder todo el trabajo que ha hecho al completar un pequeño formulario y volver a repetir todo el proceso..
Completar un formulario en dispositivos diminutos sin un teclado adecuado es engorroso. Por lo tanto, si valoras a tus visitantes que regresan, ten un mecanismo para que los visitantes que regresan puedan evitar tener que hacer el trabajo de nuevo desde cero.
Otra área a la que debes prestar atención es la experiencia móvil multicanal. Muchos visitantes en línea cambian entre diferentes dispositivos antes de finalmente convertir en su dispositivo preferido.
Una experiencia perfecta para los visitantes que regresan significa que pueden continuar fácilmente lo que estaban haciendo en su sesión anterior. Esto incluye asegurarse de que los datos o la información que han introducido en otro dispositivo no se pierdan.
4. Agregar accesos directos para usuarios móviles
El tráfico móvil puede haber superado al escritorio, pero las tasas de conversión móvil siguen flotando por debajo de sus contrapartes de escritorio. Este Informe de Estadísticas de Comercio Electrónico 2020 de SaleCycle revela, por ejemplo, que mientras que las ventas móviles siguen aumentando, la mayoría de los compradores todavía prefieren la conversión en el escritorio.
La menor tasa de conversión móvil se debe en parte a la ambivalencia y baja confianza de los usuarios móviles. Sin embargo, hay una razón más simple y relevante: convertir a móviles es una tarea difícil.
SaleCycle señala, por ejemplo, que añadir tarifas al carrito para móviles es casi igual a la de los sitios de escritorio. Esto significa que los usuarios móviles se sienten cómodos comprando en sitios móviles, pero dudan a la hora de completar las transacciones.
Por lo tanto, al reducir conscientemente el esfuerzo requerido para usar su sitio móvil, puede mejorar la experiencia móvil y alentar a los visitantes a completar la transacción. Puedes utilizar las características integradas de la mayoría de los teléfonos móviles para proporcionar a sus usuarios accesos directos que aumenten la facilidad de uso.
Aquí hay algunos ejemplos:
- Haga clic para llamar. Esto permite a sus usuarios móviles tocar el número de teléfono o el icono de teléfono para realizar una llamada en lugar de tener que usar el teclado numérico para escribir su número de teléfono.
- Inicio de sesión social o de terceros. Permitir que sus visitantes móviles utilicen una cuenta de Facebook o Google para registrarse e iniciar sesión en su sitio móvil les ahorra el esfuerzo adicional de escribir su dirección de correo electrónico y contraseña. También les evita tener que recordar otro nombre de usuario y contraseña cuando regresen a su sitio más tarde.
ElDiario tiene habilitado el inicio de sesión de terceros en su formulario de registro y de login. Esto permite a los visitantes en línea crear una cuenta utilizando su cuenta existente de Google, Facebook o Twitter.
- Escaneo de tarjetas de crédito. La entrada de datos es una de las mayores fuentes de fricción para las cajas móviles. El uso de funciones móviles como la cámara incorporada para capturar e introducir automáticamente la información de la tarjeta de crédito en el formulario de pago elimina la molestia de escribir números largos.
5. Pruebe su sitio para la experiencia móvil
Incluso si tienes un dispositivo móvil para probar tu sitio para verificar que todo funciona correctamente, es probable que tu sitio aún tenga algunos aspecto de usabilidad que debas corregir.
Puedes utilizar el modo de dispositivo DevTools de Chrome para simular cómo aparecerá tu página web en diferentes dispositivos móviles:
A continuación, puede comprobar en 3-5 dispositivos móviles reales después de iniciar características o conjuntos de páginas. Asegúrete de llegar a todos los tipos de funcionalidad, incluido su reproductor de vídeo.
Un factor muy importante en este punto es el poder verificar no sólo la funcionalidad de la web son distintos tipos de dispositivos, sino también que el contenido que se enseña en todos ellos sea el mismo.
Las discrepancias en el contenido entre dispositivos puede ser un factor muy relevante en una correcta táctica de posicionamiento SEO, especialmente si la web es mobile-first, ya que lo que el bot de Google pueda rastrear en la versión móvil, en buena medida lo tendrá en cuenta para posicionar la versión de escritorio también. Utilizar un navegador como Blisk puede resultar de mucha ayuda en tarea de verificación
Por últimos, también puedes comprobar la experiencia móvil utilizando Test My Site de Google. Solo tienes que introducir la URL de tu sitio web y Google generará un informe completo con recomendaciones sobre mejoras para tu sitio web móvil.
Sigue las mejores prácticas de experiencia de usuario móvil para aumentar las conversiones
Conseguir la experiencia móvil correcta es difícil, pero en última instancia, gratificante.
Aquellos que…
- mejoran la navegación móvil,
- tienen un diseño con un bajo tiempo de carga de página,
- mejoran la experiencia del usuario para los visitantes que regresan,
- aprovechan los accesos directos en el móvil, y
- utilizan múltiples herramientas para probar sus sitios y detectar errores a solucionar
… tienen una ventaja significativa en la competencia en una era en la que el móvil importa más que nunca.
