Comment faire une capture d'écran d'une page entière via Chrome ?

Vous avez régulièrement besoin de faire des captures d’écran mais pour une page entière avec Chrome ? Pour démontrer clairement à vos contacts qu’il manque par exemple des images ? Qu’il faut harmoniser des polices de caractère ? Pour faire un focus sur une mise en page qui convient ou à l’inverse, qui serait trop longue ?

Découvrons aujourd’hui comment capture une page entièrement via Chrome, en quelques clics. Une solution simple et rapide qui permet de partager des pages entières via capture d’écran fidèle à la réalité.

Tutoriel pour capturer via Chrome une page entière

Non, Chrome n’est pas un navigateur web parfait. Mais il est très populaire tout de même. Aussi, découvrons aujourd’hui comment capturer entièrement une page web via le navigateur officiel de Google. D’abord, ouvrez Chrome 😉 Ensuite, rendez-vous sur la page web qui vous intéresse. Dans mon cas, je vais prendre le média web Bernieshoot.fr que j’adore pour son ouverture sur de nombreuses thématiques. Dans mon cas et je vous conseille de le faire, je scrolle sur la page web concernée de haut en bas. Afin de permettre à toutes les photos et images de se charger. En effet, beaucoup de sites internet utilisent désormais le Lazy Load des images (à savoir le chargement différé des images). Car lorsque l’outil Chrome va charger à nouveau la page pour la capturer, il pourra avoir toutes les images dans la capturer qu’il va générer. Essayer sans scroller, et vous verrez que vous aurez souvent des cadres gris à la place des images.

Une fois votre page web ouverte et bien chargée, faîtes :

Sur Windows : Ctrl + MAJ + la lettre i du clavier

Sur MAC : Ctrl + MAJ + la lettre P du clavier

Quand l’outil de développement sera affiché sur le côté ou le bas de votre écran, vous verrez en haut à droite ce qui suit :

Cliquez sur cette icônes aux trois petits points verticalement alignés. Ce qui va vous ouvrir une liste d’options via laquelle vous aurez deux choix pour les captures d’écran :

Effectuer une capture d’écran

Effectuer une capture d’écran en taille réelle

C’est dans notre cas d’aujourd’hui, sur la seconde option qu’on cliquera puisque nous voulons une capture d’écran en taille réelle. Une fois que vous aurez cliqué sur « Effectuer une capture d’écran en taille réelle« , attendez de une à cinq ou six secondes le temps que Chrome puisse télécharger l’ensemble de la page. Cela inclut tout, dont les images. Aussi, quand une page est lourde, c’est évidemment un peu plus long.

Dès que la capture sera prête, Chrome vous ouvrira un pop up pour que vous puissiez enregistrer votre fichier image (format PNG) où vous le souhaitez sur votre PC ou Mac.

Vous obtiendrez donc si tout va bien, un fichier image PNG qui ressemblera à la page web de votre choix. Dans mon cas pour bernieshoot.fr, j’obtiens ceci (image volontairement convertie par mes soins de PNG à JPG pour qu’elle soit plus légère quand vous parcourez cet article. Ses dimensions furent également réduites.) :

On voit bien l’intégralité de la page d’accueil de Bernieshoot.fr et tout ce qui s’y afficherait au moment d’une visite.

Détails sur les captures d’écran complètes via Chrome

Attention à l’usage que vous allez faire de votre capture d’écran d’une page entière. Notamment parce que ces captures de page entière sont grandes et lourdes.

En effet, la taille ira de 1 à plusieurs méga octets. Pour du 7 MO, dans un email, ça peut vite devenir lourd.

Quant à l’usage d’une telle capture sur un article ou une page de site internet, je vous déconseille de la téléverser directement sans en réduire dimensions et taille avant.

Ce type de capture d’écran de page entière sert surtout à voir en détails l’intégralité d’un page web. Le fichier fait par exemple pour bernieshoot.fr environ 2480px de largeur pour 6596 pixels de hauteur. Si je zoome sur certaines zones de la page via l’explorateur photos de Windows, la qualité de l’image est nickel. Mais le fichier est donc lourd et ne pourra être envoyé ou mis en ligne sans retouche. Du moins, je ne le recommande pas.

Ma capture d’écran de page entière Chrome a des rectangles gris à la place des images

C’est un problème fréquent qui peut être assez vite réglé pour que vous ne perdiez plus de temps à cause de ces rectangles gris. Quand vous voulez capturer une page entière via Chrome, s’il s’agit d’une page de site internet ou de blog, alors parcourez toute la page de haut en bas. Ce avant de lancer le processus de capture de page entière. De manière à bien laisser le temps à toutes les images, icônes et autres photos de s’afficher. C’est souvent le chargement différé des images d’une page qui n’est pas entièrement affichée et parcourue, qui pousse Chrome à ne mettre sur votre capture de page entière, que les images du haut de l’écran.