Aujourd’hui je vous retrouve pour vous montrer comment j’ai fait une image telle que celle-ci:

Pour ce tutoriel, nous allons utiliser Google Chrome et une extension bien utile, nommée ‘Nimbus Screenshot’ (téléchargeable ICI ) Une fois l’extension installée, vous devriez avoir son icone en haut à droite de votre fenêtre

Cliquez dessus pour ouvrir le panel d’utilisation

Un grand nombre de fonction est proposée, celle qui nous intéresse ici est ‘page entière’

Une fois ce bouton cliqué, l’extension scrollera (monter/descendre) votre page, et prendra plusieurs captures d’écrans qui s’ajouteront les unes aux autres pour ne former qu’une seule image. Un nouvel onglet s’ouvrira et vous aurez un aperçu de la capture qui vient d’être faite. Il arrive parfois que des barre noires soient présentes entre les différentes parties du sites, si c’est votre cas, essayez de vider le cache de ce site ou alors d’actualiser la page et d’attendre qu’elle ait finie de charger à 100%.
Vous devriez avoir un aperçu qui ressemble à ceci:

Vous pouvez rajouter des fleches ou du textes ainsi que faire des modifications si vous le souhaitez, je vous laissez découvrir l’extension et ses ressources par vous même.
Une fois cliqué sur ‘DONE’ (voir ci-dessous) puis sur ‘Save as Image’, vous choissirez le repertoire où vous souhaitez enregistrer la capture et ce sera terminé, vous avez désormais une capture de votre site en entier.

J’espère que ce tutoriel vous aura servi, et vous servira dans le futur. Cet outil peut aussi être utile lors de l’intégration d’un site web, ou à l’inverse, la création de template dans photoshop.