Create video files
To be compatible to almost any device and os, we will
create three converted versions of the video file using ffmpeg.
a script like this will create them:
#!/bin/bash INPUTFILE="$1" if [ "x" = "x$INPUTFILE" ] ; then echo error: you need to name an input file exit 1 fi OUTPUTFILE="$(basename $INPUTFILE | sed 's/\.[a-z0-9]*$/__converted/g')" echo $OUTPUTFILE echo echo echo now converting to MP4 format... echo avconv \ -threads 4 \ -i "$INPUTFILE" \ -i_qfactor 0.71 \ -qcomp 0.6 \ -qmin 10 \ -qmax 63 \ -qdiff 4 \ -trellis 0 \ -vcodec libx264 \ -s 720x576 \ -b:v 8000k \ -b:a 56k \ -ar 22050 \ "$OUTPUTFILE.mp4" echo echo echo now converting to OGV format... echo avconv \ -i "$INPUTFILE" \ -s 720x576 \ -qmax 63 \ -b:v 8000k \ -b:a 56k \ -ar 22050 \ -acodec libvorbis \ "$OUTPUTFILE.ogv"
Put the video onto your website
Then copy the files to the server and embed a videotag like this:
<video id="sampleMovie" width="640" height="360" preload controls> <source src="/cms/video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> <source src="/cms/video.ogv" type='video/ogg; codecs="theora, vorbis"' /> </video>
Embedded via html5 video tag:
MP4:
OGV:
MP4 + OGV:
Further references:
Very good test page
Article for video conversion
Reference for HTML5 Tags