From 2a41c9c3d9c4660702c31bb68562958ecb44ee3e Mon Sep 17 00:00:00 2001 From: tristantheb Date: Tue, 25 May 2021 20:47:40 +0200 Subject: L10N: Update the MDN Guideline (important pages only) with Yari and Git/GitHub (#371) * UPDATE: Code guideline page is now up-to-date from the US version * CREATE: Add the general code guildeline page * CREATE: Add the CSS code guideline page * CREATE: Add the HTML code guideline page * FIX: Fix some elements on pages * CREATE: Add the JavaScript code guideline page * Pre-Creaate english version of other Guildelines pages * L10N: Update translation of the Javascript code guildeline page * L10N: Update translation of the Shell code guildeline page * FIX: Add missing class on the Code Guideline * UPDATE: Up-to-date the Feedback page * UPDATE: Up-to-date the Getting started page * L10N: Translate the Github for beginners page * UPDATE: Update indexes of Guideline and Contribute * L10N: Translation of the two Github additional guide pages * L10N: Translation of the Help for beginners page * L10N: Translation of the Localize page * L10N: Translation of the Open_source_etiquette rules * UPDATE: Remove wrong html element and update title for Processes page * L10N: Translation of the Where is everything page * L10N: Important translation of the Documentation priorities page * Meta - Review priority * Meta - Review feedback * Meta - Review Getting started * Review - minor edits * Review - minor typos * Review - few rewordings * Review - minor rewordings * Review - minor lint * Review - Consistency with MDN vs le MDN * Review - update / ko / link ks * Review - minor rewordings * Review - Complement since no subpage * Review - minor typo * Review - rm cssxref * Review - minor fixes * Review - minor fixes * Review - minor fixes * Review - minor fixes * Review - minor fixes * Review - Complete translation of doc * Review - Complete translation * Review - complete translation * Review - complete translation * Review - minor rewording * Review - Complete translation * Review - Localization of style guide in Fr Co-authored-by: julieng --- files/fr/mdn/guidelines/video/index.html | 230 +++++++++++++++++++++++++++++++ 1 file changed, 230 insertions(+) create mode 100644 files/fr/mdn/guidelines/video/index.html (limited to 'files/fr/mdn/guidelines/video') diff --git a/files/fr/mdn/guidelines/video/index.html b/files/fr/mdn/guidelines/video/index.html new file mode 100644 index 0000000000..ec85ceeab3 --- /dev/null +++ b/files/fr/mdn/guidelines/video/index.html @@ -0,0 +1,230 @@ +--- +title: Contenu vidéo sur MDN +slug: MDN/Guidelines/Video +tags: + - Guidelines + - Meta + - Video +translation_of: MDN/Guidelines/Video +--- +
{{MDNSidebar}}
+ +

MDN n'est pas un site contenant beaucoup de vidéos. Toutefois, certaines documentations sont propices à ce type de média. Dans cet article, nous verrons quand inclure des vidéos sur MDN et quelques conseils permettant de créer des vidéos simples et efficaces.

+ +

Quand utiliser des vidéos sur MDN

+ +

L'utilisation de vidéo pour de la documentation technique n'est pas indiquée par défaut pour plusieurs raisons :

+ + + +
+

Note : Il est important de garder ces limitations en tête lorsqu'on réalise des vidéos afin de les minimiser autant que possible.

+
+ +

Il existe de nombreux sites populaires qui fournissent de nombreux tutoriels vidéo. MDN n'est pas un site dont la majorité du contenu est de la vidéo, toutefois, il est possible d'intégrer des vidéos dans certains articles MDN selon le contexte.

+ +

Sur MDN, les vidéos sont particulièrement utilisées lorsqu'on souhaite décrire une suite d'instruction ou un procédé en plusieurs étapes qu'il serait difficile d'exprimer de façon concise avec du texte. Cela s'avère notamment utile lorsqu'on tente de décrire des procédés qui utilisent plusieurs applications ou fenêtres et qui incluent des interactions avec l'interface graphique qui pourraient ne pas être simples à décrire : « maintenant, cliquez sur le bouton situé en haut à gauche et qui ressemble à un canard ».

+ +

Dans de telles situations, il est souvent plus pratique de montrer ce qu'on indique.

+ +

À quoi doit ressembler une vidéo sur MDN ?

+ +

Une vidéo à destination de MDN devrait être :

+ + + +

Pour expliquer quelque chose de complexes, on pourra utiliser un ensemble de vidéos courtes et de captures d'écran avec du texte. Le texte permettra ainsi d'insister sur les notions vues dans les vidéos et la personne qui consulte le contenu pourra alors choisir de suivre le texte et/ou la vidéo.

+ +

De plus, on fera attention aux conseils suivants :

+ + + +

Outils

+ +

Il vous faudra un outil pour enregistrer la vidéo. Il en existe une variété allant d'outils gratuits à payants, de simples à complexes. Si vous avez déjà créé du contenu vidéo : parfait. Sinon, nous vous conseillons de commencer avec un outil simple puis de choisir ensuite quelque chose de plus complexe si besoin.

+ +

Le tableau qui suit fournit quelques recommandations d'outils pour commencer.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OutilSystème d'exploitationCoûtFonctionnalités de post-production ?
Open Broadcaster SoftwaremacOS, Windows, LinuxGratuitOui
CamStudioWindowsGratuitLimitées
CamtasiaWindows, macOSÉlevéOui
QuickTime PlayermacOSGratuitAucune
ScreenFlowmacOSIntermédiaireOui
KazamLinuxGratuitMinimales
+ +

Conseils pour QuickTime

+ +

Si vous utilisez macOS, Quicktime Player est disponible et dispose de quelques fonctionnalités pour l'enregistrement :

+ +
    +
  1. Choisissez Fichier > Nouvel enregistrement d'écran à partir du menu principal.
    2. +
  2. Dans la boîte Enregistrement d'écran, utilisez le bouton d'enregistrement (le bouton rouge).
    3. +
  3. Dessinez un rectangle sur la zone de l'écran que vous souhaitez enregistrer.
    4. +
  4. Appuyez sur le bouton Démarrer l'enregistrement.
    5. +
  5. Effectuez les actions que vous souhaitez enregistrer.
    6. +
  6. Appuyez sur le bouton Stop.
    7. +
  7. Choisissez Fichier > Exporter en tant que… > 1080p à partir du menu principal afin d'avoir une définition suffisamment élevée.
    8. +
+ +

Autres ressources

+ + + +

Étapes de création d'une vidéo

+ +

Les sections qui suivent décrivent les étapes principales à suivre pour créer une vidéo et l'intégrer à une page MDN.

+ +

Préparation

+ +

Tout d'abord, planifiez la suite d'actions que vous souhaitez enregistrer et choisissez les meilleures façons de commencer et de finir.

+ +

Assurez vous que votre arrière-plan de bureau et votre profil de navigateur soient vierges. Planifier les tailles et le positionnement des fenêtres, notamment si vous utilisez plusieurs fenêtres.

+ +

Planifiez soigneusement les étapes que vous allez enregistrer et pratiquez cette séquence d'actions plusieurs fois avant d'enregistrer :

+ + + +
+

Note : Ne zoomez pas au point que les éléments d'interfaces soient déformés ou semblent étranges.

+
+ +

Enregistrement

+ +

Lorsque vous enregistrez, avancez dans les étapes de façon calme et régulière. Effectuez des pauses d'une seconde ou deux aux moments importants (lorsqu'il faut cliquer sur un bouton par exemple) et assurez vous que le pointeur de la souris n'occulte pas d'icône ou de texte important.

+ +

N'oubliez pas de faire une pause d'une ou deux secondes à la fin pour montrer le résultat final de la séquence d'actions.

+ +
+

Note : Si vous utilisez un outil simple comme QuickTime Player ou que vous ne pouvez pas effectuer de post-production, veillez à ce que la taille de la fenêtre soit de la bonne taille pour ce que vous voulez montrer.

+
+ +

Post-production

+ +

En post-production, vous pourrez mettre en avant certains éléments notamment grâce à :

+ + + +

Mettez en avant les moments-clés et les détails difficiles à voir comme les clics sur une icône donnée ou la saisie d'une URL particulière. La mise en avant doit durer au moins 1 à 2 secondes et il sera généralement utile d'ajouter une courte transition (200 à 300 millisecondes) au début et à la fin de la mise en évidence.

+ +

Attention à ne pas abuser de ces effets, on ne veut pas que les spectateurs aient le mal de mer à force de voir des zooms/dézooms.

+ +

Si besoin, redimensionnez la vidéo aux proportions souhaitées.

+ +

Upload

+ +

Actuellement, les vidéos doivent être uploadées sur YouTube afin d'être affichées sur MDN.

+ +
+

Note : Marquez la vidéo en « non répertoriée » si celle-ci n'a pas de sens particulier en dehors du contexte de la page MDN.

+
+ +

Intégration

+ +

Une fois la vidéo uploadée, vous pouvez intégrer la vidéo à la page avec la macro {{TemplateLink("EmbedYouTube")}}. Elle permet d'insérer la vidéo à l'emplacement de la macro :

+ +

\{{EmbedYouTube("you-tube-url-slug")}}

+ +

Cette macro utilise un seul argument qui correspond à la fin de l'URL de la vidéo. Ainsi, pour afficher la vidéo disponible à l'URL https://www.youtube.com/watch?v=ELS2OOUvxIw, on appellera la macro ainsi :

+ +

\{{EmbedYouTube("ELS2OOUvxIw")}}

-- cgit v1.2.3-54-g00ecf