Vidéos HTML

Vous pouvez facilement insérer une vidéo HTML. Vous pouvez créer votre code et personnaliser l’affichage et les fonctionnalités des vidéos ou importer des vidéos venant du réseaux social YouTube.

Insérer une vidéo HTML

La balise <video> permet d’insérer une vidéo HTML dans le document. En utilisant cette balise, la vidéo s’affiche par défaut avec les boutons de contrôle (play, pause, volume…). Cependant, il est possible de modifier et personnaliser ces boutons à l’aide du Javascript.
Exemple : <video src=“NomDeLaVideo.webm“></video>.

Vous pouvez maintenant ajouter quelques attributs :

  • Poster : il s’agit de l’image à afficher lorsque la vidéo n’est pas lancée. Par défaut, le navigateur prend la première image de la vidéo. A vous de choisir quelle image vous souhaitez y mettre.
  • Controls : pour ajouter les boutons « Lecture », « Pause » et une barre de défilement.
  • Width : pour modifier la largeur de la vidéo.
  • Height : pour modifier la hauteur.
  • Loop : la vidéo sera jouée en boucle.
  • Autoplay : La vidéo se lancera dès que la page sera chargée. A utiliser avec parcimonie.
  • Preload : indique si la vidéo peut être pré-chargée dès le chargement de la page ou non. Il peut avoir comme valeur :
    • Auto (par défaut) : le navigateur décide du mode de chargement
    • Metadata : charge uniquement les métadonnées (durée, dimensions…)
    • None : pas de pré-chargement ;

Intégrer une vidéo YouTube

Rendez-vous sur le site

Allez sur YouTube. Pour intégrer une vidéo YouTube HTML, accédez à la vidéo que vous souhaitez intégrer.

Copiez le lien de la vidéo

Cliquez sur « Partager » en dessous du nom de la vidéo.
Une nouvelle section apparaît. Cliquez sur « Intégrer » dans le menu horizontal de celle-ci.
Une ligne de code s’affiche. Copiez-la.

Insérez le lien dans votre code

Vous pouvez maintenant intégrer une vidéo YouTube HTML dans votre code en collant la ligne de code HTML que vous venez de copier.

Les 5 étapes incontournables pour générer de la croissance sur internet


Exploseo

Guide gratuit pragmatique écrit par des experts du digital.
Découvrez comment Créer, Optimiser et Rentabiliser.