Embedding a video file - best way for accessibility?

bamme

bamme

Senior Member
Hi everyone

I have a video file that i need to embed and play on a button click.. my job is to html-ify and therefore make more accessible this site: http://www.iamsamsmith.com , and I need to replicate what happens on the video page - when you click play, a video..well.. shows up and plays.

I can use a bit of flash if its the most accessible/x-browser friendly way, but i wondered how you guys thought was the best way to embed a video and in what format? Any examples?

Thanks so much!
Emma
 
Personally... id create a private account with youtube.com / vimeo.com and upload it there, save your clients bandwidth, and then provide a closed caption / textual transcript of the dialogue of the movies contents for blind / visual impaired users.
 
Thanks sunburn - esp. for the youtube tip.
I was more wondering how i would code the video/music into the site rather than how to present it to people (would blind people be able to read a transcript?? :p )

The music and the video would need to work similar to the music and video sections on: I Am Sam Smith

Can i do this using javascript, or would it be more x-browser compliant if i used flash?
 
How many clients do you have my dear???? :D
Mmm.....now the best way for accessiblity is to write out the lyrics TBH. Could you not just write them underneath and bring them into the actual design?

If not we could get creative, either link to them with a text link of Read the lyrics to such and such which then opens a pop up, make sure it's web accessible, that thread levi linked to shows you how.

But if I was going to do it I would get more creative TBH.
Now the lyrics are content right?
How many times do you think I have searched for band lyrics, how hard is that depending on the band?

Sometimes very.

I would bring it in via AJAX TBH as discussed in another thread, but code the whole thing as XHTML first, and then for the page make it like this ~

<h1>[Band name]'s ~ [Song name]</h1>
<video></video>
<h2>[Song name] lyrics</h2>
<p>
[Lyrics go in here]
</p>

Then via JavaScript hide the lyrics and add a link dynamically below the video, once the link is clicked fade the lyrics and h2 in. That way if JavaScript is off it works, disabled ppl can read them, it's indexable which means I can search for them as well. Win, win and everyone's happy.

Key:
Blue ~ XHTML
 
hiya jaz,
quite a few :) im only good at little projects which work okay and look a bit nice, and design/coding isnt my fulltime job at the moment, so i volunteer too and practice :)

im re-doing this flash site in html format, and am actually looking to feature the ability to listen to the mp3 files, something like the music section of iamsamsmith.com - with the button graphic and (i do hope even if just for my own ears..)potentially a pause/stop button.

the same for the video section of iamsamsmith.com

before just grabbing a flash mp3 player from somewhere, i thought - the reason for me html'ing these sites is because flash is not good for SEO, and is not accessible to - well, people who dont have flash.

so i was wondering if theres a better way in terms of accessibility, eg jquery or javascript? or whether a little bit of flash is the best option?

Thanks :)
 
Search engines can index text within flash files now, as long as they are not an image, and I'm not sure how current screen readers handle flash these days, it is hard to check as they cost a fair bit and are not free TBH.

Personally I would create it via HTML, and then if you want create the flash version, but link in the HTML its self to the html version and on the html version to the flash version.

Make the flash version the default version to load up and create it under the a directory named flash, but block it from the search engines by creating a robots.txt file uploading it to your root directory and writing this in it ~

User-agent: *
Disallow: /flash/

That way the search engines wont even bother with that directory.

Test via JavaScript to see if flash is enabled if not load the html version, but still make the html version a clear link on all your pages.

That way if they come off the search engines they get the html version, but have the option to view the flash version, if they type the domain name in they get the flash version from the off, does that make sense?
 
Thanks jaz - Seems the logical way!

I assume when we're talking about html and flash versions we're talking about the video - so the html way of embedding one is simply something like: Embedded Media HTML Generator depending on what format? (Is there a preferred format.. apart from flash swf?)

Test via JavaScript to see if flash is enabled if not load the html version, but still make the html version a clear link on all your pages.
Click to expand...

This is what I've been looking to try to do for the entire site actually! I wanted to find a way to detect whether the viewer had flash, if they did, show the flash site, and if not, show the html site - the nearest i found to what i was looking for as a solution was this:

Macromedia Flash - Using JavaScript to Detect Flash Player: Substituting an image for a FlashPlayer movie on the fly

Because i'm not that familiar with javascript i didnt know if this was outdated, would support a html embedded movie instead of just an image to replace a flash file, let alone whether you could display entirely different versions of a website - does anyone know a good link i can follow a tutorial for?

Im sure, if that can be done, there are better things to do it than that link I found..

Emma x
 
I was talking about the site you linked to as you said you wanted something similar and that site is done in flash TBH.

Point you to a link errr....
I could or I could write something myself for you.
Now I tend not to play around a lot with flash and this will tend to be off the cuff but try this, let me know if you get an error and try it x-browser as well.

<script type="text/javascript">
if (navigator.plugins["Shockwave Flash"]){
window.location='http://www.yoursite.com/flash/flash.html';
}
</script>

Now as far as I can remember that should detect if flash is installed if it is redirect the user to the your flash version, if not load the html version. But you would have to get creative as in if someone clicks the html version and they have JavaScript enabled and flash installed they would get redirected back to the flash version.

To do that add a variable and test for it and set a cookie and test for that as well, so something like ~
<a href="htmlversion?html=yes">Our HTML version</a>

<?php
$html=$_GET['html'];
if(!empty($html) && $html=="yes" || isset($_COOKIE['html'])){
if(!isset($_COOKIE['html']){
setcookie("html","yes");
}
?>
<script type="text/javascript">
if (navigator.plugins["Shockwave Flash"]){
window.location='http://www.yoursite.com/flash/flash.html';
}
</script>
<?php }?>

That way ppl with out flash installed, the search engines and ppl who chose the html version will get the html version, everyone else gets the flash version.

Now make the JavaScript file external and thus cache-able, place it in a js directory and then create a blank text file call it robots.txt and in there place this ~

User-agent: *
Disallow: /js/

Then upload it to your root directory.
That way the search engines will ignore it.

Now a word to the wise make sure the html version is exact and the only thing different is the animation otherwise you may get penalized for cloaking if it does not.

Jaz

Key:
Red ~ JavaScript
Dark green ~ PHP
Dark red ~ Robots.txt
Sienna ~ XHTML
 
Hi Jaz

Thanks very much! Okay.. so you place:

<?php
$html=$_GET['html'];
if(!empty($html) && $html=="yes" || isset($_COOKIE['html'])){
if(!isset($_COOKIE['html']){
setcookie("html","yes");
}
?>
<script type="text/javascript">
if (navigator.plugins["Shockwave Flash"]){
window.location='http://www.yoursite.com/flash/flash.html';
}
</script>
<?php }?>

Into the head of your page, and then:

<a href="htmlversion?html=yes">Our HTML version</a>

Somewhere in the body wherever you want the link to be?

And the copy is pretty different, they didnt bother with much for the flash site - how would google know? I suppose to a robot it would never look the same.. theres lotsa code in the html one whilst just an embed tag in the flash one..

Emma x

 
thanks sunburn, briefly read thru the documentation for it - i dont quite understand it to be honest, can I just check: This is for x-browser friendly embedding of Flash files, and to also detect what version of flash player the user has, embed the correct version of the flash file, and if they dont have flash, display other content instead?

I suppose this would be very good if your Flash had an important link or could be replicated with html. And yes, the entire site is replicated in html, so in that way this could be of good use if i couldget my brain around it in simply redirecting the user to the html site or even better (concerns about cloaking etc) display the html content on the same page instead of the flash, avoiding a redirect - (can it do this?)

But my main problem from this thread was embedding a video file - if the user doesnt have flash, what do i embed, and how do i do this. It would be brilliant to have something that'd detect this, and if not display a different format of video.

However, i realised that the other formats are either for Quicktime, windows media player, and Realplayer. If the user has windows, they wont have quicktime. If the user has mac, they wont have WMP, and neither will have RealPlayer automatically installed. (I think i am correct therefore by saying theres a good chance that even if the user doesnt have flash, that they'll have to install something else either way and it'll still be irritating for them.)

So i thought of this very basic simple solution to the problem - embed flash, with a little link underneath to 'view/download .avi, view/download .wav'

If there IS a way of detecting what media player the user has, and displaying content accordingly, then that is amazing and id love to know about it (I cant find anything myself..) and apologies if I'v egot it wrong and that IS what SWFObject can do.

But if not, I thought the only thing i need that could make it smoother is something like the thing jaz just coded, which detects if the user has flash, and if not, directs them to a html version of the entire website. That way, I at least dont need to worry about displaying those download/view other format links on one of the sites.

Criticisms on my solution or corrections v welcome, or a direction to anything thatd help given the above :)
 
The first bit goes in the head, yep, and the link goes on the flash pages and links to the corresponding static page but with the variable in. (?html=yes).

Well if the copy's different thats your choice to make, or inform your client and let them chose, but the search engines, 1 of those being Google, have a large amount of staff who manually review pages anyway and if they check it out and deem it to be you giving 1 page to your site visitor and another to them, this case the static HTML version to them and the flash version to your site visitor and the content of the 2 is different, then you/they will get penalized as a result.

Also if I was hired by a competitor it would be the first thing I would look at TBH.
I would see a flash site so check out their cached versions see the different HTML version then I would contact all 3 submit a spam report and wait a matter of days to see my client move up and yours move down to the 500 position range in the results.

On top of that if ppl come to your site looking for words in the static version and don't see them in the flash version they will just leave and if you have conversion testing on the go that would mess with your results TBH, and give you the wrong results to make your decision on whats working and whats not.

Your choice at the end of the day but what ever technique you use if the 2 versions differ well.....same consequence. :)
 
I understand about getting the copy the same now - didnt know Google had people do this too!

I've implemented the script you wrote for me it works fine, thanks so much, its a keeper! :) Havent yet got to adding the little link with the variable in it, just a quickie about this: do i also add .html to my filename here or leave it off as you did in the example:

<a href="htmlversion?html=yes">
 
The extension depends I have my sever set up so I don't need to add the extensions, but if your pages are .html and your server is not set up like that then place it as ~

html-version.html?html=yes

Yeah leaving it up to a computer program, even 1 as amazing as Google's :rolleyes:, to catch clever programmers would be madness TBH.

I mean that would be like the US military developing some kind of remote controlled drone that can now pick and chose targets at will with out any human interaction what so ever I mean that would be madness especially if they carried new state of the art rockets that can automatically follow their targets even if they change direction at 70mph, or having 1/3 of all their vehicles controlled by computers including their new state of the art land minds. O no wait........:(, well at least the search engines are more intelligent than the US military at least. :D
 
I mean that would be like the US military developing some kind of remote controlled drone that can now pick and chose targets at will with out any human interaction what so ever I mean that would be madness especially if they carried new state of the art rockets that can automatically follow their targets even if they change direction at 70mph, or having 1/3 of all their vehicles controlled by computers including their new state of the art land minds. O no wait........:sad:, well at least the search engines are more intelligent than the US military at least. :D
Click to expand...
Wow.. I didnt know things were THAT automated. What happened to the their good old fashioned methods of real human friendly fire..
 
Yeah they have had drones for ages, I'm kinda a future tech nut, and I was reading a biography of a British Apache attack pilot, named Apache funny enough, and in 06 he was tasked with destroying these Taliban compounds in Afghanistan the next thing that happens is an American drone comes in and he's getting unbelievable information, information to the point of see that house down there a guy will walk out of the door in 5 seconds your have clearance to waste him when he does kinda info, honestly, from someone controlling and piloting the drone from Washington using it's inferred sensors.

But yeah check youtube for us military exoskeletons or something similar, 10 years until they will have their troops in exoskeletons that will be able to take mine strikes with out soldiers losing limbs, bullet proof, makes then 8ft tall and the ability to run through walls, no crap either.

Even their next gen machingun, will be computer operated and the bullets will have minute computer chips in that can be set to ricochet off walls, or they can set the grenade launchers to explode 3 seconds after it enters a room for maximum impact, the Israelis have something similar but theirs in an incendiary shell for their tanks, sites attached to the solider helmet straight from the gun to allow them to snip round corners without showing their body to insurgents.

Who was it, Einstein maybe, that said "Civilization does advance because by each war we event new ways to kill each other", we have been at war in Afghanistan for what 9 years now. With most death tolls coming from mine strikes and moving round built up areas so it makes sense that weapons will be made to fit what the solider of today needs so lower the death count of our troops.

Yeah future tech you think I'm a geek jease don't get me started about future tech.

The new "wheel"chairs probably the best, it's 6ft tall so disabled ppl are at eye height and walks all robotics.
The new CCTV camera's can actually detect when a crime is in progress then by them selves follow the suspect even if they leave the camera for 20 mins get changed and then come back on a camera 20 miles away while alerting the police at the same time.

Police will be getting new non-lethal sound weapons as well that basically parallelize suspects with different sound waves.

However the Russian and Chinese now have SAM systems that can take planes out from hundreds of miles away, and better jets and longer and more effective missiles than the US currently has. And the US have designed a laser weapon, mainly for taking out ICBM's (nukes) before they get into orbit but it's that powerful it can set someone on fire from 10k away and is fitted to a plane, again no crap.

Bare in mind an Apache attack helicopter can see a number plate clear as day from at least 8k away and has been able to for years.

Check out the TV series future weapons on discovery, or view them on either the discovery website or youtube.

As I say 1 mental geek, lol.
 
Wow thats actually really made think! Its not mental hah. I am a bit of a 2012 person.. more environmental based geekiness :p But I saw the film last night and I truly hope im one of the first to go if its that or watching the classic cute little kid be saved heroically by estranged and suddenly super athletic middle aged dad...i love America and all things made there even more after reading your post and watching that! haha
 
O yeah 2012 I was watching a documentary on Nostradamus and his prediction of 2012 and it's really weird and may actually contain some truth, not to the level of the film though sorry sweets your death wish will have to wait. :D

Basically a certain alignment of constellations will actually line up at the end of 2012 and they only do this every 200 thousand years or something and if you go back in the records every time it has happened in the past some major geographical event has actually seriously happened,. ice ages that sort of stuff.

For example if when the stars align it creates a significant gravitational pull it could pull the earth off it's current axis slightly, which would mean that different parts of the world would be closer to the sun and other areas further away. Now take into account most of the grain is grown on latitude 22 or something like that, so across Europe, Russia and the middle of the Untied States, above that it's too cold, Green land, Canada, Siberia, below that it is too hot, Africa, Texas, so if that gets moved even slightly temperatures change in those areas grain doesn't grow and there becomes world wide food shortages.

Countries go to war over oil think what will happen when they have no food.

While other areas then move into the right climate for grain and other foods to grow and those countries then have the advantage over the rest.

But hay I don't eat carbs so I should be fine at least. :D

But it's weird how the Mayans, even though it is slightly different with them, calendar comes to an end, a few other old civilizations calendars actual end in 2012, Nostradamus predicted it and and actual astrological event that only happens once in a blue moon all line up at roughly the same time. You never know. Or it could be like 2000 again when everyone was afraid of the computers not being able to change and nukes exploding, those were great times weren't they. :)
 
just for you two, (jay you probs seen it already) I have been following the development of this....
YouTube - Big Dog ....
and several other prototypes and wouldn't be surprised if we don't see active combat deployment in at least logistical/support type roles very soon.

YouTube - BigDog Dogs Human

and also think of covert --
YouTube - RISE

Main issue at the moment is power supplies, once that is resolved who knows...
 
You must log in or register to reply here.
Back
Top