Best option to have videos on your site that work with iOS, ipad etc

Hi guys, I wanted to hear your thoughts on what the best option is to have videos on my site usable by as many visitors as possible.
Currently we use flowplayer and FLVs; but users on iOS and ipads can’t view the videos. So l’m looking for some of the best options out there to make sure my videos are viewable by as many users as possible.

Regards,

I’d use H.264/.MPEG4 AVC.

Some further reading (PDF): The H.264/AVC Advanced Video Coding Standard

Get a 3rd party streaming service to handle transcoding a device-specific streaming. Not worth the trouble in doing yourself unless you have tons of video and lots of people to handle said video.

You can use a few things like JW Player and [URL=“http://www.jplayer.org/”]jPlayer.

There are also some handy video conversion tools like Miro Converter.

A h.264 encoded mp4, with baseline profile and level 3 will play on pretty much anything. You can use this sort of file with your existing flowplayer as a direct replacement for the flv, if you embed the flowplayer swf with swfobject, and use the video tag in the swfobject div for alternative content, then pretty much everybody will be able to play the video.

To make media as usable to as many users as possible then IMO it is best to make a player changer. You can either use cookies to remember users choice or you can use live javascript to control your pages.
You can use a method like this http://www.sitepoint.com/forums/showthread.php?871350-Live-Server-Side-HTML-JavaScript-Method which will allow your media to continue playing between page changes by putting the player in to a static area.

You can then change the player using changeScript(“/?live=1&media=wmp”) or changeScript(“/?live=1&media=html5”)
You can change the file by using changeScript(“/?live=1&file=fileurl”)
Or you can change both by using changeScript(“/?live=1&media=html5&file=fileurl”)
Or dynamicaly by using changeScript(“/?live=1&media=”+playerChoice+“&file=”+fileChoice)

You can also use forms to make it work without javascript. That’s what I do on my site :slight_smile:

I use a server-side include for the player, and then reference the same include file direct with my version of livescript - changeScript(“/js/media.asp?live=1&player=wmp&file=1”) (the file number is got from a list in a text file that the website owner can change in the CMS)

You may also wish to consider embracing the horror that Flash is dying
and explore the newer HTML5 <video> tag as the primary method of
delivery with Flash as a ‘Hail Mary’ fallback. Prompt users with older
unsupported browsers to update them, otherwise you end up going
insane catering for die hards using IE6 and Safari 4.0

Except the HTML5 video players suck in general compared with flash players. Most people – even those heavily on the HTML5 bandwagon such as YouTube – still use a flash player as a primary means of delivery.