[html5] List types

[Ian Hickson]

On Fri, 22 Oct 2010, Renatho Rosa wrote:
> 
> But other discussion is "ol" or "ul" for forms. What's more correct?
> Here a example by alistapart with use of "ol":
> http://www.alistapart.com/articles/prettyaccessibleforms/
> 
> In HTML5 spec says: "The ol element represents a list of items, where 
> the items have been intentionally ordered, such that changing the order 
> would change the meaning of the document."
> 
> I think that the correct is use ul, because, for example, in a form with 
> "name" n' "age" if we change the order of fields, the meaning is the 
> same.
> 
> What do you know?

Your interpretation is correct. <ol> would make more sense if the form was 
something like "Enter your selected candidates in the order you prefer to 
have them elected", or something, in which the order matters.


On Sat, 23 Oct 2010, Jukka K. Korpela wrote:
> 
> In practice, the dl element has been used for a wide range of purposes,
> defeating the original idea.

That's true of every HTML element! :-)


> Semantic markup isn't very useful if most pages use elements in a manner 
> that conflicts with the defined semantics. For example, if a search 
> engine treated dd as enclosing a term being defined, for the purposes of 
> searching for definitions (or excluding defining occurrences from 
> results), it would not find many definitions, and it would misclassify 
> things.

That's unfortunately true of every HTML element. It doesn't mean semantics 
are useless, though -- with untrusted content, you just have to apply a 
"trust but verify" model, and with trusted content, you can rely on the 
markup being used as specced to a known extent based on the input.


> HTML 4 reflects this in its watered-down, pretty useless "definition" of 
> dl, first calling it a definition list, then saying that dd gives a 
> _description_ (not definition), and ending this with the messy statement 
> "Another application of DL, for example, is for marking up dialogues, 
> with each DT naming a speaker, and each DD containing his or her words." 
> (Oddly enough, the HTML5 draft explicitly refutes such an idea, beating 
> a dead horse, I would say. If someone has used dl for such a purpose, 
> why should we tell him it's wrong?)

Conformance requirements are about helping authors write markup in a 
consistent way, e.g. to help them make use of the semantics later.


> > Now, in the new specification,
> 
> You misspelled "current draft".

Actually the HTML spec is a living standard, not just a draft, at this 
point. The WHATWG doesn't use a "snapshot" mechanim like the W3C; the spec 
is just continually updated in response to feedback, it's not in a "draft" 
stage at the moment (though individual sections are naturally less stable 
than others -- the less stable sections are marked as such in the margins).


> In practice, the dl element has become a layout tool for certain types of
> data. This can hardly be changed any more.

The same could be said of many HTML elements, like <ol>, <ul>, 
<blockquote>, <table>, etc. I don't think it's especially useful to give 
up on most of the language just because it's been misused. We'll never be 
able to write a language that _isn't_ misused when we have the scale of 
authors that HTML has.


> Markup for definitions would be something completely different. It's a 
> very complicated issue, much more complicated than the new semantic 
> elements that have been proposed in the HTML5 draft, so it should 
> probably wait for HTML 6, or at least HTML5.1.

The HTML spec is no longer versioned; there's just a living HTML spec that 
is continually maintained.


> > In HTML5 spec
> 
> The current W3C draft for HTML5.

This is a WHATWG mailing list, so it's generally assumed that we're 
talking about the WHATWG HTML spec, not the W3C copy. (The W3C copy is a 
strict subset of the normative requirements in the HTML spec.)


> The _dangerous_ idea is the obvious implication, explicitly written out 
> in the HTML5 draft, that in a ul element, the order is _not_ 
> significant.

As you say, it's not an implication, it's the element's standard 
definition.


> This is just absurd. Millions of people have created ul elements without 
> meaning that someone else, or maybe a browser, could arbitrarily reorder 
> the items.

Just because the order isn't material doesn't mean that user agents will 
arbitrarily reorder the items in the list.


On Tue, 26 Oct 2010, Herman Hassel wrote:
> 
> We had the same heated debate a few months ago when it came to lists and 
> forms. We concluded that using any list element to keep the label and 
> input elements apart was redundant (although it does look kinda cool). 
> The list element just didn't provide anything of semantic value to the 
> form. We still needed to group each label and input for styling needs, 
> hence we decided upon using div elements.
> 
> A simplistic example of how we do forms now:
> 
> <form>
> <fieldset>
> <legend>Personal Info</legend>
> <div>
> <label for="full_name">Full Name:</label>
> <input name="full_name" type="text" />
> </div>
> <div>
> <label for="full_address">Full Address</label>
> <input name="full_address" type="text" />
> </div>
> </fieldset>
> <fieldset>
> <legend>Billing</legend>
> <!-- billing: visa, mastercard etc ... separated from personal info by the
> fieldset element -->
> </fieldset>
> <button type="submit" name="save">Hook me up!</button>
> </form>
> 
> We'd be happy to get some feedback on this way of doing forms, if anyone 
> has a better idea when it comes to the semantics.

I'd suggest using <p> rather than <div>, but the above is fine per the 
spec, indeed, except that you need id="" attributes to match the for="" 
attributes (for="" refers to id="", not name="", because the name=""s 
don't have to be unique).


On Tue, 26 Oct 2010, Paul Arzul wrote:
> 
> You can nest the input in the label.
> 
> <legend>Personal Info</legend>
>     <label>Full Name: <input></label>
>     <label>Full Address: <input></label>

Indeed, that's another good way of doing it.

-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'