Tutos video HTML5 : lecteur video (balise video) et lecteur audio (balise audio)

Le formateur regart.net nous propose 2 tutoriaux videos pour apprendre à créer un lecteur video en HTML5 et un lecteur audio en HTML5

  • Lecteur video : dans ce tuto de 4 minutes, il utilise la balise HTML 5 <video>
    • L’attribut ‘src’ permet de spécifier la source video à afficher dans la page (ça ressemble à l’attribut de la balise <img> pour ceux qui connaissent déjà le HTML)
      Une des innovations de HTML 5 est la possibilité de spécifier plusieurs sources, afin que le navigateur ait une alternative si il ne reconnait pas un format.
    • L’attribut ‘controls’ permet de gérer l’accès ou non aux contrôles de la vidéo (lecture, pause, volume, timeline, …)
    • L’attribut ‘preload’ permet de forcer le chargement de la vidéo avant que la lecture commence (bufferisation). Attention à ne pas abuser de cet attribut car vous risquez d’avoir des problèmes de bande passante.
      L’équivalent de cet attribut pour Firefox 3.5 et Firefox 3.6 est ‘autobuffer’.
    • L’attribut ‘autoplay’ permet de lancer automatiquement la lecture de la video.
    • L’attribut ‘poster’ permet d’afficher une image par défaut à la place de la video, avant sa lecture.
    • L’attribut ‘loop’ : permet de jouer la video en boucle.
  •  Lecteur audio : dans ce tuto de 8 minutes, il utilise la balise HTML 5 <audio>
    • L’attribut ‘src’ permet de spécifier la source du fichier audio à diffuser dans la page
      Idem, vous avez la possibilité de spécifier plusieurs sources, afin que le navigateur ait une alternative si il ne reconnait pas un format (ex : Firefox qui ne sait pas lire le mp3).
    • L’attribut ‘controls’ permet de gérer l’accès ou non aux contrôles du fichier audio  (lecture, pause, volume, timeline, …). Si elle n’est pas spécifiée, vous pouvez créer vous même les boutons de navigation avec javascript (expliqué dans le tuto)
    • L’attribut ‘autoplay’ permet de lancer automatiquement la lecture du fichier audio.
    • L’attribut ‘loop’ : permet de jouer le fichier en boucle

Miror Video Converter est un  site qui vous permettra de convertir (gratuitement) n’importe quelle video en MP4, WebM (vp8), iPhone, Android, iPod, iPad, etc…

Je vous conseille la lecture de ce livre pour aller plus loin en HTML 5 : 

Post Comment