Lav et skærmbillede af webside med enhedsramme i Chrome

En mindre kendt funktion ved Google Chrome på desktop-operativsystemer er evnen til at tage et skærmbillede af en åbnet side, som om det skærmbillede, der blev taget, var af browseren, der kører på en mobilenhed. Det kan endda tilføje en ramme omkring skærmbilledet, så det ligner et realistisk foto af en smartphone. Her er hvordan det kan gøres.

Der er et særligt værktøj i Chrome Developer Tools, som giver dig mulighed for at efterligne en mobilenhed. Det er meget nyttigt for udviklere at tjekke, hvordan deres websteder ser ud på smartphones og små skærme. Det giver mulighed for at angive en brugerdefineret skærmstørrelse eller bruge foruddefinerede enhedsstørrelser som iPhone, iPad, Nexus eller Samsungs Galaxy. Når den åbnede side er vist i enhedsemulatoren, kan brugeren tage et skærmbillede af siden. Det er også muligt at aktivere en enhedsramme rundt om siden, så det kommer til at ligne et realistisk billede.

Du kan gøre det som følger.

1. Åbn den ønskede side i Chrome og tryk på F12. Dette åbner udviklerværktøjer:
2. Klik på mobilenhedsemulatorknappen for at skifte tilstanden Udviklerværktøjer:
3. Vælg en enhed under enhedsvælgeren. For eksempel vil jeg vælge iPhone 6:
4. Klik nu på menuen med 3 prikker til højre for enhedsvælgeren, og marker indstillingen "Vis enhedsramme":
5. Voila, nu vises din webside inde i en flot enhedsramme:
   
   Klik nu på menuen med tre prikker igen og vælg "Capture screenshot":

Resultatet bliver som følger:

Du er færdig.