Test Responsive — Comprueba cada viewport | QA Proof Skip to main content
Test Responsive

Encuentra el breakpoint que rompe tu página

QA Proof renderiza tu página en anchos de escritorio, tablet y móvil, y luego informa de roturas de layout, contenido desbordado y áreas táctiles demasiado pequeñas para pulsarlas.

Plan gratuito disponible · Sin tarjeta de crédito

3 viewports probados
Escritorio 1440px
95
Tablet 768px
78
Móvil 390px
92
Áreas táctiles
88

La tablet no la prueba nadie

La mayoría de equipos revisan la página en su portátil y en un móvil, y publican. Los anchos intermedios son justo donde las cosas se rompen sin avisar: un menú que salta de línea, una tabla que desborda, un botón imposible de pulsar con el pulgar. Los usuarios lo encuentran antes que tú.

Cómo funciona

1

Introduce tu URL

Solo necesitas la URL de una página: sin scripts, sin laboratorio de dispositivos, sin extensiones de navegador.

2

Renderizamos tres viewports

Escritorio, tablet y móvil se renderizan en un navegador real con los anchos reales de cada dispositivo.

3

Revisa qué se ha roto

Cada viewport recibe su propia puntuación más una lista de problemas de layout con las media queries sugeridas.

Qué comprobamos en cada ancho

Tres viewports reales

Escritorio, tablet y móvil renderizados con anchos reales de dispositivo, no una ventana de navegador aplastada con CSS.

Validación de áreas táctiles

Marca cualquier elemento interactivo por debajo del mínimo de 44×44px que las guías exigen para poder pulsarlo con fiabilidad.

Detección de desbordamientos

Detecta scroll horizontal, texto cortado y elementos empujados fuera del viewport.

Media queries recomendadas

Reglas de breakpoint sugeridas para cada problema, listas para añadir a tu hoja de estilos.

Puntuación por viewport

Ve de un vistazo qué ancho es el punto débil, en lugar de recibir una única cifra promediada.

Acceso por API

Lanza comprobaciones responsive desde CI para que un layout móvil roto nunca llegue a main.

Quién lo usa

Desarrolladores frontend

Detecta los problemas de breakpoint que de otro modo encontrarías arrastrando la ventana del navegador.

Ingenieros de QA

Cubre tres viewports en cada release sin mantener un laboratorio de dispositivos.

Equipos de ecommerce

La mayor parte de tu tráfico es móvil. Asegúrate de que el checkout funciona de verdad ahí.

Preguntas frecuentes

Por defecto, escritorio a 1440px, tablet a 768px y móvil a 390px: los anchos que representan el grueso del tráfico real. Cada uno se renderiza en un navegador real, no se simula redimensionando una ventana.
Las guías de accesibilidad fijan un mínimo de 44×44px para los elementos pulsables porque, por debajo de eso, los usuarios fallan al pulsar, sobre todo quienes tienen dificultades motoras. Además, las áreas táctiles pequeñas son uno de los mayores destructores de conversión en móvil.
Renderizamos en un motor de navegador real con anchos reales de dispositivo, lo que detecta problemas de layout, desbordamiento y áreas táctiles. El comportamiento propio del hardware, como las rarezas de la barra de Safari en iOS, sigue necesitando un dispositivo físico.
Unos 20 segundos para los tres viewports.
Las páginas deben ser accesibles públicamente para que el renderizador pueda cargarlas. Para entornos de staging, añade nuestras peticiones a la lista de permitidos o publica la página en una URL pública temporal.

Prueba tu página en todos los viewports

Plan gratuito, sin tarjeta, tres viewports en unos 20 segundos.

Empezar gratis