Publicado en
January 31, 2019

La importancia de optimizar tu web para móviles

Jaume Alsina
Digital Operations

Por qué debes tener una web optimizada para móviles

En 2018, el 52,2% de todo el tráfico online mundial se generó a través de teléfonos móviles, frente al 50,3% del año anterior (Statista, 2018). Un estudio muestra que el 51% de los usuarios son más propensos a comprar en una web optimizada para móviles (Quicksprout) y que el 46% de los consumidores no volverán a visitar un sitio web que no esté funcionando correctamente (Hubspot).

Además, los informes de Google muestran que el 40% de los consumidores de móviles se dirigieron a la web de un competidor después de una experiencia insatisfactoria, y el 57% no recomendaría un negocio con una página web de mala calidad en su versión móvil.

Hay que tener en cuenta que el 93,3% de las webs de los propietarios de pequeñas empresas no son móviles (Searchengineland), lo que indica un gran potencial para tu negocio para optimizar tus páginas en mobile.

Por último, tener una web optimizada para móviles es un factor que Google tiene en cuenta, por lo tanto se trata de un motivo de peso para no olvidar su acción.  

Cómo optimizar tu web para móviles

Lo primero que debes investigar en un dispositivo móvil es la página principal de tu web, ya que a menudo es la página que atrae el mayor número de tráfico.

Tasa de rebote

Primero, tendrás que investigar si tu página principal está proporcionando a tus usuarios una gran experiencia de usuario (UX) comprobando su tasa de rebote y el tiempo promedio de permanencia en la página. La tasa de rebote es el porcentaje de usuarios que navegan fuera del sitio después de ver sólo una página. Lo que esperamos es que el usuario haga clic en tu web y navegue a diferentes páginas viendo diferentes soluciones/productos/servicios y, por lo tanto, tener una tasa de rebote tan baja como sea posible.

Si tienes una tasa de rebote alta pero el tiempo promedio en la página es de un minuto, entonces no es un problema. Los visitantes pueden estar leyendo el contenido de tu web o rellenando un formulario de contacto, por ejemplo.

Banners

En segundo lugar, investiga qué banners, texto, imágenes y vídeos ve el usuario, dónde hace clic, hasta dónde se desplaza el usuario en la página y qué es lo que ve. Para entender esto, recomendamos usar un "mapa de calor".

Varias herramientas de SEO como Siteimprove o Hotjar tienen mapas de calor. Los banners son especialmente importantes en los dispositivos móviles ya que los banners en los dispositivos móviles en comparación con los dispositivos de escritorio hacen un mejor trabajo de penetración, cuando se trata del reconocimiento de anuncios o remarketing. Sin embargo, uno de los problemas más comunes en los dispositivos móviles es que el usuario puede no percibir tus banners, lo que se conoce como "ceguera por banners".

Recomendamos 6 aspectos a tener en cuenta al diseñar un banner:

  1. Haz que parezca contenido relevante.
  2. No incluir ningún color de fondo, ya que los estudios han demostrado que hace que el cerebro mire hacia otro lado.
  3. No utilices texto blanco sobre un color de fondo, ya que es difícil de leer.
  4. Utiliza un encabezado inteligible sobre un fondo blanco o claro.
  5. Trata de tener texto generado en HTML, ya que aparece claramente en la pantalla.
  6. Incluye una "llamada a la acción" en la parte inferior o enlace que haga que el cliente realice una acción.

Un buen ejemplo podría ser el siguiente banner de Nike.

banner para móviles

Los banners rotativos son banners que cambian automáticamente. El beneficio de usar banners rotativos es que si el propio usuario debe cambiar los banners, muchos banners no son vistos.

Por lo tanto, la rotación de tus banners puede aumentar el número de banners que ven los usuarios. Si estás rotando tus banners, te damos cuatro tips para asegurar el mejor resultado:

  • Gira los banners lentamente, ya que una rotación rápida del banner puede estresar al usuario.
  • Detén la rotación del banner cuando todos los banners se hayan mostrado una vez.
  • Haz que el usuario pueda ‘pausar’ los banners.
  • Deja claro al usuario cómo desplazarse entre los banners, por ejemplo como Nike lo hace con sus flechas en el ejemplo anterior.

Estructurar el contenido

Ahora sabemos que la parte superior de la página debe incluir banners que parezcan contenido relevante. También sabemos que el cliente debería poder rotar y pausar, pero ¿qué pasa con el resto de la página?

Esto, por supuesto, siempre depende de cada página web. Sin embargo, tendemos a seguir dos reglas generales.

Información sobre la entrega. Recomendamos incluir la información de entrega en la página principal, por ejemplo, Asos en la imagen de abajo, y mantener la información de entrega en el pie de página para el resto de las páginas.

Encabezamientos y deslizamientos. Una forma de aumentar el UX es usando encabezados y deslizamientos, como se muestra en el siguiente ejemplo.

swipe banner para móvil

Duración del contenido

Al crear tu página de inicio u otra página de aterrizaje, una de las cosas más difíciles es decidir la longitud de la página, pues generalmente hay mucha información potencial para incluir.

Un estudio de Customersense mostró que todos los participantes en una prueba prefirieron la longitud del texto de Zalando en comparación con Ikea, Amazon & Staples que se muestra en esta imagen.

ejemplos de webs mobile

La razón por la que la gente prefería Zalando era porque los usuarios sabían cuando la página estaba terminando, y la página tiene suficiente información para no ser demasiado corta.

Footer sencillo

Los tests que realizaron los usuarios durante el estudio también revelaron que los clientes esperaban poder encontrar ayuda sobre la información de entrega y devoluciones con facilidad. Durante la comparación entre Staples y Asos, los usuarios prefirieron el footer de la web de Asos, ya que recopilan la información que los clientes deben estar buscando recientemente en el footer. Esto lo hace más rápido para el usuario, ya que no tiene que hacer clic en el botón "centro de ayuda". Siempre que el usuario se pueda ahorrar un clic, mucho mejor. 

 

Los móviles se han convertido en el medio preferido de los consumidores y usuarios, por eso es de vital importancia que los sitios web sean diseñados especialmente para este tipo de dispositivos. Las webs y sus contenidos deberían poder adaptarse a cualquier terminal móvil con diferentes resoluciones de pantalla.

¿Cómo podemos ayudarte?

Si necesitas más información no dudes en ponerte en contacto con nosotros.

Publicado en
This is some text inside of a div block.

Heading

No items found.
This is some text inside of a div block.
This is some text inside of a div block.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Servicios

Cómo podemos ayudarte

Consulta los servicios con los que te ayudaremos a conseguir tus objetivos digitales.

servicios

Otros artículos

Proyectos de interés