Ennen HTML5:n aikaa videoita voitiin esittää vain erikseen asennettavien liitännäisten, bluginien, avulla (esim flash). HTML5 mahdollistaa videon lisäämisen web-sivuille ilman plugineja.
Kun haluat liittää sivulle videon, ei muuta kuin määrität video-elementin sisälle src-määritteen, joka ilmoittaa videotiedoston nimen ja sijainnin, sekä width-määre videon koon määrittämiseen.
HTML5:n tukemat videoformaatit
*.mp4 tai *.mov
eli mp4 (eli Mpeg-4 eli H264) eli mov, alunperin Applen kehittämä säiliömuoto, Quicktime.
*.ogv tai *.ogx
Open Source, jota tuetaan Linux:ssa. Windows ja Mac-käyttäjät voivat asentaa tarvittavan koodekin.
*.webm
Uusi googlen kehittämä vapaa videoformaatti.
*.3gp tai *.3gpp
3GP on formaatti multimedian pakkaukseen. Se on määritelty matkapuhelinten käyttöön.
3GP on yksinkertaistettu versio Mpeg-4-formaatista.
Klikkaa kuva suuremmaksi.
Koodin analyysi:
Controls-attribuutti lisää videon säätöjä, kuten play, pause, volume.
Hyvä idea on lisätä leveys- ja korkeus-attribuutit, width and height. Jos niitä ei ole määritetty, video saattaa räpsyä.
Source-elementti mahdollistaa useiden eri formaattien käytön, selain valitsee ensimmäisen jonka se osaa. Teksti <video> and </video> tagien välissä näkyy vain jos selain ei osaa mitään videoista.
Miltä RasPin web-sivu näyttää:
Kuvassa kaiutin on yliviivattu, koska video ei sisällä ääntä.
Toinen video jossa on myös audio.
Jos kuvan koko on liian suuri, muuta määrityksiä koodissa.
Jos videosi ovat vanhoja ja haluat konvertoida, muuttaa, niiden formaatin uudeksi, tarvitaan video-konvertteri. Sellainen löytyy esimerkiksi: https://video.online-convert.com/convert-to-3gp
Klikkaat Browse.. ja kerrot mistä löytyy (oman koneen polku) konvertoitava tiedosto.
Sitten vaan painat Convert file -nappia. Muunnos (Processing) alkaa ja kestää, kestää...
Kun muunnos on valmis, lataa ja tallenna sen koneeseen ja ota käyttöön.