• Embedding HTML5 video is still pretty hard | And then it crashed
    http://blog.etianen.com/blog/2013/05/19/html5-video-is-hard

    Now you can embed your video using the following code:

    <!DOCTYPE html>
    <html>
       <head>
           <script src="http :// api.html5media.info/1.1.5/html5media.min.js"></script>
       </head>
       <body>
           <video src="video.mp4" width=640 height=360 controls>
               <source src="video.mp4" media="only screen and (min-device-width: 568px)"></source>
               <source src="video-low.mp4" media="only screen and (max-device-width: 568px)"></source>
               <source src="video.webm"></source>
           </video>
       </body>
    </html>

    OMG! What a monster! But now everyone will be able to play your video!

    (...)

    I want to customize the player UI, and make it look consistent across all browsers!

    Ahahahahahahahaha!

    Ahahahaha!

    No.

    #video #html5

    • C’est vrai que c’est pas super simple. Mais c’est toujours mieux que flash... J’ajoute l’article d’Alsacreation :
      Introduction à la balise video de HTML5
      http://www.alsacreations.com/article/lire/1125-introduction-balise-video-html5-mp4-h264-webm-ogg-theora.html

      Au final, on a avec l’exemple donné ci-dessus un système qui permet de lire une vidéo sur iPhone, iPad, Google Chrome, Safari, Firefox 3.5 et supérieurs, Opera 10.50 et supérieurs, et Internet Explorer (6, 7 et 8) via l’alternative Flash. Autrement dit, tous les principaux navigateurs peuvent lire cette vidéo, les plus modernes pouvant en prime la lire nativement via la balise video, cette balise pouvant par ailleurs être stylée via une CSS... comme n’importe quel élément HTML et contrôlée grâce à du JavaScript. L’inconvénient reste bien sûr de devoir prévoir les différents formats adaptés.

    • Mode avocat du diable, vu côté utilisateur :
      – avant, je faisais un flv et j’avais un player identique pour tous. Via flash, c’était mal.
      – maintenant, je fais un mp4, un webm, un deuxième mp4 réduit et j’ai un player différent pour tous. Via html5, c’est bien. Pour les has been, je mets un fallback en flash quand même.

      Alsacréations s’adresse aux codeurs/développeurs, le fait qu’il faille 3 formats est alors un inconvénient. Pour la publication amateur fait maison, c’est rédhibitoire et ça renvoie les utilisateurs vers les graaaandes plateformes de diffusion.

      Oui, je sais que le player et le format flash est une infection.

      Mode farfelu idéaliste, je pense que si on veut un web ouvert et accessible à tous, y compris en vidéo, il est urgent de ne diffuser que en ogv... On laisse Apple et Google remplacer Adobe, on ne sera pas mieux à terme.

    • Non mais tu as raison, c’est galère. Mais en effet, après tout pourquoi pas se limiter au Theora... D’ailleurs Chrome le supporte d’après Alsacreation. C’est Safari et IE qui n’en veulent pas et pour eux on peut toujours le proposer en téléchargement (bien que je ne sais pas si le codec Theora se lit nativement sous MacOS et Windows).

    • @suske utilise des triples backticks pour afficher ton code :
      ``` (lignes de code) ```

      à noter que ce qui suit les trois premiers ticks est ignoré (en markdown+github c’est censé permettre d’indiquer le langage utilisé ; dans seenthis ce n’est pas implémenté).