Nous écrivons les articles de la base de connaissances pour être compréhensibles sans captures d'écran, mais elles rendent les choses plus faciles à comprendre — particulièrement pour les débutants. Alors, ne soyez pas avare en captures d'écran pour les articles sur lesquels vous travaillez.

Qu'est-ce qui fait qu'une capture d'écran est bonne ?

• Elles illustrent une procédure difficile à comprendre. Vous ne devez pas avoir une capture d'écran pour chaque étape — juste celle où vous voulez être sûr que quelqu'un ne manquera pas un détail important.
• Elles correspondent à ce que voit l'utilisateur sur son écran. C'est pourquoi nous avons la capacité (utiliser la balise {for}) d'afficher des captures d'écran Windows aux utilisateurs Windows, Mac aux utilisateurs Mac.
• Elles comprennent suffisamment de contexte pour que n'importe qui puisse deviner la partie de l'interface qu'il est en train de voir.
• Elles utilisent le système d'exploitation en cours et les configurations par défaut de Firefox. Cela signifie donc, par exemple, Windows 7 Aero et le dernier Firefox sans personnalisation. La façon la plus facile d'avoir Firefox à son état par défaut est de créer un nouveau profil à utiliser juste pour la création de captures d'écran. Consultez Gestionnaire de profils – créer, supprimer et changer les profils de Firefox pour des instructions.

Mettre l'accent sur les captures d'écran Windows

Les utilisateurs Windows représentent plus de 90% de nos visiteurs. Une capture d'écran Windows sera donc vue, en moyenne, neuf fois plus qu'une Mac et Linux combinée. La création de captures d'écran prend du temps. Si vous n'avez que peu de temps, veuillez porter vos efforts sur les captures d'écran Windows.

Créer des captures d'écran Windows

Ces instructions utilisent la commande intégrée d'impression d'écran de Windows 7 et le programme Paint.

1. D'abord, activez le thème par défaut Windows 7 Aero et mettez un arrière-plan blanc.
   
   • Sous « Thèmes Aero », sélectionnez Windows 7.
   • Puis, cliquez sur le lien Arrière-plan du Bureau en bas de la fenêtre et choisissez un arrière-plan blanc uni.
2. Ensuite, reproduisez la situation dans laquelle vous voulez capturer l'écran. Quand vous avez obtenu ce que vous vouliez, appuyez sur Print Screen ou Impécr Syst sur votre clavier.
3. Depuis le menu Démarrer, ouvrez le programme Paint.
4. Une fois Paint ouvert, cliquez sur Coller. Votre capture d'écran apparaitra.
   
5. Maintenant, recadrons l'image à la seule partie pertinente :
   • Assurez-vous que vous avez la forme de sélection rectangulaire sélectionnée.
     
   • Ensuite, utilisez cette sélection rectangulaire pour dessiner une boîte autour de la zone que vous voulez inclure...
     
     ... puis, cliquez sur Rogner.
     
6. Utilisez des légendes rouges pour surligner des choses (comme ce que devrait cliquer les gens) dans la capture d'écran.
   
7. Quand vous avez fini de recadrer et surligner, redimensionnez l'image à moins de 650 pixels de largeur afin qu'elle s'adapte correctement à la page.
   
8. Finalement, enregistrez votre image en PNG afin que vous puissiez l'envoyer dans la galerie de médias.
   

Créer des captures d'écran Mac

Ces instructions sont pour Mac OS 10.7 Lion et l'application Preview.

1. D'abord, faites un contrôle-clic sur votre bureau, choisissez Changer l'arrière-plan du bureau... et mettez un arrière-plan blanc.
   
2. Ensuite, reproduisez la situation dans laquelle vous voulez capturer l'écran. Quand vous avez obtenu ce que vous vouliez, appuyez sur Commande + 3 sur votre clavier. Une capture d'écran sera placée sur votre bureau.
3. Allez sur votre bureau, double-cliquez sur la capture d'écran pour qu'elle s'ouvre dans l'application Preview.
4. Maintenant, recadrons l'image à la seule partie pertinente :
   • Utilisez la sélection rectangulaire pour dessiner une boîte autour de la zone que vous voulez inclure...
   • ... puis allez au menu Outils et sélectionnez Rogner.
     
5. Utilisez des légendes rouges pour surligner des choses (comme ce que devrait cliquer les gens) dans la capture d'écran.
   
6. Quand vous avez fini de recadrer et surligner, redimensionnez l'image à moins de 650 pixels de largeur afin qu'elle s'adapte correctement à la page.
   
7. Finalement, enregistrez votre image en PNG afin que vous puissiez l'envoyer dans la galerie de médias.
   

Créer des captures d'écran Linux

Ces instructions sont pour Ubuntu Linux avec l'interface Unity

1. D'abord, faites un contrôle-clic sur votre bureau, choisissez Changer l'arrière-plan du bureau et mettez un arrière-plan blanc.
2. Ensuite, reproduisez la situation dans laquelle vous voulez capturer l'écran.
3. Recherchez "Screenshot" et ouvrez l'application Take Screenshot.
   
4. Si vous avez défini le délai à quelque chose comme 5 secondes, vous devrez attendre suffisamment longtemps pour ouvrir un menu ou positionner votre pointeur au-dessus de l'endroit que vous souhaitez surligner.
   
5. Enregistrez l'image sur votre bureau (défaut).
6. Allez sur votre bureau, double-cliquez sur la capture d'écran pour qu'elle s'ouvre dans l'application Image Viewer.
7. Cliquez sur le bouton Modifier l'image pour ouvrir l'image dans une autre application où vous pouvez la recadrer.
   
8. Cliquez sur Rogner et ajustez la boîte autour de la zone que vous voulez garder. Ensuite, cliquez sur OK pour recadrer l'image.
   
9. Finalement, fermez l'image et confirmez que vous voulez l'enregistrer.
   • Malheureusement, les outils intégrés n'ont aucune option pour ajouter des annotations ou redimensionner les images. Mais bon, c'est Linux, donc il y a des tonnes de logiciels gratuits que vous pouvez télécharger pour faire cela.

Ajouter des captures d'écran aux articles

1. Quand vous êtes en train de modifier un article, il suffit de cliquer sur le bouton Image sur la barre d'outils.
   
2. La boîte de dialogue d'insertion de média s'ouvre. Cliquez sur le lien Envoyer un média en bas de la boîte de dialogue.
   
3. Un nouvel onglet s'ouvre avec la boîte de dialogue d'envoi. Après avoir envoyé votre capture d'écran, vous pouvez fermer cet onglet et retourner à l'article.
   Note aux localisateurs : Assurez-vous de choisir votre langue depuis le menu déroulant dans la boîte de dialogue d'envoi afin que nous gardions les captures d'écran organisées.
4. Placez votre curseur où vous voulez insérer l'image et cliquez de nouveau sur le bouton Image.
5. Sélectionnez l'image que vous venez juste d'envoyer et cliquez sur Insérer un média en bas de la boîte de dialogue.
   
   • L'image sera insérée avec la balise : [[Image:title]]
   • Comme nous ajoutons habituellement une image à la fin d'une ligne de texte, vous devrez inclure une balise <br> (retour à la ligne) avant elle, transformant la syntaxe en : <br>[[Image:title]]

Captures d'écran et taille de fichier

Nous faisons deux choses pour limiter la quantité de données à télécharger lors de la visite d'un article de la base de connaissances :

• Nous compressons automatiquement toutes les images afin que chaque fichier soit petit.
• Nous ne chargeons les images que pour la plateforme sélectionnée. Ainsi, si vous regardez un article avec Windows, nous ne chargeons que les captures d'écran Windows. Si vous définissez ensuite le paramètre L'article est pour : dans le panneau latéral droit à une autre plateforme (comme Mac OS X), nous chargerons à ce moment là les captures d'écran pour cette plateforme.

Captures d'écran et localisation

Les articles de la base de connaissances sont écrits pour être compréhensibles sans captures d'écran. Les captures d'écran sont un plus qui rend plus facile à comprendre un article, mais ne sont pas une partie requise de l'article. Évidemment, les captures d'écran localisées sont idéales mais, si ce n'est pas possible, c'est parfaitement approprié de supprimer les captures d'écran en anglais.

Devons-nous mettre à jour les captures d'écran pour chaque changement visuel ?

Non ! Nous deviendrions fous si nous le faisions. Par exemple, à un moment, nous avons créés un paquet de captures d'écran de la fenêtre « Options » qui avait le panneau « Sync » en dernier. L'une des dernières choses qui a été faite avant la sortie de Firefox 4 a été d'inverser les panneaux « Sync » et « Avancé » afin qu'ils ressemblent à ceci. Comme l'article était sur les options listées dans la fenêtre et que l'ordre des icônes du haut n'était pas critique, nous n'avons pas changés immédiatement les captures d'écran (elles ont éventuellement été mises à jour quand les options dans ces différents panneaux ont été changées).

Comme toujours, utilisez votre discernement. S'il semble que l'image pour la version précédente de Firefox aidera et ne sera pas trompeuse, alors utilisez-la.

Autres outils de capture d'écran utiles

Windows :

• SnagIt (30 jours d'essai gratuit)
• Irfanview (gratuit)
• Paint .NET (gratuit)
• XNView (gratuit)
• Gadwin PrintScreen (gratuit)

Mac :

• Skitch (gratuit)
• XNView (gratuit)

Linux :

• XNView (gratuit)