How To: July 2007

So You Want To Embed A Video, Huh?

By Joe Burns
( All credit to the owner Goddies )

...use these to jump around or read it all
[What I Found Out]
[Embedding For Smart People]
[So Let's See It] [The Problems I Ran Into]
[So What? I Want To Embed A Video!]
I work at this university, right? I'm a professor. Well, one day, the guy who's in charge of putting on big dinners for those who are good friends of the school calls me. "There's a big to-do going on in about a month", he says. "Can you do something on the Internet?"
I thought he meant some kind of explanation so I said yes. Later that month he explained further that he wanted me to show up at the dinner, take photos, scan, and write HTML pages of the dinner...while the dinner was going on. He set up two huge screens so everyone could see me typing away.
This is rough enough, but then me and my big mouth have to start showing off the new digital video editor. This guy is impressed and calls over the head of the school itself so I can make a video of him welcoming viewers to the dinner's web site.
I do, and everyone's happy right? Wrong. Here's what happens next...

"You know Joe," he says patting his chin. "It would be great if you could get that video to play when someone first logs into the page."

You mean embed the video?

"If that's what it's called."

I've never embedded a video before. I don't know that it'll work.

"Well," sounding more like "welp" as he patted my shoulder. "Dinner starts in an hour. Now's the time to find out."

--------------------------------------------------------------------------------

What I Found Out
No, there is no video embedded on this page. That comes later. I'll offer a link to a specific example.

In case you're wondering, the story has a boring ending. I found out that you can indeed embed a video and dinner went off without a hitch. Plus I got a free meal out of the deal.

The quick answer as to whether you can embed a video is that yes, you can. The even longer quick answer is that embedding a video follows the same basic format as embedding a sound. Even the same attribute commands, like AUTOSTART and LOOP, all work in a similar fashion.
So that's it. End of tutorial. Thanks for coming folks. Tip heavily, drive safely, and goodnight.

You know that's not true as much as I love to hear myself talk. So what I'll do here is try to explain the many pitfalls of embedding a video, and explain how I got mine to run smoothly.

--------------------------------------------------------------------------------

Embedding for Smart People
I just can't call you people "dummies" no matter how hard I want to. Below is a quick rundown of the basic embed commands straight from my other stunning embedding tutorial, So You Want To Embed, Huh?.
The basic embed format looks like this:

Just that will do it. If you put a sound file name in where I have "filename.???", you'll get the sound to play if the user has the plug-in to play the file type.
Now, some of you might be concerned that the embed command doesn't work in Internet Explorer. Well, when I did my video embed...it worked. Go figure. But just to be safe, you may want to add the command just to be on the safe side.

Inside the main EMBED command, you have the ability to place a bunch of different attributes or sub-commands. They are as follows:

HEIGHT="--" and WIDTH="--" This sets the height and width of the space in which the embedded item will play. With a sound, this mattered little. You could have set it to 1X1 and you'd have still heard the sound. Now we're dealing with video and it matters.

LOOP="--" This states if the video will play again and again ("true") or if it should play once and stop ("false" or no use of the LOOP command.)

HIDDEN="--" This will work to hide the control panel. The problem is in this case it also hides the video. That's not good. Don't use it.

AUTOSTART="--" This tells the browser to start the video right away ("true") upon its download completion or to wait for viewer clicks to start playing ("false" or no use of the command). Funny thing...this command worked in Internet Explorer, but not in Netscape Navigator. No matter what I set it to, Navigator required me to click on the start button. Go figure again.

--------------------------------------------------------------------------------

So Let's See It
Fair enough. You've read my boring stories. Now you'll see a video embedded just the way I did it during my presentation.

--------------------------------------------------------------------------------

See The Embed In Action

--------------------------------------------------------------------------------

Welcome back! Nifty, huh? A little window for the embedded video. I didn't do that for show either. It was needed. I'll tell you why.

--------------------------------------------------------------------------------

The Problems I Ran Into
Problem One
I first just tried putting the embed commands right on the page that was going to display as "index.html". No dice. No matter where I put the EMBED commands, I always got a little gray box exactly the size of the HEIGHT and WIDTH commands in the EMBED. That was where the movie was going to play.
This never occurred to me. A video must have space on the page to play in. An embedded sound doesn't. Try it. You can put those commands anywhere on the page. You always get a gray box where ever in the code you place it. Even if the EMBED is above the HEAD commands--gray box in the upper left hand corner.

So I solved the problem by putting the embedded video it its own window. By doing that I didn't mess up the formatting of the main page with a gray box, and you got to see the movie. I'll show you the code in a moment.

Problem Two
Size. Videos are huge. The video I took of the guy introducing the page pushed a half meg. That's a three minute download over a 56KPs modem. In Internet terms, that's way too long. It ran great through the presentation because it was coming off of my hard drive. But when I tried to run it from the server, it took forever. I was well past my interest in the home page before it started to play.
But since it's in its own window, a user can just surf and the download can continue without stopping the user.

Problem Three
That video monolith was slowing my surfing down a great deal. As the video was downloading, I was trying to surf. All of these pages were built for speed, but the video download killed the load time of the next page's images.

Problem Four
The viewer's computer might not be configured to run the video. I sent the URL of the page to my father who tried to look. His computer balked and gave him a bunch of messages about not knowing the file type, Internet security, the perils of downloading, and asking him what he should do with the file.
Of course he chose to not accept it even though it as from his son. Stopping short of disowning me, he was sure I was trying to put a virus on his computer. You know, as a joke. And we all know how funny those viruses can be--a real laugh riot.

Problem Five
Format! Which one to use? The three biggies are AVI, MPEG, and Quicktime (mov). If you're an Internet web-head like me, you've configured your computer to play all three. But many people haven't. If you have to pick, I would suggest AVI (Audio Video Interlaced) as all Windows based machines are already set to play the file format. If a lot of Mac's come around, try the Quicktime or the MPEG. Any way you go, you only get one shot at it and you'll miss the mark a few times.

--------------------------------------------------------------------------------

So What?
I Want To Embed A Video!
So I haven't talked you out of it yet, eh? I guess maybe I shouldn't try, because even though it's a lot of trouble, when that embedded video worked it was a real thing of beauty.
Take my advice and try embedding a video directly onto the page. You'll see the gray box, and come right back asking how to get that new window to pop up that will contain the video. So I'll just get right into it.

There are really two ways to get that new window to pop up. The first way, and this is not the way I recommend, is to use a window.open style JavaScript that opens the new window and fills it with a totally new HTML page. That totally new page will contain the embed commands.
You can learn all about opening a new window like that in the tutorial So, You Want To Open A New Window, Huh?.

I like getting my new window using a JavaScript that includes the embed commands right in the script. If you haven't seen this yet, it's a great trick. It's like loading two pages at once. Here's the code I used to get that video embedded. You can copy and paste it right from here. Put it on your page in between the HEAD commands. Just be sure to change out your video's name with my "4secjoe.avi".
Also notice the onLoad command at the very bottom of the paste. That has to go in the BODY command to trigger the JavaScript to fire the new window.

Due to space constraints, some of the document.write lines below broke into two lines. Make a point of getting each on its own line when you paste it to your page.

--------------------------------------------------------------------------------

[Don't copy this]
...and this goes in the BODY Command:
[Don't copy this]

onLoad="openindex()"

--------------------------------------------------------------------------------

You'll need to play with the size of the window until you're happy with its framing of the video.

And That's That...
So now you know how to embed a video. The question is if the perils out-weigh the benefits. Maybe yes, maybe no, but man it looks great if you can get it to work.
So go and give it a shot. See what happens. If you find a new twist to embedding a video, let me know. I might include it here for the entire world to read.

Enjoy!

How To

Sunday, July 22, 2007

how to make a paper helicopter

how to give tuina for the shoulder chinese massage

Saturday, July 21, 2007

How To Build a Mini Spud Gun

Unlock Handcuffs with a Bobby Pin

How To Make a Sound Effect Rumble Machine

How To Trick a Coke Machine

How to Hack a Coke Machine for Change

How to Hack a Coke Machine for Change

How to do shiatsu massage

How to do shiatsu massage

Wednesday, July 18, 2007

Cool Google Search Trick

Monday, July 16, 2007

Tutorial: How to perform a full body massage

How to draw a woman in MS Paint

Fool a Coin Washer to Wash for Free

How to make a match rocket

How to do rocket

How to make an oragami bird

Make your Own Video Wallpaper

How to make your own animated background

How to make a c4d Signature

How to register a domain name

How to recover files from deleted or damaged media

How to rip dvds

How to hide your IP address

How to change your IP address

How to give a full back massage to a fat chick with no ass

How to make thermite

How to make a harmless fake virus

Thursday, July 12, 2007

Embed Video

Blog Archive