Monday, 2 November 2009

A couple of HTML tips

This time, just a couple of Web coding tips for valid HTML.

Have you ever wanted to embed a Youtube video on a page AND have it validated? Youtube allow you to specify the size you want etc and then give you the code using the embed tag - so it looks like this:

<object width="480" height="295">
<param name="movie" value="http://www.youtube.com/v/n69yPQGcSJY&hl=en&fs=1&">
</param>
<param name="allowFullScreen" value="true">
</param>
<param name="allowscriptaccess" value="always">
</param>
<embed src="http://www.youtube.com/v/n69yPQGcSJY&hl=en&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="295"></embed></object>

If you're curious, it's Gavin Bate talking about climbing Everest.

Anyway, the code won't validate because you can't use the embed tag. What works is the following:

<object type="application/x-shockwave-flash" style="width:480px; height:295px;" data="http://www.youtube.com/v/n69yPQGcSJY&hl=en&fs=1&rel=0">
<param name="movie" value="http://www.youtube.com/v/n69yPQGcSJY&hl=en&fs=1&rel=0" />
</object>

Notice, that I also added "amp;" to the &s.

My second tip is to do with blob lists inside blob lists, also referred to as nesting bullet points.

You might think that the correct way to code the following:

• Adam
• Eve
  • Cain
  • Abel

Was like this:

<ul>
<li>Adam></li>
<li>Eve</li>
<ul>
<li>Cain</li>
<li>Abel</li>
</ul>
</ul>

But that is invalid. It is correctly written as:

<ul>
<li>Adam></li>
<li>Eve
<ul>
<li>Cain</li>
<li>Abel</li>
</ul></li>
</ul>

And just talking about blob lists... You do know that you can control what type of blob you get. For example, code:

<ul type="square">

and you'll get a square blob. You can also use "circle". For ordered lists try lower or upper case Roman ("i" or "I"), and lower or upper case letters "a" or "A").

And if you need a new Web site designed and coded, or if you need your tired old one revamped, please contact me at trevor@itech-ed.com.

And don't forget to complete the Arcati Yearbook user survey at www.arcati.com/usersurvey10.

If you need anything written, contact Trevor Eddolls at iTech-Ed.
Telephone number and street address are shown here.