Comment prendre une capture d'écran de site Web avec des dimensions spécifiques à l'aide de Google Chrome

Comment prendre une capture d'écran avec Google Chrome

Si vous êtes une agence ou une entreprise qui possède un portefeuille de sites ou de pages que vous souhaitez partager en ligne, vous avez probablement éprouvé la douleur d'essayer de capturer l'uniforme. screenshots de chacun des sites.

L'un des clients avec lesquels nous travaillons est hébergé Solutions intranet qui peuvent être hébergés en interne dans les limites d'une entreprise. Les intranets sont extrêmement utiles pour les entreprises pour communiquer les nouvelles de l'entreprise, diffuser des informations marketing, fournir des informations sur les avantages, etc.

Nous avons aidé OnSemble à migrer sa solution Intranet hors du site Web de sa société mère. C'était un projet de grande envergure qui intégrait tout, de la création de nouveaux profils sociaux à la mise à jour de Marketo, puis au démontage d'une partie du développement personnalisé qu'ils avaient fait dans le passé pour combiner leurs sites.

Captures d'écran client avec Google Chrome

Vous ne le réalisez peut-être pas, mais vous pouvez capturer des captures d'écran parfaites avec l'ensemble intégré d'outils de développement robustes de Google Chrome. Fait intéressant, ce n'est pas une fonctionnalité très connue malgré sa flexibilité incroyable.

Voici un rapide didacticiel vidéo sur la façon de prendre une capture d'écran parfaite, de taille spécifique, d'une page Web à l'aide de Google Chrome:

Étapes pour prendre une capture d'écran avec Google Chrome

Les outils de développement de Google Chrome ont la possibilité de prévisualiser un site à l'aide de la barre d'outils de son appareil. L'outil a été conçu pour que les développeurs puissent voir à quoi ressemblait le site dans différentes tailles de fenêtres sur différents appareils… mais il se trouve que c'est aussi un moyen idéal pour obtenir une capture d'écran parfaitement dimensionnée d'une page Web.

Dans ce cas, nous voulons que chacun des principaux clients d'OnSemble dans les industries qui ont construit de beaux sites intranet prenne une capture d'écran afin que nous puissions tous les afficher dans un portefeuille sur leur site Web. Nous voulons que les pages mesurent 1200 800 pixels de large sur XNUMX pixels de haut. Pour y parvenir:

  1. Dans le bouton de navigation tout à droite (3 points verticaux), sélectionnez le Menu de personnalisation et de contrôle.

Menu des outils de développement avec Google Chrome

  1. Choisir Plus d'outils> Outils de développement

Outils de développement avec Google Chrome

  1. Basculer le Barre d'outils de l'appareil pour afficher les options et dimensions de l'appareil.

Basculer la barre d'outils de l'appareil avec Google Chrome

  1. Définissez la première option sur Sensible, puis définissez les dimensions sur 1200 x 800 et appuyez sur Entrée. La page s'affichera maintenant avec ces dimensions.

Barre d'outils de l'appareil réactif Google Chrome

  1. Sur le côté droit de la barre d'outils de l'appareil, cliquez sur le bouton de navigation (3 points verticaux) et sélectionnez Capturer Capture d'écran.

Capturez une capture d'écran avec Google Chrome

  1. Google Chrome prendra une capture d'écran parfaite et la déposera dans votre Télécharger dossier dans lequel vous pouvez le joindre et l'envoyer dans un e-mail. Assurez-vous de ne pas sélectionner une capture d'écran en taille réelle, car cela prendra toute la longueur de la page et ignorera votre limite de hauteur.

Raccourcis clavier de Google Chrome pour les captures d'écran

Si vous êtes un maître des raccourcis clavier, vous pouvez également simplement prendre une capture d'écran pleine page avec ces raccourcis. Je n'aime pas cette approche car je ne peux pas définir la hauteur maximale de la fenêtre… mais elle est pratique si jamais vous avez besoin d'une capture d'écran d'une page entière.

Raccourcis clavier sur un Mac:

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

Raccourcis clavier sous Windows ou Linux:

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

Que pensez-vous?

Ce site utilise Akismet pour réduire les spams. Découvrez comment sont traitées les données de vos commentaires..