Exportar pantallazos (screenshots) en alta resolución en Chrome sin plugins adicionales

Para los profesionales del diseño este es un gran problema, extraer pantallazos con una resolución digna de una web. Por norma general los screenshots los hacemos con algunos plugins añadidos a nuestros navegadores (Fireshot, Easyscreenshot, etc). En está ocasión vamos a ver como hacerlo directamente desde el navegador Chrome y con alta resolución.

Paso 1

Abrimos en navegador Chrome y apretamos F12 en el teclado. Esto abrirá las herramientas de desarrollador. No te asustes, utilizaremos sólo unas opciones muy sencillas. Además no puedes romper nada.

Paso 2

Seleccionamos el botón «Toogle device toolbar» o apretamos CTRL+Mayúsculas+M. Aparecerá una barra sobre la web para visualizarla en diferentes resoluciones. Por defecto está seleccionada la opción «Responsive» que adapta el contenido según el tamaño de la pantalla del explorador. En el desplegable verás que hay diferentes dispositivos configurados con sus respectivas resoluciones. Nosotros no utilizaremos ninguno de ellos, así que crearemos uno personalizado.

Paso 3

En el menú desplegable vamos a la ultima opción «Edit…». Veremos que la pantalla de la derecha, cambia a esta otra.

Ahora vamos a seleccionar el botón «Add custom device…»

Paso 4

Ahora rellenamos los campos con está información.

Device = Portátil FHD para pantallazos
Screenshot width = 1920
Screenshot height = 1080
DPR = 4

También cambiamos el campo tipo de dispositivo de «Movile» a «Desktop».

Apretamos el botón «Add»

Lo importante aquí es el campo DPR, ya que este es el factor por el que multiplicará el ancho y alto del pantallazo. Es decir con está configuración extraerá una imagen de (1920×4) 7680 pixels por (1080×4) 4320 pixels. Esto nos ofrece una imagen con resolución 8K, más que suficiente para nuestros trabajos de impresión.

Paso 5

En el desplegable sobre la web, ahora veremos el nuevo dispositivo creado, picamos sobre él y veremos como cambia como lo vemos en la pantalla.

Paso 6

Para llevar a cabo nuestro pantallazo en resolución FHD deberemos seleccionar, en la misma barra del desplegable, los tres puntos de la derecha y seleccionar la opción «Capture screenshot». esto guardará la imagen en la carpeta «Descargas» de nuestro ordenador.

Dependiendo de la velocidad de tu ordenador tardará más o menos. Esto, si la página tiene slides en movimiento, hace un poco más difícil controlar el momento exacto del pantallazo, pero con un poco de técnica se logra.

A tener en cuenta, que también dependerá de la resolución de las imágenes del sitio, ya que si un logo está pixelado, también lo veremos pixelado, pero los textos e imágenes en alta resolución se verán perfectos.

Una vez hecho esto una vez, ya no deberemos volver a configurar el perfil y nos servirá para cualquier ocasión, sólo con F12, seleccionamos el perfil que hemos creado «Portátil FHD para pantallazos» y seleccionando la opción «Capture screenshot» en el menú tendremos cualquier pantallazo en resolución FullHD.

Truco extra: Si, en lugar de «Capture screenshot», seleccionamos «Capture full size screenshot» capturaremos el sitio web entero, desde la cabecera («header») hasta el pie («footer»).

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

veinte + tres =

Empiezapori es agente digitalizador de la ayuda Kit Digital

Somos agente digitalizador de la ayuda Kit Digital. Te ayudamos en la creación de tu sitio web o comercio electrónico y gestionamos tus redes sociales.
Llámanos (93 470 00 37) o rellena el formulario y nos pondremos en contacto contigo. Te ayudamos a gestionar la ayuda.
Para más información y contacto haz clic en el siguiente enlace.

Scroll al inicio