Embedding video in a web page test.

Laurence wrote on 12/21/2006, 9:51 AM
At the following website, I've encoded and embed the video four different ways: Divx, wmv, Quicktime and Flash 8. In each case I limited the bitrate to 740 mbps for video and 128k for audio:

http://estatevideo.net

My observations are as follows:

DivX pro: At 740mbps this looks the best to me. I can get better results with all three using higher bitrates, but at this streamable rate, IMHO DivX has the edge. Playback accross browsers is consistant.

DivX con: I hate that you have to install the software to view it. Yeah you only have to do it once, but that is enough to keep many people away. At the end of the video it shows an ad for DivX. I'd rather have an ad for my client.

WMV pro: Views without installing software. Looks very good.

WMV con: Launches in an external player in Firefox. I'm not sure about Mac playback.

Quicktime pro: Looks good. Many people have already installed the software when they bought their iPods.

Quicktime con: You can't jump to fullframe. You can't scale the embedded video. It doesn't play at all in Netscape. It loads into external player in Firefox. Not everyone has Quicktime installed.

Flash 8 pro: Looks very good in embed window. You can scale embedded playback consistantly among the browsers. Many people have the latest version of Flash installed. Nobody seems to mind installing it if they don't. Extremely versatile. You can configure like crazy. You can put your own ads at the end, playback chains of videos, add stills, etc.

Flash 8 con: Slightly jerky playback in frame, not as good as DivX blown up fullscreen.

As far as which format is best, so far, I feel that it is a tie between DivX and Flash. With DivX I can double click and view fullscreen and it feels like I am watching a DVD. Flash doesn't give me this quality, but Flash looks about as good in the embedded window and I just LOVE the versatility and I love that a person viewing it doesn't have to install anything.

Comments

Jay Gladwell wrote on 12/21/2006, 9:54 AM

WMV con: Launches in an external player in Firefox. I'm not sure about Mac playback.

If that's the case, then you did not properly "imbed" the video (player) in the page.

[edit]

What on earth have you done to that page? It's huge! It must be a bizillion pixels by a bizillion pixels.


Laurence wrote on 12/21/2006, 10:24 AM
The top graphic is 760x317 pixels. That's the biggest graphic. What do you mean Huge?

I notice the problems with embedding Quicktime and WMV on other pages as well. It's not just my page.
Jay Gladwell wrote on 12/21/2006, 10:30 AM

The horizontal and vertical scroll bars are just dots... When I try to scroll by clicking in the space below the vertical scroll bar, it doesn't move. When I hold down the mouse button, the scroll bar moves like the hour-hand on a clock.

There are no images or video on the page your link takes me to.


Laurence wrote on 12/21/2006, 10:33 AM
Wierd. I authored it with Microsoft Publisher 2003. This scares me. If you are having a problem, there's a good chance other people will as well.

You are going to http://estatevideo.net right?
Jay Gladwell wrote on 12/21/2006, 10:39 AM

Yes, I'm clicking on the link you provided above. It takes me to a page which reads:

Front Entrance to majestic Bella Collina home.

And there is about 20 acres of white to the right of the text and about 20 acres of white below the text.


Laurence wrote on 12/21/2006, 10:52 AM
There are tabs on the left side and bottom that take you to the different formats of embedded video. Are you getting that?
Jay Gladwell wrote on 12/21/2006, 10:58 AM

No graphics are showing up in any way, shape, or form--just the text that I provided.

I did open the page in Front Page 2003 as though I were going to edit it. Only then was I able to see what you had done--everything showed up. However, when I saved the page and then opened it, it looked like the same thing I'm seeing on you site.

I opened the source code... you've got an inordinate amount of code there for such a "simple" page. Nowhere to be found are any references to any of the video files (I only looked for .wmv and .mov). I did find a few references to .jpg files, but they are not to be seen on the page.

If it were mine, I'd scrape it and start from stratch, being very careful about how I built the page.

By the way, what are the files sizes of the various video files you're testing?


Former user wrote on 12/21/2006, 11:03 AM
The page formatting / rendering is okay on my system running IE7, but there are some strange things about the page(s).

I found that your small, jpg images are actually being downloaded as over 2 megs each (then being scaled by IE), when they should be around 50k each (that's why the page loads fairly slow, even over a broadband conection.)

The page is coded so strangely, that you can't right click and image and see it's properties. You just get an indication that it's an HTML page, nothing about the jpg file itself. I was able to look at the jpg files from within my IE cache to determine how big the files actually are that are being downloaded.

Jim
Jay Gladwell wrote on 12/21/2006, 11:08 AM

Another thing I found was you've got your banner graphic as a .png file at 615KB--too big for the Web!

The other large file is a .jpg (of the house front) at almost 2 MB! Way too big for use on a web page.

You need to compress those files considerably!


Laurence wrote on 12/21/2006, 12:18 PM
I'll start compressing those pictures. I thought that Microsoft Publisher was doing that for me. I guess it makes sense that it wouldn't since it is primarily a printed page application. The joys of learning a new skill (web design) ;-(
Jay Gladwell wrote on 12/21/2006, 12:29 PM

You use something like Photoshop to compress the images. I was able to compress your banner, for example, down to 35KB without any loss of quality.


Laurence wrote on 12/21/2006, 12:30 PM
OK, I compressed all the pictures and the website is a fraction of it's previous size. I took a strange shortcut to do this. I just saved the banner and pictures from the site as shown from Firefox since the browser had already rescaled them. I replaced the original graphics with the ones the browser had resized and republished the document. It took all of about two minutes. Hopefully the page should be more manageable now. My Internet service is so fast I hadn't noticed any delay.

The guys I'm doing this for must have pretty quick service too since they hadn't noticed either.

Thanks guys, any other improvements I can do?
Jay Gladwell wrote on 12/21/2006, 12:36 PM

You really need to find out what the original problem was. Oft times the web site designer "sees" the site as being fine because all the original files are on his hard drive. Then, when he uploads everything to the server, it doesn't show up properly because the files are referenced to those on the hard drive, not the server. FrontPage is notorious for doing this!

Sites, for the most part, are designed for the lowest common denominator. Remember, in reality, you're not designing for you or your client, but for your client's potential customers.

This means that based on what I saw, very few, if any, of the potential viewers (customers) will be using either Divx or Flash. You're far better off sticking to Windows Media Player and Quicktime.

If you need any help, feel free to contact me.


Laurence wrote on 12/21/2006, 12:43 PM
All the graphics are on and being referenced from the server. I think I've fixed that problem. I know that the folder on the server is a fraction of the size it was before. I think in my case it was more a matter of the graphics caching off the server to my local drive that kept me from noticing this.
Jay Gladwell wrote on 12/21/2006, 2:16 PM

It might also be an issue with IE7. You'll want to design a page the most popular browsers will view properly, not what YOU think is the best browser.

It's all about the common consumer... even the rich ones!


Laurence wrote on 12/21/2006, 2:37 PM
Yeah, that's why I have been doing all these tests with the different streaming video methods.
Jim H wrote on 12/21/2006, 2:52 PM
Everything seemed to work fine for me here with my Maxthon browser (IE based). Agree with your accessment of the ranking, though I guess I don't have QT running because I got a blank frame there. Flash was jerky, I wonder why? That's what YouTube used right?
DrLumen wrote on 12/21/2006, 7:16 PM
The page loaded fine in Mozilla 1.7.8. I didn't get to all the vids as I don't have all those pluggins - one of your cons.

However, if you are serious about doing web pages get away from anything microsoft for making web pages - they are all garbage. The pages looked fine but the code is atrocious and filled with borg bloat. Especially for no more that is on the pages.

Just my 2¢

intel i-4790k / Asus Z97 Pro / 32GB Crucial RAM / Nvidia GTX 560Ti / 500GB Samsung SSD / 256 GB Samsung SSD / 2-WDC 4TB Black HDD's / 2-WDC 1TB HDD's / 2-HP 23" Monitors / Various MIDI gear, controllers and audio interfaces

Jay Gladwell wrote on 12/21/2006, 8:23 PM

Many "serious" people use FrontPage to create web sites, and to suggest otherwise is equally as "atrocious."


Laurence wrote on 12/21/2006, 8:28 PM
I tried the page using an old 1 gigahertz P3. DivX and WMV playback are smooth as anything but neither Quicktime nor Flash 8 seems useable on that machine.

When playing back flv video, you need to put an swf player on the page to stream the video. Does anyone know if the swf player you use affects flv playback efficiency? I used the one found here, which seems to be a popular one. The coding options are quite nice. I have a feeling that these swf modules are more of a sort of scripting front end than actual playback programs. Is this correct?
Laurence wrote on 12/21/2006, 8:31 PM
My biggest complaint with Microsoft Publisher as used to publish web pages is that I can't make a page center. I can only use the left side justified format. Kind of silly if you ask me. Aside from that, it seems decent. I just bought the Coffee Cup suite and that looks kind of cool, especially for the price.
DrLumen wrote on 12/21/2006, 9:45 PM
If they are using front page, they are not very serious...

Front page is fine if you like bloated, lousy, W3C non-compliant web pages. Only intend to write for IE and plan on using ASP or some other MS proprietary rip-off back-end CGI. Along with not minding about throwing away bandwidth for all that bloat. Simple proof is to look at the source for Laurences' page(s).

<!--[if gte vml 1]><v:group
id="_x0000_s1185" style='position:absolute;left:6pt;top:276pt;width:78pt;
height:151.2pt;z-index:42' coordorigin="106656683,89127328" coordsize="1600200,1920245">
<v:rect id="_x0000_s1186" alt="" style='position:absolute;left:106656683;
top:89127328;width:1600200;height:320040;visibility:hidden;mso-wrap-edited:f;
mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" o:cliptowrap="t">
<v:stroke dashstyle="1 1" endcap="round">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:rect><v:roundrect id="_x0000_s1187" alt="" style='position:absolute;
left:106656683;top:89141044;width:1600200;height:292608;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' arcsize="10923f"
fillcolor="white [7]" strokecolor="black [0]" strokeweight="1.5pt"
o:cliptowrap="t">
<v:fill rotate="t"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:roundrect><v:shape id="_x0000_s1188" type="#_x0000_t202" alt="" style='position:absolute;
left:106679542;top:89150188;width:1554480;height:274320;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" o:cliptowrap="t">
<v:stroke dashstyle="dash">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.76pt' inset="2.88pt,2.88pt,2.88pt,2.88pt">
<div dir=ltr style='padding-top:.87pt'>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'>Home</span></p>
</div>
</v:textbox>
</v:shape><v:roundrect id="_x0000_s1189" alt="" style='position:absolute;
left:106656683;top:89461085;width:1600200;height:292608;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' arcsize="10923f"
fillcolor="white [7]" strokecolor="#a3a37a [2 darken(204)]" strokeweight="1.5pt"
o:cliptowrap="t">
<v:fill rotate="t"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:roundrect><v:shape id="_x0000_s1190" type="#_x0000_t202" alt="" style='position:absolute;
left:106679542;top:89470229;width:1554480;height:274320;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" o:cliptowrap="t">
<v:stroke dashstyle="dash">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.76pt' inset="2.88pt,2.88pt,2.88pt,2.88pt">
<div dir=ltr style='padding-top:.87pt'>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'>Project List</span></p>
</div>
</v:textbox>
</v:shape><v:rect id="_x0000_s1191" alt="" href="index_files/Page684.htm"
style='position:absolute;left:106656683;top:89447369;width:1600200;height:320040;
visibility:visible;mso-wrap-edited:f' filled="f" fillcolor="white [7]"
stroked="f" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:path strokeok="f" fillok="f" insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:rect><v:roundrect id="_x0000_s1192" alt="" style='position:absolute;
left:106656683;top:89781126;width:1600200;height:292608;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' arcsize="10923f"
fillcolor="white [7]" strokecolor="#a3a37a [2 darken(204)]" strokeweight="1.5pt"
o:cliptowrap="t">
<v:fill rotate="t"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:roundrect><v:shape id="_x0000_s1193" type="#_x0000_t202" alt="" style='position:absolute;
left:106679542;top:89790270;width:1554480;height:274320;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" o:cliptowrap="t">
<v:stroke dashstyle="dash">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.76pt' inset="2.88pt,2.88pt,2.88pt,2.88pt">
<div dir=ltr style='padding-top:.87pt'>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'>Video (DivX)</span></p>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'><![if !supportEmptyParas]> <![endif]></span></p>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'><![if !supportEmptyParas]> <![endif]></span></p>
</div>
</v:textbox>
</v:shape><v:rect id="_x0000_s1194" alt="" href="index_files/Page696.htm"
style='position:absolute;left:106656683;top:89767410;width:1600200;height:320040;
visibility:visible;mso-wrap-edited:f' filled="f" fillcolor="white [7]"
stroked="f" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:path strokeok="f" fillok="f" insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:rect><v:roundrect id="_x0000_s1195" alt="" style='position:absolute;
left:106656683;top:90101167;width:1600200;height:292608;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' arcsize="10923f"
fillcolor="white [7]" strokecolor="#a3a37a [2 darken(204)]" strokeweight="1.5pt"
o:cliptowrap="t">
<v:fill rotate="t"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:roundrect><v:shape id="_x0000_s1196" type="#_x0000_t202" alt="" style='position:absolute;
left:106679542;top:90110311;width:1554480;height:274320;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" o:cliptowrap="t">
<v:stroke dashstyle="dash">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.76pt' inset="2.88pt,2.88pt,2.88pt,2.88pt">
<div dir=ltr style='padding-top:.87pt'>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'>Video (wmv)</span></p>
</div>
</v:textbox>
</v:shape><v:rect id="_x0000_s1197" alt="" href="index_files/Page569.htm"
style='position:absolute;left:106656683;top:90087451;width:1600200;height:320040;
visibility:visible;mso-wrap-edited:f' filled="f" fillcolor="white [7]"
stroked="f" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:path strokeok="f" fillok="f" insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:rect><v:roundrect id="_x0000_s1198" alt="" style='position:absolute;
left:106656683;top:90421208;width:1600200;height:292608;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' arcsize="10923f"
fillcolor="white [7]" strokecolor="#a3a37a [2 darken(204)]" strokeweight="1.5pt"
o:cliptowrap="t">
<v:fill rotate="t"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:roundrect><v:shape id="_x0000_s1199" type="#_x0000_t202" alt="" style='position:absolute;
left:106679542;top:90430352;width:1554480;height:274320;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" o:cliptowrap="t">
<v:stroke dashstyle="dash">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.76pt' inset="2.88pt,2.88pt,2.88pt,2.88pt">
<div dir=ltr style='padding-top:.87pt'>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'>Video (QT)</span></p>
</div>
</v:textbox>
</v:shape><v:rect id="_x0000_s1200" alt="" href="index_files/Page366.htm"
style='position:absolute;left:106656683;top:90407492;width:1600200;height:320040;
visibility:visible;mso-wrap-edited:f' filled="f" fillcolor="white [7]"
stroked="f" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:path strokeok="f" fillok="f" insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:rect><v:roundrect id="_x0000_s1201" alt="" style='position:absolute;
left:106656683;top:90741249;width:1600200;height:292608;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' arcsize="10923f"
fillcolor="white [7]" strokecolor="#a3a37a [2 darken(204)]" strokeweight="1.5pt"
o:cliptowrap="t">
<v:fill rotate="t"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>
</v:roundrect><v:shape id="_x0000_s1202" type="#_x0000_t202" alt="" style='position:absolute;
left:106679542;top:90750393;width:1554480;height:274320;visibility:visible;
mso-wrap-edited:f;mso-wrap-distance-left:2.88pt;mso-wrap-distance-top:2.88pt;
mso-wrap-distance-right:2.88pt;mso-wrap-distance-bottom:2.88pt' filled="f"
fillcolor="white [7]" stroked="f" strokecolor="black [0]" o:cliptowrap="t">
<v:stroke dashstyle="dash">
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:shadow color="#ccc [4]"/>
<v:path insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox style='mso-column-margin:5.76pt' inset="2.88pt,2.88pt,2.88pt,2.88pt">
<div dir=ltr style='padding-top:.87pt'>
<p class=MsoNormal style='text-align:center;line-height:113%;text-align:
center'><span style='font-size:8.0pt;line-height:113%;font-family:"Arial Black";
color:black;language:EN'>Video (Flash)</span></p>
</div>
</v:textbox>
</v:shape><v:rect id="_x0000_s1203" alt="" href="index_files/Page404.htm"
style='position:absolute;left:106656683;top:90727533;width:1600200;height:320040;
visibility:visible;mso-wrap-edited:f' filled="f" fillcolor="white [7]"
stroked="f" o:cliptowrap="t">
<v:fill color2="white [7]"/>
<v:stroke>
<o:left v:ext="view" color="black [0]" color2="white [7]"/>
<o:top v:ext="view" color="black [0]" color2="white [7]"/>
<o:right v:ext="view" color="black [0]" color2="white [7]"/>
<o:bottom v:ext="view" color="black [0]" color2="white [7]"/>
<o:column v:ext="view" color="black [0]" color2="white [7]"/>
</v:stroke>
<v:path strokeok="f" fillok="f" insetpenok="f"/>
<o:lock v:ext="edit" shapetype="t"/>
<v:textbox inset="2.88pt,2.88pt,2.88pt,2.88pt"/>


This is just SOME of the page. That's really efficient huh? Front Page may be a little better but not much!

Don't get me wrong Laurence as I'm not trying to flame you - just trying to give some helpful advice. Like I said your page looks fine and I don't fault you for trying. You were doing research on video delivery formats and that's cool and will be helpful.

intel i-4790k / Asus Z97 Pro / 32GB Crucial RAM / Nvidia GTX 560Ti / 500GB Samsung SSD / 256 GB Samsung SSD / 2-WDC 4TB Black HDD's / 2-WDC 1TB HDD's / 2-HP 23" Monitors / Various MIDI gear, controllers and audio interfaces

Laurence wrote on 12/21/2006, 11:26 PM
That IS a lot of code. Wow! All that and I still can't even center a page!
Jay Gladwell wrote on 12/22/2006, 5:44 AM

Then why are the pages on sites I've designed not bloated with extra code?

With all due respect to Laurance, using his page is not an accurate, fair example. He has admitted that he is just learning how to build a web site.