Working DIR and MENU Tag Element Examples

There is one known tag which had managed to disappear even before the disappearence of the TYPE attribute of <A> and the HPn tags, and that was the ordered list (<OL>) tag. Originally introduced as part of a pair of listing types <OL> and <UL>, <OL> increasingly found itself to be the "odd man out" as the other list types, <DL>, <DIR> and <MENU> each came on the scene. Between that, and perhaps (I speculate here) some concerns as to how it might be numbered, and how numbering might be handled in nested lists, etc., <OL> had been already done away with by the time the first documented version of HTML was being prepared in late 1991. But before 1992 was over, they were already looking to bring <OL> back, and by the mid-1993 version it was fully back, and has remained a staple of HTML tags ever since. <UL> and <DL> have similarly remained staples of HTML tags, in their cases from their earliest initial creation onwards, but what of <DIR> and <MENU>?

Modern guides for user agent construction often merely call for <DIR> and <MENU> to be treated the same as <UL>, and even a "suggested HTML-2 stylesheet," contained as an appendix to the Web consortium's Cascading Style Sheets Version 1 documentation, makes no difference at all between <DIR> and <UL>, and differentiates <MENU> only by reducing its left-hand margin to zero, pushing it up against the left-hand side of the screen. In another reference, it was suggested that <DIR> and <MENU> were supposed to omit the bullets for the list items, which would also make sense. A comment however, contained inline in the "suggested HTML-2 stylesheet," does call for "tight formatting," thus providing a clue to the real question raised by these two early lost tags, namely why did they exist in the first place?

Let's Start With <MENU>

With lists, the unordered list is merely a collection of items, with no particular order required, for example a list of ingredients to a cooking recipe. The ordered list correspondingly an itemized list with some sequential content to them, for example the steps to prepare the recipe, once one has gathered all the ingredients named in the unordered list. In this context, the menu was very like the menu handed one when visiting a restaurant. It was probably intended to be used very frequently as a special list of choices to choose from, perhaps with a hyperlink for each entry, and the entries themselves of (on average) a medium length, such that they should always fit on one line. It wasn't so much a matter of looking all that different from an unordered list, but an expression of the fact that the items listed in the MENU were key selectible items in the web page, perhaps with the hope that future development might do something different and special with a menu than merely insert it inline in the text as it does with unordered and ordered lists. So the one menu would stay on the screen at all times to enable a choice of (back to our example) various recipies to display. Let us first see the unremarkable manner in which browsers typically implement <MENU>:

  • Italian Porcupine Meat Balls
  • Philippine Style Chicken Adobo
  • American Sugar Crisp Cookies
  • One can see here that it differs little or not at all from how an unordered list of the same items would be presented, hence the unwarranted feeling that <MENU> is probably just redundant and need not be continued. See here below how the same looks using an unordered list (<UL>):

    Not much difference, no? But see how it would look if implemented as initially hoped for, and which might well have been the case had not other means (which I use here) to achieve the same effect emerged instead as more general solutions to the problem. This here is also my first "Upgrade" example, and a much more realistic portrayal of a true and working <MENU>.

    There is no evidence of this element anywhere in 1991. And even in 1992 one only finds this element (and <DIR> as well) in the various DTD's dating from the oldest in August 1992. I suspect that the NeXT HTML Editor could not generate these elements, but that by this time some other user agents coming into use at that time could support this element by displaying it differently from <UL>. One does not find any actual uses of this element in any of the Web Consortium archives apart from mere demonstrations.

    In HTML 3.2, though there is a <STYLE> element, the means for putting any style information in any tag or of binding it to any tag of any particular class or with any particular id, one could still use the basic <STYLE> section to give descriptions of what styles the individual elements would have, and at least here one could have used this different tag to give certain unordered lists a different appearence from other unordered lists, as for example seen here.

    One other idea that may have been in the works for <MENU> would be that the menu items somehow remain on the screen when selecting other screens from the menu, in a manner somewhat consistent with this. HTML 5 would re-introduce the <MENU> element to have some new features, as can be seen here.

    And Now, <DIR>

    There is no special stylesheet description for <DIR> since it would take more than a stylesheet to create the sort of display that <DIR> was meant to create, namely a multicolumn format that saves verticle space on the screen for long lists of items with short names (typically 20 or less characters). It had always been just "one of those things to get around to sometime" to implement the proper display of this element, but for some reason few if any browser vendors ever did, leaving this element to languish in disuse, it's potential unrealized. See if your browser shows any difference between this <DIR> and this <UL>, starting with <DIR>:

  • 01 Delaware
  • 02 Pennsylvania
  • 03 New Jersey
  • 04 Georgia
  • 05 Connecticut
  • 06 Massachusetts
  • 07 Maryland
  • 08 South Carolina
  • 09 New Hampshire
  • 10 Virginia
  • 11 New York
  • 12 North Carolina
  • 13 Rhode Island
  • 14 Vermont
  • 15 Kentucky
  • And here it is using <UL>:

    Unlike many of the other early elements which were invented on, by, and for the NeXT Editor UNIX opertating system computers (most servers are this way even now) and/or line mode browsers, this element has its basis in a different computer operating environment, namely that of the old MS-DOS. In MS-DOS, the simple command most easily given is the DIR command which lists the files in the current directory. When given the "/W" option however, it would list the file names in a multi column format. Since under MS-DOS all files then had no more than eight letters in their name, the dot, and then an extension of no more than three letters (total 12 letters wide), even the smallest screens could easily show a list of the files present in a several column mode with plenty of space around the names to keep them from being all run together. A typical use of this command in MS-DOS would look like this:

    C:\TC\INCLUDE>DIR /W
     Volume in drive C is New Volume
     Volume Serial Number is A443-1A01
    
     Directory of C:\TC\INCLUDE
    
    [.]          [..]         ALLOC.H      ASSERT.H     BCD.H        BIOS.H
    COMPLEX.H    CONIO.H      CTYPE.H      DIR.H        DOS.H        ERRNO.H
    FCNTL.H      FLOAT.H      FSTREAM.H    GENERIC.H    GRAPHICS.H   IO.H
    IOMANIP.H    IOSTREAM.H   LIMITS.H     LOCALE.H     MATH.H       MEM.H
    PROCESS.H    SETJMP.H     SHARE.H      SIGNAL.H     STAT.H       STDARG.H
    STDDEF.H     STDIO.H      STDIOSTR.H   STDLIB.H     STREAM.H     STRING.H
    STRSTREA.H   [SYS]        TIME.H       TYPES.H      VALUES.H
                  38 File(s)        139,334 bytes
                   3 Dir(s)  45,111,930,880 bytes free
    
    C:\TC\INCLUDE>_
    

    <DIR> may also have provided for some degree of margin offset to enable one to indent non-PRE type text in an HTML file in the early days. At least one file is known to exist from an early period in which <DIR> is plainly being used for only this simplistic purpose. Consistent with this is the fact that <DIR>, unlike <UL>, did not normally use the dots or other bullets of any kind.

    Upgrades and Downgrades

    The only upgrades and downgrades made to these elements has been the gradual addition of a few attributes, none of which are unique to either of these elements.

    Possible downgrades are:

    Possible upgrades are:

    This file, "dirmen.html," is HTML 2.0 Strict Level 1 compliant.
    The CSS 1 Suggested HTML 2 Stylesheet demonstration file "dirmen1.html" is HTML 4.01 Transitional compliant.
    The HTML 3.2 <STYLE> demonstration file "dirmen2.html" is HTML 3.2 compliant.
    The <FRAMESET> demonstration file "dirmen3.html" is HTML 4.01 Frameset compliant.
    The Menu Frame Side demonstration file "dirmenf1.html" is HTML 4.01 Transitional compliant.
    The Menu Default Display demonstration file "dirmenf2.html" is HTML 4.01 Transitional compliant.
    The HTML 3.2 Preformatted and Table <DIR> demonstration file "dirmen4.html" is HTML 3.2 compliant.
    The HTML 5 <MENU> demonstration file "dirmen6.html" is HTML 5 compliant.
    The Proprietary <MULTICOL> demonstration file "dirmen5.html" is not any kind of HTML compliant.
    The Italian Porcupine Meat Balls recipe file "dirmen1a.html" is HTML 2.0 Strict Level 1 compliant.
    The Philippine Style Chicken Adobo recipe file "dirmen1b.html" is HTML 2.0 Strict Level 1 compliant.
    The American Sugar Crisp Cookies recipe file "dirmen1c.html" is HTML 2.0 Strict Level 1 compliant.


    Next Level Up