Web adaptada a móvil: cómo comprobar en 10 minutos si la tuya funciona

Casi todas las webs que se hacen ahora son «responsive», y aun así eso no garantiza tener una web adaptada a móvil que se use con comodidad. El diseño se encoge para caber en la pantalla, y con eso no basta: alguien con el teléfono en una mano, de pie en la calle, tiene que poder encontrar tu número, leer tus servicios y mandarte un mensaje sin pelearse con la página.

Google, además, mira sobre todo la versión móvil de tu web para decidir cómo posicionarla, así que esto afecta tanto a las visitas que llegan como a lo que hacen al llegar. Las pruebas que siguen las puedes hacer tú, sin conocimientos técnicos, en unos diez minutos.

Cómo saber si tienes una web adaptada a móvil

Haz las pruebas en tu teléfono y, si puedes, repítelas en otro distinto. Un Android de gama media con pantalla pequeña saca problemas que en un iPhone reciente no se ven. Desactiva el wifi y navega con datos, que es como te visita buena parte de la gente. Y entra buscando tu nombre en Google, igual que haría un cliente, en lugar de usar el marcador que tienes guardado.

Ten a mano una nota para apuntar lo que falla en cada prueba, con capturas de pantalla. Luego te servirá para pedir que lo arreglen y para comprobar que se ha hecho.

Prueba 1: lo que se ve sin hacer scroll

Abre la portada y no toques nada. En la primera pantalla deberías ver quién eres, qué haces y una forma de contactar, como un botón de llamar o de pedir cita. Si lo primero que aparece es una foto enorme, un aviso de cookies que tapa media pantalla y un eslogan, el visitante tiene que trabajar para saber si ha llegado al sitio correcto.

Fíjate también en si algún elemento salta mientras carga. Vas a pulsar un botón, carga una imagen encima, el botón se desplaza y acabas pulsando otra cosa. Google mide esos saltos, y al usuario le irritan bastante.

Prueba 2: botones y enlaces que se pulsan con el dedo

Intenta pulsar cada botón con el pulgar, sin hacer zoom. Un botón cómodo mide más o menos lo que la yema del dedo; como referencia, las guías de diseño de Google y de Apple hablan de unos 44 a 48 píxeles. Y tiene que haber espacio entre uno y otro: dos enlaces pegados en el pie de página, como «Aviso legal» y «Privacidad», hacen que acabes en el que no querías.

Comprueba sobre todo el teléfono. Al tocarlo tiene que abrirse la llamada directamente. Si no pasa nada, o si el número está dentro de una imagen, estás perdiendo llamadas. Lo mismo con el botón de WhatsApp: debería abrir la conversación con un mensaje inicial, y no la página para descargar la aplicación. Tienes más detalles en el artículo sobre cómo poner WhatsApp en la web.

Prueba 3: textos que se leen sin ampliar

Lee un párrafo entero de una página de servicios con el brazo a la distancia normal. Si tienes que ampliar con dos dedos, la letra es pequeña; por debajo de 16 píxeles en el cuerpo del texto, la mayoría empezamos a forzar la vista. Mira también el contraste. El gris claro sobre blanco queda elegante en la pantalla del diseñador, y en la calle, a pleno sol, no se ve.

Otro fallo típico de las webs adaptadas deprisa son los párrafos larguísimos. Un bloque que en el ordenador ocupa cuatro líneas, en el móvil ocupa quince. Párrafos cortos y subtítulos que digan de qué va cada parte lo arreglan casi siempre.

Prueba 4: el menú

Abre el menú (el icono de las tres rayas) y entra en cada sección. Comprueba que se abre y se cierra bien, que los submenús no desaparecen al intentar tocarlos y que puedes volver atrás sin perderte. Mira también el orden: servicios y contacto deberían estar arriba, antes que «Nuestra filosofía».

Si el menú tiene más de siete u ocho opciones, en el móvil se hace largo. Suele ser señal de que sobran páginas o de que habría que agruparlas.

Prueba 5: rellenar el formulario

Es la prueba que más problemas saca. Rellena tu propio formulario de contacto desde el móvil, de principio a fin, y envíalo. Mientras lo haces, fíjate en esto:

• Al tocar el campo del teléfono, ¿sale el teclado numérico? ¿Y el que tiene la arroba en el campo del email?
• ¿Los campos son lo bastante grandes para tocarlos sin acertar en el de al lado?
• ¿Te pide datos que no hacen falta para contestar, como la dirección completa o el nombre de la empresa?
• Si te equivocas, ¿se entiende el mensaje de error y se conserva lo que ya habías escrito?
• Al enviar, ¿aparece una confirmación clara? ¿Te llega el mensaje al correo?

Lo último parece obvio, pero es habitual encontrar formularios que llevan meses sin enviar nada porque alguien cambió la contraseña del correo o se rompió un plugin. Revísalo de vez en cuando. En el artículo sobre cómo hacer un formulario de contacto que funcione hay más ideas.

Prueba 6: velocidad con datos móviles

Con el wifi apagado, cuenta mentalmente cuánto tarda la portada en verse y en poder usarse. Si pasas más de tres o cuatro segundos mirando una pantalla en blanco, piensa que muchos visitantes se van antes de ver nada. Después entra en PageSpeed Insights, la herramienta gratuita de Google, pega la dirección de tu web y mira la pestaña de móvil.

No te obsesiones con la nota. Fíjate en los avisos que más tiempo cuestan, que suelen ser imágenes demasiado pesadas, demasiados scripts de terceros (chats, píxeles de publicidad, mapas) o un hosting lento. Si quieres entender las métricas que aparecen, lo contamos en el artículo sobre la velocidad web y las Core Web Vitals.

Qué hacer si tu web suspende varias pruebas

Un par de fallos sueltos, como un botón pequeño o un campo que sobra, se arreglan con retoques. Si falla casi todo, lo más probable es que la web se pensara para el ordenador y se adaptara después, y parchearla sale caro para lo que mejora. En ese caso suele compensar plantearse una web nueva, diseñada desde el principio para leerse en el teléfono.

Con la lista de fallos y las capturas en la mano, podrás pedir presupuestos comparables y saber exactamente qué pedir que se corrija.

Si quieres una web pensada para el móvil

En Webmensual diseñamos cada web desde cero y la cobramos por cuota mensual, con mantenimiento y soporte de persona a persona incluidos, así que si después de publicarla algo no va bien en el móvil, se lo dices a alguien que conoce tu web. Puedes ver qué incluye cada plan o mandarnos la dirección de tu web actual y te preparamos una propuesta en menos de 24 horas.