Lag skjermbilde av websiden med enhetsrammen i Chrome

En mindre kjent funksjon i Google Chrome på stasjonære operativsystemer er muligheten til å ta et skjermbilde av en åpnet side som om skjermbildet som ble tatt var av nettleseren som kjører på en mobilenhet. Det kan til og med legge til en ramme rundt skjermbildet, slik at det ser ut som et realistisk bilde av en smarttelefon. Slik kan det gjøres.

Det er et spesialverktøy i Chrome Developer Tools som lar deg etterligne en mobilenhet. Det er veldig nyttig for utviklere å sjekke hvordan nettstedene deres ser ut på smarttelefoner og enheter med liten skjerm. Det gjør det mulig å spesifisere en tilpasset skjermstørrelse eller bruke forhåndsdefinerte enhetsstørrelser som iPhone, iPad, Nexus eller Samsungs Galaxy. Når den åpnede siden vises i enhetsemulatoren, kan brukeren ta et skjermbilde av siden. Det er også mulig å aktivere en enhetsramme rundt siden, slik at den ser ut som et realistisk bilde.

Du kan gjøre det som følger.

1. Åpne ønsket side i Chrome og trykk på F12. Dette åpner utviklerverktøy:
2. Klikk på emulator-knappen for mobilenhet for å bytte modus for utviklerverktøy:
3. Velg en enhet under enhetsvelgeren. For eksempel vil jeg velge iPhone 6:
4. Nå klikker du på de tre punktmenyen til høyre for enhetsvelgeren og merker av for alternativet 'Vis enhetsramme':
5. Voila, nå vises websiden din i en fin enhetsramme:
   
   Nå klikker du på de tre punktmenyen igjen og velger 'Ta skjermbilde':

Resultatet blir som følger:

Du er ferdig.