Web responsive: qué probar además de reducir la pantalla
La adaptación móvil debe permitir leer, navegar y completar formularios. Comprueba contenido, controles y carga durante una tarea real.
La web cabe en la pantalla del móvil, pero el menú tapa el botón de contacto. Al abrir el formulario, el teclado oculta el mensaje de error. La página parece adaptada en una captura y sigue siendo difícil de utilizar.
La adaptación debe comprobarse durante una tarea. El diseño necesita reorganizar contenido y controles sin obligar al visitante a adivinar dónde pulsar, leer frases cortadas o abandonar una acción a medias.
Empieza con una solicitud real
Elige una tarea importante, como encontrar un servicio y enviar una consulta. Completa el recorrido desde un móvil sin instrucciones adicionales. Anota dónde necesitas ampliar, volver a buscar información o cerrar un elemento que tapa otro.
Repite con distintos anchos y con el teléfono en horizontal. No hace falta diseñar para cada modelo: hay que descubrir dónde deja de funcionar el contenido. Los títulos largos, otros idiomas y los mensajes de validación suelen mostrar problemas que una página vacía oculta.
Lee el contenido, no solo los títulos
Revisa párrafos, listas, tablas y pies de imagen. Una imagen que contiene texto puede resultar ilegible al reducirse. En ese caso, una explicación en HTML o un diagrama adaptado puede ser más útil que obligar a ampliar toda la figura.
El criterio de reajuste de WCAG trata de conservar información y funciones sin desplazamiento en dos direcciones, salvo contenidos que requieren ese formato.
Aumenta el tamaño del texto en el navegador y observa la reorganización. Una altura fija puede cortar un botón o un mensaje cuando crece la fuente. Incluye en la revisión elementos fijos como avisos de cookies, chat y publicidad.
Utiliza menús y formularios hasta el final
Abre y cierra el menú, cambia de página, vuelve e intenta navegar con teclado. El foco debe seguir siendo identificable. En los formularios, comprueba campos obligatorios, teclados adecuados al dato solicitado y mensajes de error cerca del problema.
Envía una consulta de prueba y confirma que llega. Que un botón cambie de color no demuestra el envío. Si falla la conexión, la persona necesita entender qué ha ocurrido y poder reintentarlo sin reconstruir todo el mensaje.
Observa la carga en condiciones realistas
No dependas únicamente del wifi rápido de la oficina. Observa cuándo aparece la información principal y si el diseño se desplaza mientras cargan imágenes, fuentes y anuncios. Reserva espacio para ellos e investiga archivos excesivos antes de añadir efectos.
Las herramientas de rendimiento ayudan a localizar problemas, pero una puntuación aislada no describe toda la experiencia. Registra página, dispositivo o simulación, condiciones de red y resultado. Así podrás comparar una corrección con criterios claros.
Qué relación tiene con búsquedas y ventas
Google indica que utiliza la versión móvil del contenido para indexar y clasificar. No retires información esencial solo para acortar el diseño móvil.
El efecto sobre las ventas debe medirse en el propio negocio. Arreglar un formulario elimina un obstáculo; no genera demanda ni garantiza ingresos automáticamente. Observa si las personas terminan sus tareas y si las consultas corresponden a la oferta. Esas señales orientan las siguientes mejoras.
Si recibes tráfico de campaña, revisa también el recorrido completo de una landing page.
Sobre el autor
Tiago F SantiagoComentarios
Todavía no hay comentarios
Comparte una pregunta o una experiencia relacionada con el artículo.
Artículos relacionados
