Developer's manual

Building the navbar list

The first thing to do is build a navbar list, like this:

<ul id="udm" class="udm">
	<li><a href="/">Home</a>
	</li>
	<li><a href="/menu/">About</a>
	</li>
	<li><a href="/contact/">Contact</a>
	</li>
</ul>

There are very few restrictions on the list HTML, but there are some:

<ul> attributes
The root <ul> must have both the id and class name of "udm"; they must be exactly that - class="udm foo bar" is not allowed. Otherwise, no restrictions.
<li> attributes
The id might be needed later on - if you have dynamically created menus, or you use popup menus; the actual id value will be your choice. Otherwise, no restrictions.
<a> attributes
No restrictions.
Other HTML inside the list
You can put any valid HTML inside <a> or betwen <li> and <a>; but you cannot wrap other elements around a menu <ul>, nor put anything between <ul> and <li> (which wouldn't be valid anyway).
Comments
Comments are not allowed anywhere inside the list, because they'll change other node relationships.
Whitespace
The only browser for which whitespace makes any difference at all is the Mac version of Internet Explorer 5. It makes a difference because it can't be removed, or else the rendering becomes unstable. The issue is unlikely to arise if you hand-code your pages, however if your navbar is generated automatically, make sure that some whitespace is included:
  1. a line-break after each </li> and </ul>.
  2. a line-break between the </li> and </a> of each horizontal navbar item - this is purely for the benefit of Mac/IE5.0 on OS9 or earlier, and only necessary if you're using a horizontal navbar; if you have a vertical nav, or you're working for a predictable user base that doesn't include Mac/IE5, then it doesn't matter.

Search

We would like your feedback! Take the UDM4 Survey!

UDM 4 is valid XHTML, and in our judgement, meets the criteria for WAI Triple-A conformance.

-