I want to post some mp4 videos in my site and I don't want to upload it to youtube or any 3rd party web app which will let me embed it into my website. I also don't want to use any blogging system like wordpress, drupal. So then what is the best way to post it to my site so that most devices will be able to view it. And can I customize the player which I use?
I have seen w3schools html5 video but I didn't find it helpful. I have also seen ' Video onto a website without plugins ' but I am not satisfied with that.
[Hint: I am ready to convert my video into any format required.]
Thanks in advance.
I have used video.js for this purpose, it worked for me. I haven't tried editing it much, but it has options.
http://www.videojs.com
Use the HTML 5 video element. You'll have to upload your video in different formats, since there is no video format that is supported by all browsers, but support for the video element itself is quite good. IE8 doesn't support it, but IE8 is already very old. With the video tag you don't need Javascript or flash plugins.
For an overview of browser support see CanIUse. Another source with much detailed information about video formats and how to convert them is DiveIntoHTML5.info.
Related
As I'm a bit out of tune with web programming I tried to look up what is currently being used in order to display static video files on a web page.
After google showed me either the video tag for PC or some programs for android,... I'm wondering what are really now the current methods to display such videos? Is it JUST the video tag nowadays? Or are there also other methods that are "modern"?
The latest versions of the most popular browsers already support the video tag, so it should be as modern as you expect. The problem here is rather the video format. Each browser supports different formats for different types of operating systems, so this is one thing you should pay attention for. This website should give you a quick view of the current situation.
One more thing I can point you to is the support for older browsers. You should check if user's browser support the video tag and your video's encoding. In case it doesn't -- simply add a fallback to some older technology, such as flash or something else.
I have a OVG video and I would like to put that into my site. I do not know much about that file format so I am concerned how it will be with cross browser compatibility. I know that FF will play the file yet I am unsure about IE (I am only worrying about IE 8+)
What is the best way to put this file into my site? Should I use the HTML 5 <video> tag or should I use another format? I need this to work with IE 8 so I am unsure what the best route is.
Thanks!
You should use video element, with multiple source elements inside, each pointing to a different format of your .ovg file. you can generate cross-browser files at media.io or via Miro converter (download). the best way would be to degrade gracefully for older browsers, you'll want to provide some JavaScript, VideoJS is my preferred lib, you can use their embed builder tool, that'll provide the older fallbacks
For the best compatibility, you'll want to use a video hosting site and embed the Flash video into the site. If you want to host it yourself, you'll have to find a Flash video player that you can use, but I'm pretty sure most or all of those are commercial.
Otherwise you'll need to have both an H264 version (MP4) and an OGG version and include both versions in the source tag. You can then also include a fallback to a Flash embedded version.
You can find out more here.
It looks like the browser on a Blackberry doesn't support either HTML 5 or Flash...
What's the best format to display video in it?
Thanks
BrowserSession is useful to paly video and audio formats in Blackberry.Visit following
links useful for you.
BlackBerry - Play mp4 video from remote server.
If you need information about Browser session the following link might help you.
http://docs.blackberry.com/en/developers/deliverables/11844/Browser_session_management_438294_11.jsp
You would use the object tag e.g.
<object data=FILENAME type=MIMETYPE>
You can see the supported video formats on different phones here (PDF).
Source
Latest version of blackberry (from 6.0). but however it is not that intelligent to play videos efficiently.
Is your application using native code ? If yes, then go for manual player or invoke default browser which has capability to play videos. I have done the same way for you tube videos.
I was wondering how to embed a video on a webpage to have it compatible with mobile devices. I am kinda new to the whole mobileweb. So I set up some testing pages and tried them out with some devices of my friends. Flash is obviously not the way to go. Embed tag neither. html5 video tag neither. I also tried to nest them for fallback compatibility but just didn't get it right.
So I had a look at youtube. They are using rtsp streams and they just let the device handle the rtsp:// links. This seemed to be working everywhere, and I think they do it for a reason. So I had a look at rtsp protocol the possibilities to serve such a stream.
Turned out its really simple and doesn't really differ much from the http protocol. There is e.g. ffserver out there for that.
But every free/os implementation seems to be testing/buggy ...
So I ask you guys. I cant be the first stumbling across this problem.
Isn't there a nice tested way to embed videos with nice compatibility for mobile devices? preferably served from a http source!
looks like html5 is the way to go but important are the correct encoding settings.
h264, baseline 1.3 seems to work fine with iphone4 and android 2.1 ... rest untested.
I've been collection information about mobile compatible video players, you can find it here: http://blog.jsethi.com/media/html5-video-players/
The solution would be to use Kaltura open source platform. If you have have the knowledge to set it up it's the winning solution.
Here is my kaltura running HTML5 with flash fallback. http://cdpn.io/DeKuo
Read more here http://www.kaltura.org/
and here http://html5video.org/
Good Luck !
Our company is making a mobile version of our website. We have several product videos we want to show on the mobile version.
When I try to use
video
I get sound playing but a black screen on my htc incredible android os phone.
I'm thinking that the video is playing but in a different browser window. I need it to display all in one window without having to switch to a different window.
I tried the html embed tags and get no video or sound at all, from what I've read these tags are not very realiable cross browser.
I also just tried the html5 video tags below. I get an icon identifying that it's a video file but it doesn't play.
<video src="video.wmv" controls="controls">
your browser does not support the video tag
</video>
Is there a special format the video file needs to be in? Should I be using the href or embed tags, what other options do I have?
If it helps to know, I'm using the mobile doctype on my webpages.
Thanks
The video format you need to send to the browser varies by browser. Firefox supports Ogg Theora, everybody else seems to support H.264 in an MPEG-4 container (MP4 file.)
See here for an example: http://html5demos.com/two-videos
In any case, WMV won't work.
Android doesn't support the WMV format normally. Here is a list of the supported formats:
http://developer.android.com/guide/appendix/media-formats.html
If iPhone/blackberry/etc don't have a format in common, you may need some javascript magic based on the user-agent to choose which file to embed.
I've found a simple solution to my problem. YouTube. Upload videos on youtube that need to play on your mobile web site and they work. PERIOD.
No fuss! Just copy the embedded URL from the YouTube video page to your mobile page and your all set to go.
I'm not exactly sure how YouTube makes the videos compatible.I'm guessing when uploading the video it's automatically converted into several formats so that the right codec / container is played based on what smart phone is accessing the page.
This list is not extensive and I'll probably think of more later, but comment if you can think of any more advantages or disadvantages of using YouTube for mobile videos.
Advantages:
++ YouTube is universally accepted amongst most major smart phones (therefore your video should play!).
+ If you have limited bandwidth you don't need to worry about wasting any bandwidth of your own.
++ Easy to setup, little to no configuration (setting video resolution). It just works! (encapsulation...)
Disadvantages:
- YouTube symbol during video play back
- It's not hosted on your hosting service. May not be tracked by some analytic services. (requires custom tracking? onclick java-script event?)
- YouTube bandwidth may not be acceptable for smooth replay? (although from initial video viewing bandwidth seems acceptable (minimal buffering...), but not confirmed...). Probably mostly dependent on the cell phone 3g / 4g connection quality.
- limited video file size / resolutions? shouldn't be a problem because you'll want a lower quality video for smart phones.
I would like to know exactly how YouTube make it's videos compatible with smart phones so if necessary I could host the videos myself, but for now this seems to be the best choice.