Embed media without downloading on page load

(Sarah Delfante) #1

We would like to embed media such as audio and video into a page.


We've done this by uploading the media as file assets into matrix and used the embed movie tool in the wysiwyg.



However we want the webpage to load quickly without downloading the media, until the user clicks on the embedded media object. Is this possible?



At present the page takes a long time to load due to the media being downloaded when the page is accessed. Any ways around this?



Thanks,

Sarah

(Avi Miller) #2

Is YouTube/Google Video an option? The Flash-based players they use are designed to do this. The method Matrix uses to embed video essentially uses the browser's built-in video support to play, which does require a download of the media first.
(Sarah Delfante) #3

This isn't my area of expertise - but just to clarify there is no way for the media to be downloaded when the play button is pushed, rather than the page loaded?
(Avi Miller) #4

Not that I know of, but it is also not my area of expertise. :) I know that I have a few clients that are storing their videos on Google Video or YouTube for two reasons: First, they don't have to pay for the bandwidth (which is a primary driver) and second, the user experience is far more seamless.
(Nic Hubbard) #5

This is my area of expertise. First, what kind of media formats are you wanting to embed? Are they quicktime? If so, the best idea is to create a "poster frame", which is like a place holder on the page, and when the user clicks on the poster frame, then the media will load. Here is some great info on this: http://multimedia.journalism.berkeley.edu/tutorials/webdesign/elements/embedding/. Also, you could just have a link to open the media in a new window, would let the user choose if they want to load the media.

Hope some of these ideas help.
(Adam Fisher) #6

We’ve used this on the Premier’s site in Tasmania (http://www.premier.tas.gov.a) and it’s something I’ve used outside of Matrix extensively on my personal site.



To make that work, we use a few components…



Firstly, a freely available flash player from the internet to do most of the work. This does the same thing as the video player in Youtube or wherever. The one we have used is available at:

http://www.premier.tas.gov.a



Secondly, some way to nicely embed flash into the web page. SWFObject is great but there are others out there. (MooTools V1.2b has a module for this as part of the framework)

(Of course you could just write the HTML out yourself with embed tags and the like, but there are hosts of reasons why it’s probably better to use a JavaScript solution like SWFObject, many of which are listed on their site!)

http://www.premier.tas.gov.a



Thirdly, the actual media you are playing. For videos, you’ll probably want to use flv files, for audio, mp3 is good. If you aren’t sure how to convert your video to flv, try using riva encoder. It’s a nice simple free converter:

http://www.premier.tas.gov.a



To put it all together (much simpler than it sounds!), create the media player on the page via SWFObject (or whatever). It will accept a number of parameters for dimensions, autostart, and the URL to the media you want to play, amongst others. If you get them right, it should work exactly the way you’re after!



Good luck.