Imbedding a Device Friendly Video

Do you want to share WYSIWYG Web Builder tips, tricks, tutorials or useful HTML code? You can post it here...
(no questions or problems please, this section is not monitored by support).
Forum rules
This section is to share tips, tricks and tutorials related to WYSIWYG Web Builder.
Please do not post questions or problems here. They will not be answered.

PLEASE READ THE FORUM RULES BEFORE YOU POST:
viewtopic.php?f=12&t=1901
Post Reply
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Imbedding a Device Friendly Video

Post by ColinM »

First of all, great credit to dapson in THIS thread for steering me in the right direction - thanks heaps dapson.

What I haven't been able to get to work - The HTML5 Video I've found that this will work in everything except my HTC One XL mobile device -you can embed the video ok, but a black square with a "play triangle" will be displayed - not ideal.

What I find will work for mobile is using the YouTube object - the down side of course is that you will have to host the vid on YouTube - a very painful creation exercise!
Yours truly
Colin M
Western Australia
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Imbedding a Device Friendly Video

Post by Pablo »

HTML5 video will also work of Apple's IOS Safari browser and Mobile devices as long as you use the right format mp4.
http://www.w3schools.com/html/html5_video.asp
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

Pablo wrote:HTML5 video will also work of Apple's IOS Safari browser and Mobile devices as long as you use the right format mp4.
http://www.w3schools.com/html/html5_video.asp
Thanks Pablo .... I thought I tried that and ended up with a "black square" without display of the initial frame picture - I've just checked this out - using the HTML5 object DOES work fine on IOS Safari - but I still get a "black square" on my HTC One XL Chrome Browser via the 320 viewport - HERE ?
Yours truly
Colin M
Western Australia
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

Original post edited/corrected Pablo :D
Yours truly
Colin M
Western Australia
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Imbedding a Device Friendly Video

Post by Pablo »

In that case you may need to provide an alternative file format for the HTC.
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

Pablo wrote:In that case you may need to provide an alternative file format for the HTC.
Ah - so the HTML5 mobile deployment issue is device specific (another edit to the initial post coming up :D )

Yes - so back to the deployment of the wmv format via the YouTube object - I've converted the MP4 to WMV for YouTube via Windows Movie Maker.

In any case, I'll have to use YouTube (or similar WB compatible streaming/host service) for another video as the required bandwidth/bit rate can't be accommodated by std web server hosting.

All very interesting stuff! :D

...and this means the HTML5 is not guaranteed to work on all mobile devices - I wonder if the YouTube falls into that category?
Yours truly
Colin M
Western Australia
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Imbedding a Device Friendly Video

Post by Pablo »

YouTube converts the video to multiple formats so it works on most devices.
WMV is not a web friendly format, MP4 is supported by most browsers.
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

Pablo wrote:YouTube converts the video to multiple formats so it works on most devices.
WMV is not a web friendly format, MP4 is supported by most browsers.
Hmmm - Wow Pablo, is there anything you are NOT supper knowledgeable on? :lol: I tried MP4 and it was very distorted - the wmv seems to work HERE
Yours truly
Colin M
Western Australia
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Imbedding a Device Friendly Video

Post by Pablo »

WMV only works on windows, not on Mac, Linux, iOS.

See this table:
http://www.w3schools.com/html/html5_video.asp
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

Pablo wrote:WMV only works on windows, not on Mac, Linux, iOS.

See this table:
http://www.w3schools.com/html/html5_video.asp
OK thanks Pablo - works fine on my Apple Ipad - via Safari?
Yours truly
Colin M
Western Australia
User avatar
Pablo
 
Posts: 21578
Joined: Sun Mar 28, 2004 12:00 pm
Location: Europe
Contact:

Re: Imbedding a Device Friendly Video

Post by Pablo »

Yes, YouTube also works on Safari because the video will be converted to mp4 by YouTube.
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

Pablo wrote:Yes, YouTube also works on Safari because the video will be converted to mp4 by YouTube.
Thanks Pablo - that's good to know 8)
Yours truly
Colin M
Western Australia
User avatar
protectourlands
 
 
Posts: 443
Joined: Sat May 24, 2008 2:16 am
Contact:

Re: Imbedding a Device Friendly Video

Post by protectourlands »

Hi Colin

I remember way back when the introduction of the HTML5 video tag was supposed to make embedding videos easier. It did in that it standardized the video displayer for each browser by allowing the browser developers to build their own skin for video displays. Unfortunately the developers refuse to play together and support a format universally, mostly due to licensing fees. So we still have to jump through hoops to get videos to play on all operating systems and browsers by making available multiple formats of the video to accommodate all the possible scenarios. Two steps forward, one step back I guess.
User avatar
Rob
 
 
Posts: 179
Joined: Sun Jan 29, 2012 2:54 pm
Location: MN
Contact:

Re: Imbedding a Device Friendly Video

Post by Rob »

If I may, I think another upside to YouTube, other than the obvious that the very heavy video is hosted on YouTube servers (reduces weight on your own server right?, is that YouTube can also be thought of as another social media channel for seo purposes. Pop in your keywords and it is possible for the video to be found thus perhaps driving traffic back to the website. Possibly? Just thinking out loud.
The Website Guy - MN
Small Business Web Design
User avatar
[RZ]
 
 
Posts: 1914
Joined: Tue Nov 04, 2008 12:08 pm

Re: Imbedding a Device Friendly Video

Post by [RZ] »

@protectourlands
hi, i disagree with you where you said "two steps forward, one step back"
i would say "two steps forward, three steps back"... :)
there are a lot of differences (and call bugs to some of them) across browsers
not only about file formats and licenses, also about the <video> and <audio> implementations by themselves
was a pain (call this a lot of hours invested investigating these bugs/implementations) when i was dealing with these tags (btw i needed to make an extension even for my own use just to solve this "little" thing!)
the tag that should alleviate the hard work (remember? flash 3rd party resources, etc...), but for some unknown reason even a simple thing is complicated...
User avatar
[RZ]
 
 
Posts: 1914
Joined: Tue Nov 04, 2008 12:08 pm

Re: Imbedding a Device Friendly Video

Post by [RZ] »

@rob
a lot of people are still obsessed about seo; however, rest assured, this is something that changes constantly, what you learnt today, tomorrow is obsolete or even worse, never existed :P
as far as i been asking developers/companies, some big boys prefer to have their video clips on their servers, it is seen more "serious" for the company instead of host some of their resources on external/free hosting/services
User avatar
protectourlands
 
 
Posts: 443
Joined: Sat May 24, 2008 2:16 am
Contact:

Re: Imbedding a Device Friendly Video

Post by protectourlands »

No argument here RZ. I was just using the common figure of speech to say what we both believe. I cannot imagine all the time you and other extension developers have to spend to check that your scripts work cross browser/op systems, and all the time spent to write and test fixes when they don't. My hat is off to you.

I agree with you that it looks more professional to show videos from the site server. A good video format converter is an essential tool for posting all the required alternate formats for sure.
User avatar
[RZ]
 
 
Posts: 1914
Joined: Tue Nov 04, 2008 12:08 pm

Re: Imbedding a Device Friendly Video

Post by [RZ] »

@protect
no discussion from my side as well, just a bit humorous side-note :)
User avatar
protectourlands
 
 
Posts: 443
Joined: Sat May 24, 2008 2:16 am
Contact:

Re: Imbedding a Device Friendly Video

Post by protectourlands »

Taken as such RZ. :)
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

Hi Guys - good input - a classic case of all the "differences" on the Internet - from code stds to mobile manufacturers and everything in between.

Rob - Yes I agree - I've often made those points to me Clients - I just wish Microsoft, Google, YouTube would make it less confusing when you set up and configure a channel - including the art work. The other problem is the out of date and simply wrong "bloatformation" (the information equivalent of bloatware :? ) out there on the Internet. When someone posts a blog - or one of them really annoying videos that includes superfluous content- why oh why do they not pull it down or correct it when it becomes out of date. :? :D
Yours truly
Colin M
Western Australia
User avatar
dapson
 
 
Posts: 375
Joined: Tue Jan 26, 2016 4:11 pm
Location: Accra, Ghana
Contact:

Re: Imbedding a Device Friendly Video

Post by dapson »

It looks like a lot has gone down here but i will still go ahead to add mine. :D

@ColinM, i would like to know the format of your video you embedded with html5 video player that gives you an awful results on your htc. I suggest you convert your video to an mp4 format in case it isn't. And i think there shouldn't be a problem with you playing the video on your htc as far as you mentioned using Chrome browser.

Convert your video to a supported html5 video player format and give it a shot again.
User avatar
ColinM
 
 
Posts: 962
Joined: Wed Feb 09, 2011 3:40 am
Location: Western Australia

Re: Imbedding a Device Friendly Video

Post by ColinM »

dapson wrote:It looks like a lot has gone down here but i will still go ahead to add mine. :D

@ColinM, i would like to know the format of your video you embedded with html5 video player that gives you an awful results on your htc. I suggest you convert your video to an mp4 format in case it isn't. And i think there shouldn't be a problem with you playing the video on your htc as far as you mentioned using Chrome browser.

Convert your video to a supported html5 video player format and give it a shot again.
G'day dapson - yes, this thread engaged quite a bit of input - which is good :D

When I get a chance I'll try to replicate that horrible result and see what I can discover.

I agree there shouldn't be a problem with the HTC - I checked if there was any updates pending - and for once there wan't.
Yours truly
Colin M
Western Australia
Post Reply