Saltar al contenido

Comparación de capturas de pantalla

Qué es la comparación de capturas de pantalla, cómo funciona la diferenciación visual y dónde la usan los equipos de QA.

La comparación de capturas de pantalla consiste en revisar dos capturas de la misma pantalla, página o ventana para encontrar diferencias. La comparación puede ser visual, con las imágenes lado a lado, superpuestas con un control deslizante o mezcladas con opacidad parcial. También puede ser calculada: un software genera una imagen de diferencias que resalta los píxeles cambiados y un recuento o un porcentaje de píxeles distintos.

Una comparación fiable necesita entradas coincidentes. Las dos imágenes deben tener las mismas dimensiones en píxeles, el mismo factor de escala y el mismo recorte. Un cambio en el tamaño de la ventana, en la escala Retina o en la posición de desplazamiento hace que casi todos los píxeles difieran, aunque el contenido sea el mismo.

Comparación manual frente a automatizada

La comparación manual sirve para pocas imágenes y decisiones de criterio, como saber si un rediseño se lee mejor. La comparación automatizada sirve para muchas imágenes y ejecuciones repetidas: un script compara cada captura nueva con una línea base guardada e informa solo de las que cambiaron más allá de un umbral.

Dónde se usa la comparación de capturas de pantalla

  • Pruebas de regresión visual tras cambios de código.
  • Revisión de cambios de contenido en una página propia o de un competidor.
  • Imágenes de antes y después para revisiones de diseño y notas de versión.
  • Confirmación de que un documento o un panel coincide con una versión anterior.

Cómo funciona la diferenciación visual

  1. Alinea las dos imágenes al mismo tamaño.
  2. Compara los valores de color de cada píxel.
  3. Ignora las diferencias por debajo de una tolerancia, que absorbe el ruido del suavizado de bordes.
  4. Marca los píxeles cambiados con un color de resaltado e informa del total.

Los métodos perceptuales, como SSIM, comparan la estructura y el contraste en lugar de los valores exactos, lo que reduce las falsas alarmas por diferencias mínimas de renderizado.

Errores comunes en la comparación de capturas de pantalla

  • Comparar imágenes de tamaños o factores de escala distintos.
  • Dejar relojes, anuncios, carruseles o animaciones dentro del encuadre.
  • Tomar capturas con fuentes instaladas distintas o con una versión distinta del navegador.
  • Definir una tolerancia tan alta que pasan cambios reales.

¿Tomas las mismas capturas una y otra vez?

Website Capture de Temposhot mantiene la configuración de Device, Area y Wait por URL, así que las ejecuciones repetidas producen imágenes comparables. Para regiones de pantalla, un Custom Area guardado mantiene el mismo rectángulo. Consulta las opciones de captura.

Preguntas frecuentes

¿Cuál es un buen umbral de diferencia?

Depende de la página. Empieza con un valor bajo, revisa las falsas alarmas y enmascara las regiones dinámicas en lugar de subir el umbral.

¿Puedo comparar dos capturas sin instalar nada?

Sí. Compare Images resalta las diferencias en el navegador.

Fuentes

Recursos relacionados

¿Repites las mismas capturas de pantalla una y otra vez?

Temposhot captura una pantalla, una ventana o un área con temporizador y exporta el conjunto como PDF, imágenes, ZIP o MP4. Las herramientas gratuitas para navegador solo sirven para imágenes sueltas.

Recursos relacionados

Términos relacionados

Todos los términos del glosario