Pasa más seguido de lo que parece: en la computadora del negocio la página se ve en orden, pero al abrirla en un teléfono aparecen letras diminutas, fotos cortadas y botones que no responden. Si últimamente te preguntas por qué mi página no se ve bien en el celular, la causa casi siempre está en cómo fue construida, y eso tiene arreglo.
El detalle que lo vuelve urgente es quién sufre el problema. Tú revisas tu página en el escritorio de vez en cuando; tu cliente la abre en su teléfono, en la fila del banco o en la sala de espera, y decide en segundos si se queda o regresa a Google. Una página que lo obliga a hacer zoom le está pidiendo un esfuerzo que la competencia ya no le pide.
Tu página no está rota, se diseñó para otra pantalla
Casi todos los sitios con este síntoma comparten la misma historia: se diseñaron una sola vez, pensando en un monitor ancho. Cuando un teléfono los recibe, el navegador hace lo que puede: encoge la página completa hasta que quepa, como una fotografía en miniatura, o deja que los elementos se acomoden a la fuerza y queden encimados.
El diseño responsivo existe justo para evitar eso. Una página responsiva no se encoge: se reorganiza. Las columnas que en pantalla grande van lado a lado se apilan una debajo de otra, el menú horizontal se convierte en un botón, los textos conservan un tamaño legible y los botones crecen hasta el tamaño de un pulgar. La página del celular y la de la computadora son la misma, con la información acomodada de forma distinta para cada pantalla.
Los síntomas más comunes
Hay señales que delatan el problema de inmediato. La más clara es el zoom obligatorio: si para leer un párrafo hay que pellizcar la pantalla, la página no está adaptada. Le sigue el desplazamiento lateral, ese margen fantasma que aparece cuando la página es más ancha que la pantalla y todo se mueve de lado al menor roce.
También hay síntomas de tacto. Botones y ligas tan juntos que el dedo toca el equivocado, formularios donde el campo del correo se sale de la pantalla, y menús que se despliegan al pasar el cursor, un gesto que en el teléfono no existe. Las imágenes tienen su propia versión del problema: fotos que se desbordan, se estiran o quedan encima del texto que deberían acompañar. Ninguno de estos defectos es cosmético; cada uno es un punto donde el visitante abandona.
Lo que Google hace con tu versión móvil
Google dejó de tratar la versión de escritorio como la principal hace años. Su sistema de indexación evalúa las páginas a partir de su versión móvil, y así lo documenta en su propia guía para sitios web: lo que tu página muestra en un teléfono es lo que el buscador toma en cuenta para decidir dónde aparece. Una página rota en celular pierde dos veces: abandona el visitante que ya llegó y queda mal parada ante quien reparte los siguientes.
Conviene separar este problema de otro que suele venir junto: la lentitud. Una página puede verse perfecta y tardar diez segundos en cargar, o cargar al instante y verse desacomodada. Las causas de lo primero las explicamos en por qué una página web es lenta; este artículo se ocupa de lo segundo.
Revísala tú mismo en cinco minutos
No necesitas herramientas ni conocimientos técnicos, solo tu teléfono y el de alguien más. Abre tu página como lo haría un cliente, desde el navegador y no desde un acceso guardado, y léela completa sin hacer zoom: si en algún punto acercas los dedos a la pantalla para agrandar algo, ahí hay un problema. Recorre cada botón con el pulgar, abre el menú, navega hasta tus servicios y hasta tu teléfono de contacto, y llena el formulario de principio a fin.
Después gira el teléfono a horizontal y repite el recorrido, porque hay páginas que solo fallan en esa orientación. Y cierra con la prueba más reveladora: pídele a dos o tres personas con celulares distintos que hagan lo mismo. Las pantallas cambian de tamaño y proporción entre marcas y modelos, y una página mal adaptada puede verse bien en un teléfono y romperse en el de junto.
Así se ve una página pensada para el teléfono
La solución de fondo no es parchar la versión de escritorio, es diseñar al revés. En nuestro caso el diseño de páginas web empieza en la pantalla del teléfono: primero se resuelve que el texto se lea, que los botones respondan al pulgar y que lo importante aparezca sin buscarlo, y desde ahí el diseño crece hacia la pantalla grande. A esa forma de trabajar se le llama mobile-first, primero el móvil, y es como construimos cada sitio.
Las dos pantallas de arriba son páginas reales de negocios de Torreón. En ambas el texto se lee sin esfuerzo, cada botón tiene espacio de sobra para el dedo y la acción principal, escribir por WhatsApp o hacer un pedido, está a la vista desde el primer segundo. Qué más necesita incluir la página de un negocio para convertir visitas en clientes lo detallamos en qué debe tener la página de un negocio local.
Preguntas frecuentes
¿Qué significa que una página sea responsiva?
Que detecta el tamaño de la pantalla donde se abre y reacomoda su contenido para esa medida: columnas que se apilan, menús que se compactan, textos y botones que conservan un tamaño usable. No es una versión aparte para celular; es la misma página comportándose distinto en cada dispositivo.
¿Se puede arreglar mi página actual o hay que hacerla de nuevo?
Depende de cómo esté construida. Si el diseño ya contempla pantallas distintas y solo falla en detalles, un ajuste puede bastar. Si la página se dibujó con medidas fijas para escritorio, adaptarla pieza por pieza suele costar más trabajo que rehacerla bien desde el principio. La respuesta seria sale de revisar cada caso; nuestros planes, con lo que incluye cada uno, están publicados en la página de precios.
¿Por qué en mi celular se ve bien y en el de un cliente no?
Porque no existe una sola pantalla de celular. El ancho, la altura y la proporción cambian entre marcas, modelos y años, y una página que no se adapta de verdad puede caber bien en una medida y romperse en otra. Por eso la prueba completa se hace en varios teléfonos, no en uno.
¿Que se vea mal en el celular afecta mi lugar en Google?
Google evalúa las páginas a partir de su versión móvil, según su propia documentación para sitios web. Una versión móvil defectuosa cobra doble factura: los visitantes la abandonan y el buscador la califica tal como se ve en el teléfono.
¿El problema puede ser mi celular y no la página?
Puede pasar, aunque es lo menos común. Si la página se ve mal en varios teléfonos distintos con el navegador actualizado, el problema está en la página. Si solo falla en un equipo viejo o en un navegador poco usual, prueba en otros dispositivos antes de sacar conclusiones.