Come acquisire uno screenshot del sito Web con dimensioni specifiche utilizzando Google Chrome

Come fare uno screenshot con Google Chrome

Se sei un'agenzia o un'azienda che ha un portafoglio di siti o pagine che desideri condividere online, probabilmente hai passato il dolore di provare a catturare l'uniforme screenshot di ciascuno dei siti.

Uno dei client con cui stiamo lavorando è ospitato nelle build Soluzioni Intranet che può essere ospitato internamente all'interno dei confini di un'azienda. Le intranet sono incredibilmente utili per le aziende per comunicare notizie aziendali, distribuire informazioni di marketing, fornire informazioni sui vantaggi, ecc.

Abbiamo aiutato OnSemble a migrare la propria soluzione Intranet dal sito Web della società madre. Si trattava di un ampio progetto che comprendeva tutto, dalla creazione di nuovi profili social, all'aggiornamento di Marketo e allo smontaggio di parte dello sviluppo personalizzato che avevano fatto in passato per combinare i loro siti.

Screenshot dei client con Google Chrome

Potresti non rendertene conto, ma puoi catturare screenshot perfetti con il set integrato di potenti strumenti per sviluppatori di Google Chrome. È interessante notare che non è una caratteristica molto conosciuta nonostante abbia una straordinaria flessibilità.

Ecco un breve video tutorial su come acquisire uno screenshot perfetto, di dimensioni specifiche, di una pagina Web utilizzando Google Chrome:

Passaggi per fare uno screenshot con Google Chrome

Gli strumenti per sviluppatori di Google Chrome hanno la possibilità di visualizzare in anteprima un sito utilizzando la barra degli strumenti del dispositivo. Lo strumento è stato creato in modo che gli sviluppatori potessero vedere l'aspetto del sito in diverse dimensioni di viewport su diversi dispositivi ... ma è anche un modo perfetto per ottenere uno screenshot di dimensioni perfette di una pagina web.

In questo caso, vogliamo che ciascuno dei clienti chiave di OnSemble nei settori che hanno creato bellissimi siti Intranet acquisisca uno screenshot in modo da poterli visualizzare tutti all'interno di un portfolio sul loro sito web. Vogliamo che le pagine siano larghe 1200 px e alte 800 px. Per realizzare questo:

  1. Nel pulsante di navigazione all'estrema destra (3 punti verticali), seleziona il file Personalizza e controlla il menu.

Menu Strumenti per sviluppatori con Google Chrome

  1. Seleziona Altri strumenti> Strumenti per sviluppatori

Strumenti per sviluppatori con Google Chrome

  1. Attiva / disattiva il Barra degli strumenti del dispositivo per visualizzare le opzioni e le dimensioni del dispositivo.

Attiva / disattiva la barra degli strumenti del dispositivo con Google Chrome

  1. Imposta la prima opzione su Di risposta, quindi imposta le dimensioni su 1200 x 800 e premi invio. La pagina verrà ora visualizzata con quelle dimensioni.

Barra degli strumenti del dispositivo reattivo Google Chrome

  1. Sul lato destro della barra degli strumenti del dispositivo, fare clic sul pulsante di navigazione (3 punti verticali) e selezionare Catturare Screenshot.

Cattura screenshot con Google Chrome

  1. Google Chrome acquisirà uno screenshot perfetto e lo rilascerà nel tuo file Download cartella in cui puoi allegarlo e inviarlo in un'e-mail. Assicurati di non selezionare lo screenshot a dimensione intera poiché occuperà l'intera lunghezza della pagina e ignorerà il limite di altezza.

Scorciatoie da tastiera di Google Chrome per screenshot

Se sei un maestro delle scorciatoie da tastiera, puoi anche fare uno screenshot a tutta pagina con queste scorciatoie. Non mi piace questo approccio perché non posso impostare l'altezza massima del viewport ... ma è utile se hai mai bisogno dello screenshot di un'intera pagina.

Scorciatoie da tastiera su un Mac:

1. Alt + Command + I 
2. Command + Shift + P

Scorciatoie da tastiera su Windows o Linux:

1. Ctrl + Shift + I 
2. Ctrl + Shift + P

Cosa ne pensi?

Questo sito utilizza Akismet per ridurre lo spam. Scopri come vengono elaborati i dati dei tuoi commenti.