Analizar una página web con IA a partir de una captura completa

Por qué una captura del área visible es una mala entrada para la IA

Un modelo de lenguaje solo razona sobre lo que hay en la imagen. Si le das una captura del área visible de una página de aterrizaje, ve la sección principal y nada más. Aun así responderá con seguridad, porque es lo que hacen estos modelos, pero su consejo tratará sobre un fragmento de una página cuyo resto no puede ver.

Una captura de página completa elimina esas suposiciones. El modelo recibe la sección principal, los testimonios, los bloques de funciones, la tabla de precios y el pie de página en una sola imagen, en el orden exacto en que los encuentra un visitante. Ese orden es la base de casi cualquier comentario de diseño: qué va primero, qué se repite, dónde la vista no encuentra en qué apoyarse y dónde está la siguiente llamada a la acción.

También elimina toda una categoría de respuestas erróneas. Si preguntas “¿Mi llamada a la acción es lo bastante clara?” a partir de un recorte del área visible, el modelo no puede saber que más abajo hay otros cuatro botones compitiendo con ella.

Cómo analizar una página web con IA, paso a paso

Con la extensión instalada, lleva bastante menos de un minuto.

1. 1

   Deja que la página termine de cargarse

   En páginas con imágenes de carga diferida o secciones animadas, desplázate una vez hasta el final y vuelve arriba. Lo que el navegador aún no ha dibujado no se puede capturar, y una captura medio vacía da comentarios medio útiles.

2. 2

   Captura la página completa

   Haz clic en el icono de la barra de herramientas y elige “Full page” (página completa), o presiona Alt+Shift+S (Opción+Mayúsculas+S en Mac) si Chrome ha asignado ese atajo sugerido. La extensión desplaza la página, captura cada sección, las une en una imagen alta y abre el resultado en una pestaña nueva.

3. 3

   Oculta primero lo privado

   Si la página muestra nombres de clientes, facturas, direcciones de correo o datos internos, tápalos con “Blur”, “Pixelate” o “Redact” en el editor integrado antes de que la imagen salga de tu dispositivo. Lo que subes a un servicio de IA queda sujeto a las condiciones de ese servicio, no a las tuyas.

4. 4

   Exporta en PNG

   PNG no tiene pérdida, así que los bordes del texto y las líneas finas se mantienen nítidos y el modelo no tiene que leer artefactos de compresión de JPEG. Usa JPEG o WebP solo si chocas con un límite de tamaño de subida.

5. 5

   Sube el archivo y haz una pregunta concreta

   Arrastra el archivo a ChatGPT, Claude, Gemini, Copilot o tu herramienta de creación con IA. Las instrucciones vagas producen respuestas vagas, así que define un objetivo: “Esta es la página de inicio completa de un producto SaaS B2B. Revisa la jerarquía visual, la coherencia del espaciado y si la llamada a la acción principal sigue siendo evidente de arriba abajo. Enumera cambios concretos, empezando por el más importante.”

Instrucciones que de verdad producen comentarios útiles

La captura es el contexto; la instrucción decide si recibes una crítica o un cumplido. Dale al modelo un papel, un público y un único criterio que evaluar.

• Jerarquía: “Recorre esta página sección por sección y dime qué es lo primero que llama la atención en cada una. ¿Dónde se rompe la jerarquía?”
• Coherencia: “Enumera todas las incoherencias de espaciado, tamaños de los títulos, estilos de los botones y radios de las esquinas que veas en toda la página.”
• Recorrido de conversión: “Vendo una extensión de Chrome. Sigue el camino desde la parte superior de esta página hasta el botón de instalación y señala cada punto en el que un visitante podría quedarse atascado.”
• Textos: “Reescribe el titular y el primer párrafo de cada sección para que alguien que llega por primera vez entienda el producto en cinco segundos.”
• Comparación: sube tu captura de página completa y la de un competidor, y pregunta cuál de las dos explica su producto más rápido y por qué.
• Señales de accesibilidad: “Marca cualquier texto de esta página cuyo contraste con el fondo parezca demasiado bajo para leerlo con comodidad.”

Lo que una IA puede y no puede valorar en una captura

Conocer los límites es lo que hace útil este método. Una imagen es una representación de la página, no la página.

• Fiable: jerarquía visual, orden de las secciones, ritmo del espaciado, alineación, incoherencias evidentes, claridad del titular y de los textos, si una llamada a la acción destaca, densidad del diseño y problemas aparentes de contraste.
• Poco fiable: valores exactos de color y relaciones de contraste (el modelo los estima a partir de los píxeles, no lee tu CSS), nombres de tipografías, rendimiento de carga, estados al pasar el puntero y de foco, animaciones, navegación con el teclado, comportamiento con lectores de pantalla y comportamiento adaptable en otros anchos.
• Imposible: saber si los usuarios reales convierten. Una revisión a partir de una captura es una crítica heurística, no una prueba de usabilidad ni una auditoría de accesibilidad.
• Consejo práctico: captura la misma página con un ancho de escritorio y con un ancho de teléfono y sube las dos. La mayoría de los problemas de diseño solo se ven al compararlas.

Páginas muy altas: por qué fallan las subidas a la IA y cómo evitarlo

Una página de marketing o de documentación larga puede medir 15 000 píxeles de alto. Si la subes como una sola imagen, el servicio puede rechazar el archivo o reducirlo hasta que el texto sea ilegible.

La solución no es recortar a mano. Exporta la captura en partes numeradas de unos 3000 a 5000 píxeles cada una, con 160 píxeles de superposición entre ellas. La superposición importa: sin ella, un título y su párrafo pueden quedar a lados distintos de un corte, y el modelo los lee como si no tuvieran relación.

Después sube las partes en orden y dilo en la instrucción: “Son secciones numeradas y superpuestas de una misma página, en orden de arriba abajo. Revísalas como una sola página.” La mayoría de los chats aceptan varias imágenes por mensaje, así que mantienes una sola conversación y una sola crítica.

Otros usos de este método

El análisis de diseño es el uso más evidente, pero la misma captura sirve para mucho trabajo diario.

• Revisión de diseño con clientes: anota la captura de página completa con flechas y notas en lugar de describir las secciones en un correo.
• Análisis de la competencia: guarda una carpeta con capturas completas de sitios de la competencia y pide a un modelo que resuma cómo se posiciona cada uno.
• De captura a código: pasa una captura completa a una herramienta de creación con IA como punto de partida para la estructura y la maquetación, y luego afínala en el navegador. Trata el resultado como un primer borrador, no como un producto terminado.
• Informes de errores: una imagen con toda la página rota vale más que cinco recortes, porque quien la revisa ve el estado de todo lo que rodea al error.
• Documentación y traspasos: captura un flujo completo, página a página, y guárdalo junto a la incidencia.
• Archivo: un PNG o PDF de página completa tal como se veía en una fecha concreta, útil para páginas de precios, condiciones y propuestas.

La captura se queda en tu dispositivo

GoFullScreenshot desplaza, une, edita y exporta todo en tu navegador. No hay servidor en el proceso, ni cuenta, ni analítica en la extensión, ni una copia subida de tu página.

Eso importa precisamente porque el siguiente paso de este método es un servicio de IA. Tú decides qué imagen sale de tu dispositivo, después de haber podido ocultar lo necesario. La extensión nunca toma esa decisión por ti.