Webdoodles

February 27, 2007

Using Jump Menus

Filed under: HTML Form, Javascript, Navigation, Search Engine Friendly — ukmagician @ 10:41 am

Jump menus are a compact way of providing a list of links to the user. You are presented with a dropdown list where the items listed behave as links, you click on them and off you go to a new page.

These lists are often presented as ‘Quick Links’ to highlight important pages in a site or as ‘Site Navigation’ but you could present them in many other ways. On Gifford Plumbing Services (my brother’s site) I’ve used them to highlight the areas he covers.

The jump menu uses a HTML select form with a small bit of javascript. Here is the HTML code:


<form name="JumpMenuForm">
<select name="JumpMenu" onchange="MM_jumpMenu('parent',this,0);MM_jumpMenu('parent',this,0)">
<option selected="selected">Select Link...</option>
<option value="Link1">Link 1</option>
<option value="Link2.htm">Link 2</option>
<option value="Link3.htm">Link 3</option>
<option value="Link4.htm">Link 4</option>
<option value="Link5.htm">Link 5</option>
</select>
</form>

And the javascript:

function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}

If you use Dreamweaver, you can easily add the above code by going to Insert > Form > Jump menu. This allows you to add the list items and links and then inserts the HTML code for the form).

Then go to the Behaviours panel and you should see ‘Jump Menu’ listed. Select this, then click on the ‘Add behaviour’ button and select ‘Jump Menu’ from the list. This adds the javascript to the head of your document.

One problem is that I don’t think Jump Menus are search engine friendly – search engines such as Google can’t follow the links. This is not a problem as long as you link to the pages elsewhere in your site, i.e. your site map.

February 14, 2007

Welcome

Filed under: misc — ukmagician @ 12:29 pm

This is an occasional blog about my dabblings into web design.

I’m a bit of a jack of all trades, a gleaner of skills and I’ve taught myself web-design, and some programming, in the process of designing my main site dangifford.com.

Yes, that’s me in the cheesy picture and I’m a magician.

I’ve also designed a few other sites and blogs – more on those later. This one is for me to record and share my ideas, thoughts and the useful web design resources I find in my travels.

Blog at WordPress.com.