Re: Comments about the 2002-08-05 XHTML 2.0 WD

Henri Sivonen wrote:
 > Another thing that I've noticed is that (X)HTML doesn't provide any
 > semantic markup for indicating which part of the page are main
 > content and which parts are navigation.

Chris Mannall wrote:
 > In the past, maybe; now there is the nl element [4] (navigation list,
 > or "menu" in other words). If this is insufficient for your needs in
 > some way, I suggest you let the working group know.

Gabriele Fava wrote:
 > The new nl element is intended to be a replacement of javascript to
 > make "dynamic" or "pop-down" menus. What Henri was talking about are
 > the "navbar" which are so often found on the left of webpages,
 > especially at the main page.


I disagree. If you read the description of the nl element[1], you will
find that they are "intended to be used to define collections of
selectable items for presentation in a "navigation" menu."

To my mind, this description covers both the dynamic pop-down menus you
describe and the navigation sidebars common to the web.

It then goes on to describe the "default presentation behavior" of the
nl element and it's children. Note the use of the word "default" - it
can be changed. Indeed, the spec specifically says that "It is possible
to change this default behavior through the use of style sheets."

Consider the following XHTML:

    <nl><name>Top Menu</name>
       <li>First Link</li>
       <li>Second Link</li>
       <li>
          <nl><name>Sub Menu</name>
             <li>First Link of Sub Menu</li>
             <li>Second Link of Sub Menu</li>
          </nl>
       </li>
    </nl>

Combine this with the following CSS:

    nl li { display:none; }
    nl:active li { display:block; }

As far as I'm concerned, this covers (in a very basic manner) the
default presentation described in the specification. At first, only the
top-level navigation list name is rendered, i.e. just "Top Menu". When
the user clicks on this name (i.e. "activates" it, in line with the
description given in the spec), the second CSS rule kicks in, since it
has a higher specificity than the first. Now, the "Top Level" name is
still displayed, but in addition so are the "First Link" and "Second
Link" items and the "Sub Menu" menu name. When "Sub Menu" is clicked,
the two sub-menu links are also displayed.

Admittedly, this stylesheet is very rough... even if browser support for
the :active pseudo-class was sufficient to demonstrate this example, I
very much doubt it would look very nice.

Anyway, to continue... if this were how the default presentation were
implemented, it would be trivial to modify this behaviour so that the
entire menu is always displayed, as is the case with most navigation
sidebars; simply override the second rule so that li items are always
displayed regardless of whether the nl is active or not.

Granted, since there is no normative or even informative stylesheet for
XHTML2 yet, I may be wrong in my interpretation of this. However, given
the behaviour described in the XHTML2.0 spec, combined with the current
state of CSS, this is how I would foresee navigation lists being 
implemented.

There are examples on the web where people have used existing CSS
mechanisms to create dynamic menus without the use of javascript; one
such example is Eric Meyer's demonstration [2]. Note that whether this
works as intended depends on your browser's CSS support. It works with 
the version of Mozilla I'm using (a recent Mozilla 1.1 release 
candidate), but your experience may vary. Internet Explorer, for 
example, doesn't apply the :hover class to anything other than
anchors, and so doesn't display this correctly; it only displays the 
top-level menus (which at least proves that this method downgrades 
gracefully). Indeed, Eric Meyer's site does serve to highlight just how 
far Internet Explorer lags behind Mozilla in terms of CSS support.


- Chris Mannall

[1] http://www.w3.org/TR/2002/WD-xhtml2-20020805/mod-list.html#sec_10.2.
[2] http://www.meyerweb.com/eric/css/edge/menus/demo.html

Received on Thursday, 22 August 2002 06:07:47 UTC