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