¿Qué es una Web Mobile?

Una web mobile (o web móvil) es una página web a la que accedemos desde un dispositivo móvil y que es distinta o reducida a la versión clásica (aquella a la que podemos acceder desde el ordenador). Su diseño, navegación y servicios están optimizados para ser consumidos a través de los teléfonos móviles, tablets, e-readers y otro tipo de dispositivos que se caracterizan por su movilidad.

Un buen ejemplo de la diferencia entre una web móvil y una web clásica sería las dos versiones que tiene la NASA.

nasa.PNG

Si tenemos en cuenta que los usuarios pasan 170 minutos al día navegando desde un terminal móvil, parece lógico que englobemos la web mobile en nuestra estrategia de comunicación, ya que si redirigimos a los usuarios a la web clásica, es probable que no puedan ver bien nuestros contenidos debido a la diferencia de estos terminales con los ordenadores, lo que hará que perdamos una gran baza para comunicar con los usuarios.

Google tiene un Mobile-Friendly Test que nos permite saber fácilmente cómo se ve nuestra web en los teléfonos móviles. Y, como se puede ver, mi vieja página web no estaba optimizada:

viejaweb

Los teléfonos móviles no paran de crecer, y con ello sus prestaciones. Nos permiten dar un paso más en la comunicación con los usuarios gracias a sus sistemas de geolocalización o la posibilidad de hacer llamadas con un solo clic. Pero existen otros puntos fuertes por los que es recomendable tener una web mobile:

  • Obtener una experiencia de navegación positiva por parte del usuario a través de un smartphone.
  • Posicionamiento adecuado de la marca en buscadores a través de móviles.
  • Menor consumo de tráfico de datos.
  • No perder ningún impacto de usuarios que no puedan acceder al contenido desde su terminal.
    Mayor velocidad de acceso a la información y menores tiempos de carga.
  • Menor repercusión sobre la duración de la batería.

Existen cuatro tipos de web móvil:

  • Corporate, cuyo objetivo es mostrar la información de la empresa a los clientes potenciales.
  • Commerce, cuyo objetivo es generar ventas directas.
  • Media, que hacen llegar sus contenidos e información al usuario.
  • Branded micro y landing pages, que son microsites o páginas de aterrizaje a las que se accede a través de una campaña publicitaria. A continuación, un ejemplo:

 Captura landing

Fuente: Altiria TIC

 

No deben confundirse la web mobile con la web responsive. La primera es una web original diseñada específicamente para los dispositivos móviles. La segunda es una adaptación de la web clásica que responde a cambios en el tamaño del dispositivo para adaptar su contenido. La gran desventaja de la responsive frente a la mobile es que depende de los navegadores y las resoluciones de pantalla y ancho de columnas de cada dispositivo.

mobilefirst

Fuente: Torresburriel Estudio

 
La web móvil está asociada a la idea “mobile first”: teniendo en cuenta los datos de navegación móvil, que poco a poco se imponen a la navegación clásica, lo ideal sería realizar primero un diseño web pensando en los dispositivos móviles para posteriormente adaptarlo a otros dispositivos.
Hasta que llegue ese momento en el móvil se imponga claramente, podemos seguir algunos consejos optimizadores a nivel de usabilidad y experiencia de usuario recogidos por la web 40defiebre:

  • Utilizar un tamaño de letra adecuado (a ser posible, de 16px o superior).
  • Usar un contraste evidente en el texto y elementos de llamada a la acción.
  • Eliminación de los hovers (el efecto de pasar el ratón por encima de un elemento) para las versiones mobile.
  • Las políticas de cookies que ocupan un 50% de la pantalla y que contienen un botón de cerrar pequeño e inaccesible.
  • Formularios que no se adaptan. Por ejemplo que no son numéricos cuando el campo lo requiere o que se muestran en horizontal.
  • No utilizar display:none para la ocultación de elementos en versiones móviles.
  • Cuidado con abusar de las páginas con pestañas, el contenido de las mismas puede no ser indexado.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s