Cómo hacer que tu página web se vea bien en celular

Hay una escena que se repite en casi todas las PyMEs. El dueño revisa su página web en la computadora de la oficina, la ve bien y da por hecho que está lista. Mientras tanto, ocho de cada diez personas que la visitan lo hacen desde un celular, con una pantalla seis veces más chica, con los dedos en lugar del mouse y muchas veces con datos móviles en lugar de wifi. Esa mayoría está viendo una versión del sitio que el dueño casi nunca abre.

Por qué el celular es una experiencia distinta, no la misma más chica

Un visitante en computadora suele estar sentado, con tiempo y con intención de investigar. Un visitante en celular está en la calle, en la fila del banco o en el estacionamiento, y busca una de tres cosas: el teléfono, la dirección o el precio. Si tu sitio se los pide a través de tres clics y un formulario, se va. No porque el sitio esté feo, sino porque no le dio lo que buscaba en los primeros diez segundos.

A eso se suma que Google evalúa la versión móvil de tu sitio para decidir cómo posicionarte, no la de escritorio. Un sitio que funciona bien en computadora y mal en teléfono no solo pierde a los visitantes que ya llegaron: pierde también posiciones frente a competidores que sí lo resolvieron.

Qué revisar hoy mismo desde tu teléfono

• Abre tu sitio con datos móviles, no con wifi, y cuenta los segundos hasta que se ve algo útil. Si pasan más de tres, la mitad de tus visitantes ya se fue.
• Revisa si el número de teléfono es un botón que marca al tocarlo. Si hay que copiarlo y pegarlo, estás perdiendo llamadas por un detalle de dos minutos de trabajo.
• Intenta llenar tu formulario de contacto con una sola mano. Si los campos son diminutos o el teclado tapa lo que estás escribiendo, nadie lo va a terminar.
• Verifica que no haya que hacer zoom para leer nada. Si tienes que separar los dedos para entender un texto, la letra es demasiado chica.
• Comprueba que ningún elemento se salga de la pantalla a los lados. Una tabla o una imagen que obliga a deslizar horizontalmente rompe la lectura por completo.
• Busca el botón de WhatsApp. Si no está visible sin bajar, en México estás renunciando al canal por el que la mayoría de tus clientes prefiere escribir.

Esta revisión toma diez minutos y no requiere saber nada técnico. Lo importante es hacerla en un teléfono real, con conexión de calle, no en el simulador del navegador de una computadora, porque ahí todo carga instantáneo y todo se ve bien.

Si nunca has abierto tu sitio desde el celular en la calle, no conoces la versión que ve la mayoría de tus clientes.

Los errores que más cuestan

El más caro es el peso de las imágenes. Una foto tomada con teléfono pesa varios megabytes, y una página con seis de esas fotos sin optimizar tarda una eternidad en abrir con datos móviles. Es el problema más común y también el más fácil de resolver: comprimir las imágenes suele reducir el tiempo de carga a la mitad sin cambiar nada más.

El segundo son las ventanas emergentes. Un aviso de cookies, una promoción y un chat que se abren todos al mismo tiempo dejan al visitante buscando dónde está la X en una pantalla de seis pulgadas. Muchos no la encuentran y cierran la pestaña completa. En móvil, cada elemento que tapa el contenido cuesta visitantes de forma directa.

El tercero es el menú. Un menú con quince opciones desplegables funciona en una pantalla ancha y es un laberinto en el teléfono. La versión móvil necesita menos opciones, no las mismas apiladas: contacto, servicios, y poco más. Todo lo demás se puede alcanzar desde el contenido.

Si al hacer la revisión encuentras tres o más de estos problemas, el arreglo no es un parche sino una reconstrucción de la versión móvil, y conviene resolverla de raíz. Un sitio pensado desde el principio para el teléfono, como los que hacemos en sitios web, no es una adaptación de la versión de escritorio: es la versión principal, y la de computadora es la que se adapta. Ese cambio de orden es lo que separa a un sitio que convierte de uno que solo existe.