Dans cette leçon, vous allez apprendre comment ajouter une vidéo HTML5 à une page dans Adobe Dreamweaver. Maintenant, avant de commencer nous devons créer un site pour ce module. Et donc nous allons aller dans le menu de notre site, vers un nouveau site. Nous allons cliquer sur cette icône de dossier ici. Maintenant, j'ai déjà mis le dossier média du module six depuis le dossier des fichiers de cours sur mon bureau pour que je puisse l'utiliser plus facilement. Alors tu vas naviguer où que vous ayez ce dossier. Et nous allons cliquer sur le bouton de sélection de dossier. Je vais l'appeler, module six médias, et nous allons cliquer sur le bouton Enregistrer. Maintenant, si vous n'avez jamais créé de site ou si vous voulez plus d'informations pourquoi nous utilisons les sites en général, vous pouvez retourner au module un à la gestion des sites dans Dreamweaver et apprenez-en un peu plus sur l'utilisation des sites. Depuis notre panneau de fichiers ici à droite, nous allons ouvrir la randonnée en vedette. Maintenant sur cette page, nous avons notre randonnée en vedette et c'est Danforth Falls et ils ont une très belle cascade. Donc, ce que nous voulons faire, c'est que nous ne voulons pas simplement mettre une photo ici mais nous voulons mettre une vidéo ici. Donc, ce que nous allons faire, c'est nous assurer que nous sommes en mode conception et ici à droite, nous allons cliquer là où nous avons notre côté et pour vous assurer que vous êtes au bon endroit, regardez ici notre barre d'état en bas. Et vous pouvez le voir, il dira un article de côté et de droite. Et si tu vois ça, vous savez que vous êtes au bon endroit. Avec HTML dans le passé, nous devions sauter à travers des cerceaux afin de mettre une vidéo sur la page. Mais maintenant, avec HTML5, c'est très facile. Alors on va passer au panneau d'insertion ici sur la droite. Nous allons choisir HTML dans la liste déroulante en haut du panneau. Et nous allons défiler vers le bas vers le bas à la vidéo HTML5. Et on va cliquer dessus. C'est juste la première étape, qui met un espace réservé là-dedans. Mais ici, dans notre panneau de propriétés, c'est là que nous avons toutes les informations dont nous avons besoin pour que cette vidéo fonctionne réellement. Nous allons donc passer au panneau des fichiers, cliquez en arrière sur ce panneau de fichiers. Et la première caractéristique, probablement la plus importante dans ce panneau de propriétés se trouve la source. C'est donc la chose la plus importante que nous devons faire. Donc on va aller dans notre menu média dans nos fichiers. On va ouvrir ça parce que nous allons utiliser ce fichier 0.2, cette petite icône bullseye, juste à droite de la source. Et nous allons cliquer dessus et le faire glisser à notre cascade. En ce moment, parce que nous avons un espace réservé ici, cet espace réservé est assez petit. Et si nous le laissions ainsi, c'est la taille de notre vidéo, qui est plutôt petite. Alors on va descendre dans la largeur et nous allons mettre une largeur de 300 et une hauteur de 500. Et c'est donc là que notre vidéo sera. Lorsque vous avez une vidéo sur la page si nous devions le laisser comme ça, une fois notre page chargée, tout ce que nos téléspectateurs verraient serait une boîte noire. Donc juste en dessous de la source, nous avons la possibilité d'utiliser ce qu'on appelle une affiche. Et une affiche n'est qu'une image de ce que vous pourriez voir une fois que la lecture de la vidéo commencera. Nous allons donc revenir à notre panneau de fichiers. Et cette fois, nous allons ouvrir notre dossier d'images. Nous allons faire défiler vers le bas et pour notre affiche nous allons utiliser ce même point pour déposer. Nous allons cliquer sur cette icône. Nous allons le faire glisser vers cascade.PNG. Voici donc une photographie de cette cascade. Nous voulons avoir un texte de secours. Donc, au cas où quelqu'un ne verrait pas ce qu'est notre vidéo, on peut taper en vidéo des chutes à Danforth Falls au printemps, après une pluie. Alors l'eau fait rage. En bas à gauche, nous avons quelques options différentes. Donc, la première est que nous avons des contrôles, donc nous pouvons choisir si nos téléspectateurs peuvent ou non faire une pause ou lire ou même rejouer cette vidéo. Donc, nous allons laisser les commandes allumées. Vous avez également la possibilité de choisir de le faire jouer automatiquement. Ainsi, dès que la page se charge, la vidéo est lue. Maintenant, voici la chose à ce sujet. Si vous voulez que cette fonctionnalité fonctionne réellement dans un navigateur, certains des navigateurs modernes n'aime pas cette fonction de lecture automatique mais l'un des moyens de contourner le problème est de cliquer sur ce bouton muet. Maintenant, tout ce que nous avons fait, une grande partie de la prévisualisation ce que nous avons fait des pages a été via notre vue en direct. Et si nous allons à notre vue en direct, nous pouvons le voir réfléchir un peu mais ce n'est pas le meilleur endroit pour prévisualiser votre vidéo. Donc on va aller dans le menu fichier pour sauvegarder, et je vais aller sur mon navigateur et je vais faire un contrôle O, je suis sur PC. Si t'es sur Mac, tu vas faire une commande O, et cela nous permettra d'ouvrir un fichier. Et nous devrions naviguer où que nous ayons ce dossier multimédia du module six. Et nous allons double-cliquer sur cette randonnée en vedette pour l'ouvrir. Vous pouvez donc voir que notre vidéo a commencé et notre vidéo est en cours de lecture. Mais l'une des choses que l'avoir en lecture automatique le genre d'emporte est le bruit des chutes. Donc, notre spectateur devrait savoir, tout d'abord, qu'il y a du son. Et deuxièmement, ils auraient besoin de savoir qu'ils peuvent réactiver ce son puis cliquez sur ce bouton de lecture. Alors vous pouvez entendre ce son. Je vais revenir à Dreamweaver. Vous devez donc décider si oui ou non vous voulez que votre vidéo soit lue, qu'elle soit ou non vous voulez qu'il soit lu automatiquement dès le début. Si c'est le cas, avez-vous besoin d'un son ? ou est-il normal qu'il soit en sourdine ? Et allez-vous donner à vos utilisateurs le contrôle sur la lecture et la mise en pause de cette vidéo ? Ainsi, dans cette leçon, vous avez appris à ajouter une vidéo HTML5 à une page dans Adobe Dreamweaver.