Contenido de la guía
La realidad del tráfico web en Perú
Según datos de Google Analytics agregados de cientos de sitios peruanos en 2025-2026, el 78 % del tráfico viene de celular , 18 % de escritorio y 4 % de tablet. Si tu web no se ve bien en celular, estás perdiendo 8 de cada 10 visitantes .
Google indexa con "mobile-first": el rendimiento y diseño de tu versión móvil determina tu ranking, no la versión escritorio.
Qué significa "responsive" bien hecho
No es solo "que se adapte". Es:
- Tipografía legible sin hacer zoom (mínimo 16px en body).
- Botones tap-friendly (mínimo 44 × 44 px, separación de 8px entre clickables).
- Imágenes que escalan sin estirarse ni cortar contenido relevante.
- Menú hamburguesa accesible que abre en < 200 ms.
- Forms con teclado correcto : type="email" muestra teclado de emails, inputmode="numeric" para números.
- CTA siempre visible (sticky bottom o flotante).
- Sin scroll horizontal jamás.
Los 5 errores más típicos en celular
Error 1: Tipografía minúscula
Ves texto como 12-13px en celular y los usuarios mayores de 40 abandonan el sitio. Solución : 16px mínimo en body, 18-20px en párrafos largos.
Error 2: Botones imposibles de tocar
Links de texto sin padding hacen que toques mal y termines en otro link. Solución : 44px de altura mínima en botones (Apple HIG y Google Material).
Error 3: Imágenes que tapan el CTA
El hero image en mobile es enorme y empuja el botón "Comprar" abajo del fold. El usuario no scrollea. Solución : hero compacto en mobile, CTA visible sin scroll.
Error 4: Tablas que rompen el layout
Tablas anchas hacen scroll horizontal o se ven amontonadas. Solución : overflow-x: auto en el contenedor o transformar tabla en cards verticales en mobile.
Error 5: Forms imposibles de llenar
Campos pequeños, sin labels visibles, sin teclado adecuado. Solución : campos altos (48px), labels arriba siempre, inputmode específico.
La regla de los 3 segundos
En mobile el usuario decide en 3 segundos si tu sitio le sirve. Para esos 3 segundos necesitás:
- Encabezado claro : qué hacés y para quién.
- CTA primario visible (sin scroll en pantalla típica de 360 × 640).
- Imagen relevante que cargue rápido (LCP < 2.5 s).
- Trust signals : logos clientes, sello "verificado", reseñas.
Cómo testear que tu web es realmente responsive
- Chrome DevTools : F12 → ícono de móvil → simulá iPhone 12 y Galaxy S20.
- Google Mobile-Friendly Test : search.google.com/test/mobile-friendly.
- PageSpeed Insights mobile : muestra problemas reales en mobile.
- BrowserStack o tu propio celular: el simulador no detecta todo (touch real, teclado, gestos).
- Probá con WiFi 4G real : en oficina con fibra óptica todo se ve rápido; en 4G de Lima el escenario cambia.
Mobile-first vs desktop-first
En 2026 lo correcto es mobile-first : diseñá primero para celular y escalá a desktop. Razones:
- 78 % del tráfico es mobile (Perú).
- Restricciones mobile fuerzan a priorizar lo importante.
- Adaptar mobile → desktop es más fácil que al revés.
- Google indexa la versión mobile.
Las herramientas de diseño (Figma, Webflow) ya asumen mobile-first por defecto.
Conclusión
Un sitio no responsive en 2026 no es un sitio defectuoso: es un sitio inexistente para el 78 % de tus clientes potenciales en Perú. Si tu web tiene más de 3 años y nunca pasó por una revisión mobile-first, necesitás un rediseño urgente .
En DATXALE auditamos tu sitio gratis y te mostramos visualmente cómo se ve en mobile vs lo que debería. Conversemos por WhatsApp.