Un comprobador responsive (responsive checker) muestra una página en varios anchos de pantalla. Las herramientas online funcionan bien con páginas públicas que permiten incrustarse en un marco, y fallan con tres tipos de páginas: localhost, páginas tras un login y sitios que envían una cabecera que prohíbe la incrustación. Cuando el marco sale en blanco, la causa casi siempre es esta última, y puedes confirmarlo en diez segundos. Para esas páginas usa una herramienta que funcione dentro de tu propio navegador: el modo dispositivo de Chrome DevTools o una extensión de vista móvil.
Qué comprobador responsive para qué página
| Página que quieres revisar | Herramienta online | Qué funciona en su lugar |
|---|---|---|
| Página pública que permite el marco | Sí | Cualquier herramienta online |
| Página que prohíbe el marco | Marco en blanco o error | Modo dispositivo de DevTools, extensión de vista móvil |
| Sitio de pruebas tras un login | Normalmente la pantalla de acceso | DevTools o una extensión en una pestaña donde hayas iniciado sesión |
| localhost | No, los servidores de la herramienta no llegan | DevTools o una extensión; para un móvil real mira probar localhost en el móvil |
Por qué una herramienta online muestra un marco en blanco
La mayoría de las herramientas online cargan tu página dentro de un iframe. Un sitio puede indicar al navegador que no se muestre en un marco, con la cabecera X-Frame-Options o la regla frame-ancestors de su Content-Security-Policy. MDN describe X-Frame-Options: DENY como el bloqueo en cualquier marco, y SAMEORIGIN como el permiso solo cuando todos los marcos padre tienen el mismo origen que la página. Ponerlo en una etiqueta <meta> no tiene efecto: solo vale como cabecera HTTP. Ninguna herramienta puede saltárselo, porque lo aplica el navegador, no la herramienta.
Muchos sitios grandes envían una de estas cabeceras. Cuando lo miramos el 28 de octubre de 2026, bbc.com respondía con X-Frame-Options: SAMEORIGIN, así que no se puede mostrar en el marco de otro sitio. Es decisión del sitio y no tiene que ver con tu diseño.
Comprueba en diez segundos si un sitio permite el marco
Ejecuta esto en una terminal y busca las dos cabeceras:
curl -sI https://example.com | grep -iE "x-frame-options|content-security-policy"
Si ves X-Frame-Options: DENY o SAMEORIGIN, o una Content-Security-Policy con frame-ancestors, las herramientas online no mostrarán la página. Si no aparece ninguna, se permite el marco. En Chrome también puedes abrir DevTools, ir a Network, elegir la petición de la página y leer las cabeceras de respuesta.
Si es tu propio sitio, no debilites esas cabeceras solo para contentar a un comprobador: protegen a tus visitantes del clickjacking. Prueba con una herramienta que no necesite un marco.
Si el marco está bloqueado, usa una herramienta dentro del navegador
La vista previa de arriba también es una herramienta online: mete la página en un marco, así que tiene el mismo límite. Cuando un sitio prohíbe la incrustación, la herramienta online de vista móvil lo dice en lugar de enseñar un marco vacío, y la solución es la extensión. Una extensión de vista móvil, o el modo dispositivo de DevTools, cambia la propia pestaña, así que la cabecera no importa, y los logins y localhost funcionan como en cualquier pestaña. La guía del emulador móvil de Chrome cubre DevTools, y extensión simuladora móvil frente a DevTools ayuda a elegir.
Lo que un comprobador responsive no puede juzgar
Un comprobador que solo cambia el ancho equivale a arrastrar el borde de la ventana del navegador. No te dice si el servidor envía otra página a los móviles, cómo se comporta el diseño con contenido largo o con zoom al 200 %, ni cómo lo dibuja Safari. El método completo, del barrido de anchos a las capturas automáticas, está en cómo probar el diseño responsive. Considéralo una primera mirada, no una aprobación.
Preguntas frecuentes
¿Por qué un comprobador responsive muestra una página en blanco con mi sitio?
Lo más habitual es que tu sitio envíe X-Frame-Options o una regla CSP frame-ancestors que prohíbe el marco. Comprueba las cabeceras de respuesta como se explica arriba. Localhost y las páginas tras un login fallan por otro motivo: los servidores de la herramienta no llegan a ellas.
¿Puedo probar localhost con un comprobador responsive online?
No. Una herramienta online no puede alcanzar una dirección que solo existe en tu ordenador. Usa Chrome DevTools o una extensión de vista móvil en la pestaña donde tengas abierto tu sitio local.
¿Basta un comprobador responsive para aprobar un sitio?
No. Muestra el diseño en unos pocos anchos. Una aprobación real exige además pruebas con contenido extremo y una comprobación en dispositivos reales, que detalla la guía de pruebas responsive.
Fuentes: MDN, X-Frame-Options (consultado el 28 de octubre de 2026); cabeceras de respuesta de bbc.com pedidas con curl el 28 de octubre de 2026.