Q
uando si realizzano delle bozze grafiche di un layout o si deve fare una presentazione della grafica di un template, può capitare di dover prelevare lo screenshot di una pagina web che però è più lunga del vostro schermo.
Quali sono le tecniche per fare uno screenshot in un unico file?
Nella peggiore delle ipotesi si riesce a ricreare una immagine facendo più screenshot, a varie altezze o livelli di scroll, della pagina, per poi ricomporre il tutto in un unica immagine.
Esiste però un sistema che ti permette in pochi e semplici passaggi di catturare l’intera pagina del sito web. Di seguito vi faremo vedere come salvare l’immagine dell’intera pagina sia con Chrome che con Firefox.
Full-page Screenshot con Google Chrome
Google Chrome include uno strumento di screenshot integrato che però è un po’ nascosto. Vi faremo vedere noi con una combinazione di tasti come catturare lo screenshot di una pagina web per intero.
A seconda di quale sistema operativo usi, ecco le scorciatoie da utilizzare:
Su Mac
1. Alt
+ Command
+ I
2. Command
+ Shift
+ P
Su Windows/Linux/Chrome OS
1. Ctrl
+ Shift
+ I
2. Ctrl
+ Shift
+ P
A questo punto ispezioniamo il codice della pagina attraverso il comando Ctrl + Shift + I

Poi attraverso il comando Ctrl + Shift + P cerchiamo il termine screenshot

Clicchiamo su capture full size screenshot e in automatico partirà il download dello screenshot dell’intera pagina web

Full-page Screenshot con Firefox
Firefox, a differenza di Chrome, è più intuitivo, basta infatti attivare l’iconcina all’interno della visualizzazione del codice e con un semplice click salvare lo screenshot dell’intera pagina.
Come per Chrome, anche su Firefox possiamo utilizzare le scorciatoie per visualizzare il codice sorgente:
Su Mac
1. Alt
+ Command
+ I
Su Windows/Linux/Chrome OS
1. Ctrl
+ Shift
+ I
Una volta lanciato il comando per ispezionare il codice, troviamo in alto a destra l’icona della macchina fotografica.

Una volta cliccato sull’icona partirà in automatico il download dello screenshot dell’intera pagina web
N.B. se l’icona della macchina fotografica non è presente nella vostra schermata, nessun problema, bisogna semplicemente attivarla dalle impostazioni
Una volta aperto il codice sorgente clicchiamo in alto a destra dove ci sono i 3 puntini ( ··· ) e poi su Impostazioni
Nella schermate delle Impostazioni spuntiamo la voce Cattura una schermata della pagina intera sotto a Pulsanti disponibili

A questo punto è possibile procedere con lo screenshot della pagina come visto in precedenza.
See you soon!
Ottimo Grazie!