Creer des miniatures de site internet

Il existe de nombreux sites proposant la création de miniatures de sites (website screenshot), mais ils ne sont pas forcément adaptés à nos besoins, ni très réactifs et peuvent changer leur politique d’utilisation ou tout simplement disparaître du jour au lendemain.

Je vais donc vous donner une méthode/script pour les créer vous-même.

Seule contrainte: avoir un serveur dédié linux pour pouvoir installer quelques outils

Installation des paquets nécessaires

Au préalable, nous avons donc besoin de 3 applications:

• CutyCapt : qui permet de générer des snapshot  
• Xvfb : serveur X qui peut être lancé sur des machines sans carte graphique. Il émule un framebuffer en utilisant la mémoire virtuelle.
• Imagemagick : Boite à outils pour manipuler des images en ligne de commande

Il suffit donc d’installer ces 3 paquets. Sous ubuntu c’est très simple:

aptitude install cutycapt xvfb imagemagick

Une fois que tout est installé, nous allons pouvoir dans un premier temps faire une capture d’écran d’un site, puis manipuler l’image pour en faire une miniature.

Création capture écran

C’est très simple, en une seule ligne de commande:

xvfb-run --server-args="-screen 0, 1024x768x24" cutycapt --url=http://www.jawama.com --out=jawama.png

Astuce:
Si message d’erreur « xvfb-run: error: Xvfb failed to start » rajouter les paramètres « –auto-servernum –server-num=1 »

Ce qui donnera:

xvfb-run --auto-servernum --server-num=1 --server-args="-screen 0, 1024x768x24" cutycapt --url=http://www.jawama.com --out=jawama.png

Vous pouvez définir la résolution de l’écran (ici 1024x768x24), l’url à capturer et le nom de sortie.

Vous allez obtenir une image de ce type:

Capture avec CutyCapt

C’est une capture de la page entière en taille réelle. Reste maintenant à générer la miniature.

Création de la miniature

Maintenant, c’est au tour de imagemagick de prendre la main.

Nous allons donner à la capture d’écran la largeur désirée:

convert -resize 120 jawama.png jawama_120.png

Ici, 120px de large.

Capture du site Jawama 120px de large

Maintenant il ne nous reste plus qu’à la couper pour obtenir un rectangle:

convert -crop 120x90+0+0 jawama_120.png jawama_120_crop.png

Et voici notre miniature terminée!

Capture Jawama.com en miniature