RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
I think your misunderstanding lies earlier than my last post. If someone wishes to use an abbr tag in the way that it was intended by the spec, then that is perfectly acceptable, obviously. If their scripting then fails in IE they have three clear choices - write a more robust script, change their HTML, or ignore the stupid browser - I think most people would recommend the former, but many people have _chosen_ not to make use of abbr If someone decides to miss-use a fieldset, by exploiting a weakness / loophole in the spec then that is dubious at best. If that then breaks an existing script, I think most people would recommend that the HTML is corrected. My point was, that if even one browser does break, due to the browser following the perceived _intention_ of the spec, then that is a big deal - for this particular instance - and having a few that pass is not entirely relevant. Hi Mike, Thanks for clearing things up :) I think what you call a loophole is where we don't agree. Imho, authors may interpret the specs as much as they want, but browsers should obey DTDs no matter what; hence if the DTD allows the use of fieldset outside of forms, then browsers should deal with it (and not break script). -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Thierry, I think your misunderstanding lies earlier than my last post. If someone wishes to use an abbr tag in the way that it was intended by the spec, then that is perfectly acceptable, obviously. If their scripting then fails in IE they have three clear choices - write a more robust script, change their HTML, or ignore the stupid browser - I think most people would recommend the former, but many people have _chosen_ not to make use of abbr If someone decides to miss-use a fieldset, by exploiting a weakness / loophole in the spec then that is dubious at best. If that then breaks an existing script, I think most people would recommend that the HTML is corrected. My point was, that if even one browser does break, due to the browser following the perceived _intention_ of the spec, then that is a big deal - for this particular instance - and having a few that pass is not entirely relevant. Hope that clears it all up? Mike -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Thierry Koblentz Sent: Friday, May 23, 2008 7:01 PM To: wsg@webstandardsgroup.org Subject: RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup No, its not. In this case, if any single browser breaks a related script, then the mark-up cannot be used - working on the majority is not enough to make it viable. Does that mean we should drop the ABBR element because IE can't handle it properly? In what way is that the same as the (ab)use in question? Hi Mike, This is how I understood your posts in the context of this thread: Jason: you cannot reference a fieldset through DOM unless it is inside a form Hassan: An easy theory to test, and hence, to prove utterly wrong Mike: I am doubtful that you managed to test every browser version known to mankind before you replied - one or two combinations doesn't really make effective proof! Hassan: Au contraire, one is enough to prove the contention wrong Mike: No, its not. In this case, if any single browser breaks a related script, then the mark-up cannot be used To me, it sounds like you're saying that if a script breaks in a browser because of how a particular element behaves in relation to the DOM, then that element should not be used. And this is why I mentioned ABBR since IE lt 7 creates extra nodes that makes most CSS and script fail. Did I misunderstand that last post? -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Thierry Koblentz wrote: Does that mean we should drop the ABBR element because IE can't handle it properly? Julien wrote: You have the answer: http://www.tjkdesign.com/articles/how-to_fix_the_ABBR_element.asp ;) Touché! *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
No, its not. In this case, if any single browser breaks a related script, then the mark-up cannot be used - working on the majority is not enough to make it viable. Does that mean we should drop the ABBR element because IE can't handle it properly? In what way is that the same as the (ab)use in question? Regards, Mike Mike Brockington Web Development Specialist www.calcResult.com www.stephanieBlakey.me.uk www.edinburgh.gov.uk This message does not reflect the opinions of any entity other than the author alone. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
No, its not. In this case, if any single browser breaks a related script, then the mark-up cannot be used - working on the majority is not enough to make it viable. Does that mean we should drop the ABBR element because IE can't handle it properly? In what way is that the same as the (ab)use in question? Hi Mike, This is how I understood your posts in the context of this thread: Jason: you cannot reference a fieldset through DOM unless it is inside a form Hassan: An easy theory to test, and hence, to prove utterly wrong Mike: I am doubtful that you managed to test every browser version known to mankind before you replied - one or two combinations doesn't really make effective proof! Hassan: Au contraire, one is enough to prove the contention wrong Mike: No, its not. In this case, if any single browser breaks a related script, then the mark-up cannot be used To me, it sounds like you're saying that if a script breaks in a browser because of how a particular element behaves in relation to the DOM, then that element should not be used. And this is why I mentioned ABBR since IE lt 7 creates extra nodes that makes most CSS and script fail. Did I misunderstand that last post? -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
On 22 May 2008, at 05:15, Julián Landerreche wrote: I wasn't convinced at first because: - fieldset/legends are used in forms to group controls. This is common usage/practice, and even more, it's the usage recommended by the W3C, as some of you already remarked on this thread, .ç Yes, that is what fieldset is designed for. I wasn't convinced by counter arguments because: - this isn't a CSS/JS issue. In fact, the idea is to have it as structural labels/markup, that will be probably invisible for sighted users. I'm not trying to achieve something fancy, although I have said that fieldset+legend looks fine, and more important, helpful for users when CSS is disabled (browser default CSS) Most of the arguments against it (at least those which haven't been shot down already) were about semantics, not CSS or JS. And also, not convinced because of this other reasoning (hope it's not a fallacy): - if it validates (true) So do layout tables. DTDs can't describe the language in /that/ much detail. Eye halve a spelling chequer It came with my pea sea It plainly marques four my revue Miss steaks eye kin knot sea. and - if the W3C doesn't explicitly says anything about not using fieldset/legend outside forms (¿true?) They don't say you shouldn't use brbr to indicate the start of a new paragraph either. If the spec explicitly listed everything you shouldn't abuse markup for, it would be huge. Tables are an exception due to the widespread abuse they had when the spec was written. then - it could be used to add semantics or meaning in a new way outside forms. If that meaning is These controls should be groups, and here is their caption. Let me add other real-world examples of using/combining HTML elements/attributes to create new semantics, all well known by us: - ul li a = a navigation menu The semantics there are no new. A navigation menu is a list of links. This is just using the right markup for it. - div + abbr + span + predifined classes = microformats (chunks of HTML with added meaning). As Jason stated above: divs are for separating components/sections of a page and can be semantically very strong, especially when given a meaningful class or id name Microformats take some markup that is *correct* for a given pattern of content, add some class names and then document the pattern. Probably, at first, nobody though that by combining an unordered list of items with links could be seen as a navigation. The table of contents on the HTML 4 spec uses lists. So the idea has been around for a long while. In fact, before the Web Standards mindset change, not too many people were doing nav menus that way. No, they were using tables because the liked the way they rendered in browsers. And that's probably my point: trying to add new semantics and better accessibility with current HTML elements. The closest you can come to adding new semantics is agreed sets of class names, which isn't a very good way, but was about the only option open during the days when HTML wasn't being developed. What you are suggesting is taking old semantics and using them even though they don't fit. Fieldsets group controls and their labels. You can't just throw away all but the first two words of that. -- David Dorward http://dorward.me.uk/ http://blog.dorward.me.uk/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Judging by how quickly you replied, I am doubtful that you managed to test every browser version known to mankind before you replied - one or two combinations doesn't really make effective proof! In any case, is this just a case of the browser inserting what it thinks should be there, as with tbody ? Regards, Mike Mike Brockington Web Development Specialist www.calcResult.com www.stephanieBlakey.me.uk www.edinburgh.gov.uk This message does not reflect the opinions of any entity other than the author alone. -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Hassan Schroeder An easy theory to test, and hence, to prove utterly wrong :-) Not that I support the idea of using a fieldset outside a form, but bogus is bogus... -- Hassan Schroeder - [EMAIL PROTECTED] Webtuitive Design === (+1) 408-621-3445 === http://webtuitive.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
[EMAIL PROTECTED] wrote: Judging by how quickly you replied, I am doubtful that you managed to test every browser version known to mankind before you replied - one or two combinations doesn't really make effective proof! Au contraire, one is enough to prove the contention wrong, but in any case, testing FF2, Safari 3, and IE7 provides the same result. Feel free to expand that to your satisfaction :-) In any case, is this just a case of the browser inserting what it thinks should be there, as with tbody ? No. Again, easy enough to test. -- Hassan Schroeder - [EMAIL PROTECTED] Webtuitive Design === (+1) 408-621-3445 === http://webtuitive.com dream. code. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
On 22 May 2008, at 11:12, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: In any case, is this just a case of the browser inserting what it thinks should be there, as with tbody ? With tbody, the DTD says what must be there (and also that the start and end tags for tbody are optional). The DTD allows fieldset pretty much anywhere a block level element is allowed (since forms can contain pretty much any block element, and thus a fieldset needs to be allowed inside them in order to go inside forms properly). -- David Dorward http://dorward.me.uk/ http://blog.dorward.me.uk/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Hassan Schroeder Sent: Thursday, May 22, 2008 2:27 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural mark-up Au contraire, one is enough to prove the contention wrong, No, its not. In this case, if any single browser breaks a related script, then the mark-up cannot be used - working on the majority is not enough to make it viable. Since I believe we both think that the mark-up in question is inadvisable, finding a physical reason to back up the semantics would actually be a good thing. Anyway, thanks for doing two tests that I don't currently have the time for! Regards, Mike *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of [EMAIL PROTECTED] Sent: Thursday, May 22, 2008 8:26 AM To: wsg@webstandardsgroup.org Subject: RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Hassan Schroeder Sent: Thursday, May 22, 2008 2:27 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural mark-up Au contraire, one is enough to prove the contention wrong, No, its not. In this case, if any single browser breaks a related script, then the mark-up cannot be used - working on the majority is not enough to make it viable. Does that mean we should drop the ABBR element because IE can't handle it properly? -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Thierry Koblentz wrote: Does that mean we should drop the ABBR element because IE can't handle it properly? Better to just drop IE ;-) mark *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Thierry Koblentz wrote: Does that mean we should drop the ABBR element because IE can't handle it properly? You have the answer: http://www.tjkdesign.com/articles/how-to_fix_the_ABBR_element.asp ;) *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Hi Julien A little history may help. In the early days of standards-based markup, people were looking for more structural ways to markup content. It was a bit of a wild west and you saw various attempts to replace a table with x, y, or z. Unfortunately, the standards-based developers did not always read the html guidelines, or the documentation was just vague enough to give some flexibility (Ive been rightly blamed for bastardizing my much beloved definition list). So, there were a number of sites that began using fieldsets and legends outside of forms. You may still find documentation talking about how nice it is to work with. Unfortunately, fieldsets and legends are only for forms and you shouldnt use them otherwise. Ive actually been dealing with this recently in the zemanta firefox plugin. This inserts a fieldset with a list of links for adding related content to blog posts. I logged a bug and theyll fix it in a future release. But it just goes to show this is a commonly misused pattern. Go for the header and div. its semantic and the header gives screen readers (and Opera) something to navigate with. Ted Drake Last-child.com _ From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Julián Landerreche Sent: Tuesday, May 20, 2008 9:45 PM To: wsg@webstandardsgroup.org Subject: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup A workmate come with this idea, which then I have searched on web and haven't found too much information about it, but this: [1] and [2]. The idea: using fieldset and legend for adding structural markup/labes [3]. It seems that using fieldsets _outside_ forms doesn't make the code to invalidate. Also, in HTML 4.01, legend is required, but optional in XHTML. Currently, I like the approach of adding structural markup using a heading (hn class=structural) even just a simple strong class=structural, and if necessary, hide them by CSS I borrowed the idea from NetRelations.se and 456bereastreet.com. Example: div id=main-nav strong class=structuralMain navigation/strong !-- or hnMain navigation/hn -- ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /div So, applying fieldset and legend this could be rewritten like this: fieldset id=main-nav legend class=structuralMain navigation/legend ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /fieldset Another example: a list of actions (that are in fact, simple links, so, it's just another navigation) where it could make even more sense. fieldset id=actions legend class=structuralYou can do the following/legend ul liaCreate/a/li liaDelete/a/li liaEdit/a/li /ul /fieldset Putting aside anything related to CSS styling (legends could be difficult to style, but aren't really difficult to hide using display:none; although using position: absolute; left:-px could be better for accesibility, but that positioning method on legends has inconsistencies across browsers): 1. Could there be accessibility issues using fieldset/legend outside a form? 2. Or could this method enhance the accessibility (in fact, structural labels enhance accessibility)? 3. Is there any other research/resource that can add some light on this? Thanks. Julián. [1] http://www.opendesigns.org/forum/discussion/2047/ [2] http://drupal.org/node/233928 [3] http://www.usability.com.au/resources/source-order.cfm *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
So, there were a number of sites that began using fieldsets and legends outside of forms. You may still find documentation talking about how nice it is to work with. Unfortunately, fieldsets and legends are only for forms and you shouldn't use them otherwise. I've actually been dealing with this recently in the zemanta firefox plugin. This inserts a fieldset with a list of links for adding related content to blog posts. I logged a bug and they'll fix it in a future release. But it just goes to show this is a commonly misused pattern. People were also using fieldsets simply because they contain floats -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Hi Julian, One more subtle point here (after taking this discussion into the office with guys that work with me) a point was made today that within DOM fieldset is part of the form hence you cannot reference a fieldset through DOM unless it is inside a form, so it is definitely a wrong approach to use it in that way, especially if you want to do fancy JavaScript stuff with it all. Hope this helps. Regards, Jason www.flexewebs.com On 5/21/08, Thierry Koblentz [EMAIL PROTECTED] wrote: So, there were a number of sites that began using fieldsets and legends outside of forms. You may still find documentation talking about how nice it is to work with. Unfortunately, fieldsets and legends are only for forms and you shouldn't use them otherwise. I've actually been dealing with this recently in the zemanta firefox plugin. This inserts a fieldset with a list of links for adding related content to blog posts. I logged a bug and they'll fix it in a future release. But it just goes to show this is a commonly misused pattern. People were also using fieldsets simply because they contain floats -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Jason Grant wrote: One more subtle point here (after taking this discussion into the office with guys that work with me) a point was made today that within DOM fieldset is part of the form hence you cannot reference a fieldset through DOM unless it is inside a form ... An easy theory to test, and hence, to prove utterly wrong :-) Not that I support the idea of using a fieldset outside a form, but bogus is bogus... -- Hassan Schroeder - [EMAIL PROTECTED] Webtuitive Design === (+1) 408-621-3445 === http://webtuitive.com dream. code. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Although since the beginning I wasn't convinced (that's why I started this thread) about using fieldset/legend for adding structural labels to non-form content (particularly, action links or site nav links), I'm still not convinced by exposed counter arguments against using it. I wasn't convinced at first because: - fieldset/legends are used in forms to group controls. This is common usage/practice, and even more, it's the usage recommended by the W3C, as some of you already remarked on this thread, .ç - couldn't find any research nor articles in favor or against this practice, particularly, when it concerns to possible issues on accessibility. I wasn't convinced by counter arguments because: - this isn't a CSS/JS issue. In fact, the idea is to have it as structural labels/markup, that will be probably invisible for sighted users. I'm not trying to achieve something fancy, although I have said that fieldset+legend looks fine, and more important, *helpful* for users when CSS is disabled (browser default CSS) And also, not convinced because of this other reasoning (hope it's not a fallacy): - if it validates (true) and - if the W3C doesn't explicitly says anything about not using fieldset/legend outside forms (¿true?) then - it could be used to add semantics or meaning in a new way outside forms. Let me add other real-world examples of using/combining HTML elements/attributes to create new semantics, all well known by us: - ul li a = a navigation menu - div + abbr + span + predifined classes = microformats (chunks of HTML with added meaning). As Jason stated above: divs are for separating components/sections of a page and can be semantically very strong, especially when given a meaningful class or id name Probably, at first, nobody though that by combining an unordered list of items with links could be seen as a navigation. In fact, before the Web Standards mindset change, not too many people were doing nav menus that way. And that's probably my point: trying to add new semantics and better accessibility with current HTML elements. Of course, if the fieldset/legend *really* hurts accessibility, print this thread, delete it and burn the printed copy to ashes. @Ted wrote: Go for the header and div. it's semantic and the header gives screen readers (and Opera) something to navigate with. Probably this is the most common way of doing it. But we all know the problems that arise when using headings: it's pretty hard to establish with level of heading should go for different navigational/secondary content on a page. If we think and rethink a webpage as a document, I really doubt that a navigation menu, or a skip to menu, or even the footer deserve a heading. Haven't you ever think that you were mis-using or wasting headings for the sake of semantics? If we take a look to manual/scientific books (a kind of document, probably the parent of a web pages), there are sometimes notes or boxes with little complementary content on the margins of the page. Although most of the times, they are marked up as a heading and a little paragraph, I've seen also some of this side notes as fieldset+legend+content. I'm not trying to say that fieldset/legends could be used to mark side notations of an article on webpages. Again, the primary use I can think is about adding structural labels. Hope someone could do further research regarding usability/accessibility, which is what should decide the benefits or cons of this proposed practice and what could lead us to have better common practices with current set of HTML elements. Thanks. On Wed, May 21, 2008 at 7:53 PM, Jason Grant [EMAIL PROTECTED] wrote: Hi Julian, One more subtle point here (after taking this discussion into the office with guys that work with me) a point was made today that within DOM fieldset is part of the form hence you cannot reference a fieldset through DOM unless it is inside a form, so it is definitely a wrong approach to use it in that way, especially if you want to do fancy JavaScript stuff with it all. Hope this helps. Regards, Jason www.flexewebs.com On 5/21/08, Thierry Koblentz [EMAIL PROTECTED] wrote: So, there were a number of sites that began using fieldsets and legends outside of forms. You may still find documentation talking about how nice it is to work with. Unfortunately, fieldsets and legends are only for forms and you shouldn't use them otherwise. I've actually been dealing with this recently in the zemanta firefox plugin. This inserts a fieldset with a list of links for adding related content to blog posts. I logged a bug and they'll fix it in a future release. But it just goes to show this is a commonly misused pattern. People were also using fieldsets simply because they contain floats -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
[WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
A workmate come with this idea, which then I have searched on web and haven't found too much information about it, but this: [1] and [2]. The idea: using fieldset and legend for adding structural markup/labes [3]. It seems that using fieldsets _outside_ forms doesn't make the code to invalidate. Also, in HTML 4.01, legend is required, but optional in XHTML. Currently, I like the approach of adding structural markup using a heading (h*n* class=structural) even just a simple strong class=structural, and if necessary, hide them by CSS I borrowed the idea from NetRelations.se and 456bereastreet.com. Example: div id=main-nav strong class=structuralMain navigation/strong !-- or h*n*Main navigation/h*n* -- ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /div So, applying fieldset and legend this could be rewritten like this: fieldset id=main-nav legend class=structuralMain navigation/legend ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /fieldset Another example: a list of actions (that are in fact, simple links, so, it's just another navigation) where it could make even more sense. fieldset id=actions legend class=structuralYou can do the following/legend ul liaCreate/a/li liaDelete/a/li liaEdit/a/li /ul /fieldset Putting aside anything related to CSS styling (legends could be difficult to style, but aren't really difficult to hide using display:none; although using position: absolute; left:-px could be better for accesibility, but that positioning method on legends has inconsistencies across browsers): 1. Could there be accessibility issues using fieldset/legend outside a form? 2. Or could this method enhance the accessibility (in fact, structural labels enhance accessibility)? 3. Is there any other research/resource that can add some light on this? Thanks. Julián. [1] http://www.opendesigns.org/forum/discussion/2047/ [2] http://drupal.org/node/233928 [3] http://www.usability.com.au/resources/source-order.cfm *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Hello Julian, If you are unsure about what an HTML tag is there for, look up in the W3C specs. http://www.w3.org/TR/html401/interact/forms.html#edef-FIELDSET It is pretty clear to me there that fieldset element exists for the purpose of grouping form elements together, and not for other purposes. It aids accessibility and overall meaning of (larger) forms. Hence I would strongly argue that fieldset should not be used outside a form and should not be used for purposes of styling for we have CSS. Hope this helps. Regards, Jason www.flexewebs.com www.flexewebs.wordpress.com www.twitter.com/flexewebs www.facebook.com/pages/London/Flexewebs/11264349395 On Tue, May 20, 2008 at 8:44 PM, Julián Landerreche [EMAIL PROTECTED] wrote: A workmate come with this idea, which then I have searched on web and haven't found too much information about it, but this: [1] and [2]. The idea: using fieldset and legend for adding structural markup/labes [3]. It seems that using fieldsets _outside_ forms doesn't make the code to invalidate. Also, in HTML 4.01, legend is required, but optional in XHTML. Currently, I like the approach of adding structural markup using a heading (h*n* class=structural) even just a simple strong class=structural, and if necessary, hide them by CSS I borrowed the idea from NetRelations.se and 456bereastreet.com. Example: div id=main-nav strong class=structuralMain navigation/strong !-- or h*n*Main navigation/h*n* -- ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /div So, applying fieldset and legend this could be rewritten like this: fieldset id=main-nav legend class=structuralMain navigation/legend ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /fieldset Another example: a list of actions (that are in fact, simple links, so, it's just another navigation) where it could make even more sense. fieldset id=actions legend class=structuralYou can do the following/legend ul liaCreate/a/li liaDelete/a/li liaEdit/a/li /ul /fieldset Putting aside anything related to CSS styling (legends could be difficult to style, but aren't really difficult to hide using display:none; although using position: absolute; left:-px could be better for accesibility, but that positioning method on legends has inconsistencies across browsers): 1. Could there be accessibility issues using fieldset/legend outside a form? 2. Or could this method enhance the accessibility (in fact, structural labels enhance accessibility)? 3. Is there any other research/resource that can add some light on this? Thanks. Julián. [1] http://www.opendesigns.org/forum/discussion/2047/ [2] http://drupal.org/node/233928 [3] http://www.usability.com.au/resources/source-order.cfm *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
What if your fieldset is intended for an AJAX application? And thus will not require a form (as your data is not sent through the form, but is picked up by javascript)? Indeed, my opinion is that a fieldset should only contain form elements, but not necessarily be inside a form tag. I do disagree with Julián's approach. Also, if I may add, strong should only be used as an inline element (you cannot really compare hN with strong, headlines are block elements, while strong is inline) and only in a case where you have a strong point to make, and not a replacement for making bold text. Regards, Svip 2008/5/20 Jason Grant [EMAIL PROTECTED]: Hello Julian, If you are unsure about what an HTML tag is there for, look up in the W3C specs. http://www.w3.org/TR/html401/interact/forms.html#edef-FIELDSET It is pretty clear to me there that fieldset element exists for the purpose of grouping form elements together, and not for other purposes. It aids accessibility and overall meaning of (larger) forms. Hence I would strongly argue that fieldset should not be used outside a form and should not be used for purposes of styling for we have CSS. Hope this helps. Regards, Jason www.flexewebs.com www.flexewebs.wordpress.com www.twitter.com/flexewebs www.facebook.com/pages/London/Flexewebs/11264349395 On Tue, May 20, 2008 at 8:44 PM, Julián Landerreche [EMAIL PROTECTED] wrote: A workmate come with this idea, which then I have searched on web and haven't found too much information about it, but this: [1] and [2]. The idea: using fieldset and legend for adding structural markup/labes [3]. It seems that using fieldsets _outside_ forms doesn't make the code to invalidate. Also, in HTML 4.01, legend is required, but optional in XHTML. Currently, I like the approach of adding structural markup using a heading (hn class=structural) even just a simple strong class=structural, and if necessary, hide them by CSS I borrowed the idea from NetRelations.se and 456bereastreet.com. Example: div id=main-nav strong class=structuralMain navigation/strong !-- or hnMain navigation/hn -- ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /div So, applying fieldset and legend this could be rewritten like this: fieldset id=main-nav legend class=structuralMain navigation/legend ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /fieldset Another example: a list of actions (that are in fact, simple links, so, it's just another navigation) where it could make even more sense. fieldset id=actions legend class=structuralYou can do the following/legend ul liaCreate/a/li liaDelete/a/li liaEdit/a/li /ul /fieldset Putting aside anything related to CSS styling (legends could be difficult to style, but aren't really difficult to hide using display:none; although using position: absolute; left:-px could be better for accesibility, but that positioning method on legends has inconsistencies across browsers): 1. Could there be accessibility issues using fieldset/legend outside a form? 2. Or could this method enhance the accessibility (in fact, structural labels enhance accessibility)? 3. Is there any other research/resource that can add some light on this? Thanks. Julián. [1] http://www.opendesigns.org/forum/discussion/2047/ [2] http://drupal.org/node/233928 [3] http://www.usability.com.au/resources/source-order.cfm *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Needless to say that your application should progressively enhancehttp://en.wikipedia.org/wiki/Progressive_Enhancementthrough the presentation layers. So, irrespective of what technology (or mix of technologies) you are using, the basic (X)HTML page should make total sense with everything (images, css, javascript and flash) switched off and nicely 'upgrade' as you add each new piece of technology to it. The basics always stay the same, hence fieldset ought to be inside a form as your page ought to work with JavaScript turned off. Regards, Jason www.flexewebs.com On 5/20/08, Svip [EMAIL PROTECTED] wrote: What if your fieldset is intended for an AJAX application? And thus will not require a form (as your data is not sent through the form, but is picked up by javascript)? Indeed, my opinion is that a fieldset should only contain form elements, but not necessarily be inside a form tag. I do disagree with Julián's approach. Also, if I may add, strong should only be used as an inline element (you cannot really compare hN with strong, headlines are block elements, while strong is inline) and only in a case where you have a strong point to make, and not a replacement for making bold text. Regards, Svip 2008/5/20 Jason Grant [EMAIL PROTECTED]: Hello Julian, If you are unsure about what an HTML tag is there for, look up in the W3C specs. http://www.w3.org/TR/html401/interact/forms.html#edef-FIELDSET It is pretty clear to me there that fieldset element exists for the purpose of grouping form elements together, and not for other purposes. It aids accessibility and overall meaning of (larger) forms. Hence I would strongly argue that fieldset should not be used outside a form and should not be used for purposes of styling for we have CSS. Hope this helps. Regards, Jason www.flexewebs.com www.flexewebs.wordpress.com www.twitter.com/flexewebs www.facebook.com/pages/London/Flexewebs/11264349395 On Tue, May 20, 2008 at 8:44 PM, Julián Landerreche [EMAIL PROTECTED] wrote: A workmate come with this idea, which then I have searched on web and haven't found too much information about it, but this: [1] and [2]. The idea: using fieldset and legend for adding structural markup/labes [3]. It seems that using fieldsets _outside_ forms doesn't make the code to invalidate. Also, in HTML 4.01, legend is required, but optional in XHTML. Currently, I like the approach of adding structural markup using a heading (hn class=structural) even just a simple strong class=structural, and if necessary, hide them by CSS I borrowed the idea from NetRelations.se and 456bereastreet.com. Example: div id=main-nav strong class=structuralMain navigation/strong !-- or hnMain navigation/hn -- ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /div So, applying fieldset and legend this could be rewritten like this: fieldset id=main-nav legend class=structuralMain navigation/legend ul liaSection 1/a/li liaSection 2/a/li liaSection 3/a/li /ul /fieldset Another example: a list of actions (that are in fact, simple links, so, it's just another navigation) where it could make even more sense. fieldset id=actions legend class=structuralYou can do the following/legend ul liaCreate/a/li liaDelete/a/li liaEdit/a/li /ul /fieldset Putting aside anything related to CSS styling (legends could be difficult to style, but aren't really difficult to hide using display:none; although using position: absolute; left:-px could be better for accesibility, but that positioning method on legends has inconsistencies across browsers): 1. Could there be accessibility issues using fieldset/legend outside a form? 2. Or could this method enhance the accessibility (in fact, structural labels enhance accessibility)? 3. Is there any other research/resource that can add some light on this? Thanks. Julián. [1] http://www.opendesigns.org/forum/discussion/2047/ [2] http://drupal.org/node/233928 [3] http://www.usability.com.au/resources/source-order.cfm *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL
[WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
@Jason and @Svip quoted: Svip wrote: I do disagree with Julián's approach. Also, if I may add, strong should only be used as an inline element (you cannot really compare hN with strong, headlines are block elements, while strong is inline) and only in a case where you have a strong point to make, and not a replacement for making bold text. I'm *not* using it as a replacing for making bold text. I use strong to make the text (the content of the structural markup) strong (emphasized). Have you take a look at NetRelations.se [1] source (or better, disable the CSS to see the structural markup in action). In fact, in my example, this strong element is child of a block element (div), so it's not only semantic (see below paragraph) but also valid [2] (inline element validate as child of a block element and sibling of another one). Back to the *semantics* of this: divstrongmain navigation/strong //.../div I repeat: that's semantic, for me: this text is strong, it's important, and no, it's not a paragraph or a heading (we could disagree). Yes, it would not be the most perfect semantic out there, but perfect semantics aren't achievable by current XHTML elements . Not everything out there fits perfect on being a paragraph, or a heading, or an unordered list or whatever (lets not talk about the semantics of div and span). I agree, web pages are documents, web pages should look as documents and should make sense with/without CSS enabled (dont' forget that CSS disabled is, in fact, browser default CSS, and not a totally reseted CSS). So, if reading a site with CSS disabled (default browser CSS), the semantics are given to us (sighted people) by visual formatting of elements (headings are bold, have bigger size, blockquotes are indented, etc), and structural mark-up adds semantic help for people with are visual impaired (but not blind), cognitive disabilities, or even, people using a device with no support for CSS. So, if reading a site with a screen reader, semantics are given by speech (pronunciation and/or help speech), and in consequence, a text marked by strong will be read with emphasis. Then, the structural markup (the strong) on my example has its semantics, it's important to be read loud. Again, no, it's not a heading (but could be), nor a paragraph (does every chunck of text out there on the web deserve to be a paragraph, if it isn't a heading nor a list)? Jason wrote: Needless to say that your application should progressively enhancehttp://en.wikipedia.org/wiki/Progressive_Enhancementthrough the presentation layers. the basic (X)HTML page should make total sense with everything (images, css, javascript and flash) switched off and nicely 'upgrade' as you add each new piece of technology to it. Adding structural markup is, in fact, progressive enhancement, as the research [3] I linked on the first post. The question here is: *how to markup the structural markup? which is the best way?* - using headings, as, for example, in 456bereastreet [4] ? - using strong, as, for example, NetRelations.se [1] ? - using the fieldset+legend approach as suggested in this thread? About the last one. Yes, the W3C tells about using fieldset and legend for adding structure to forms. So, case closed? It doesn't say anywhere (aparently) not to use them outside form and this, combined with the fact that both tags validates being outside, *this make it possible to rethink its semantics*. Of course, a research on accessibility/usability regarding using fieldsets and legends for structural markup should be done before claiming it hurts the user experience. Do you have facts about this affecting visitors negatively? Progressive enhancement is not just for sighted people. Accessibility can and should be enhanced if possible. Ideally, accessibility should be good (if not perfect) since the moment you start building a site, and not as an layer of enhancement added later, if there is time. Thanks for your replies (and excuse my english). [1] http://www.netrelations.se [2] http://www.mail-archive.com/wsg@webstandardsgroup.org/msg30004.html [3] http://www.usability.com.au/resources/source-order.cfm [4] http://www.456bereastreet.com On Tue, May 20, 2008 at 8:44 PM, Julián Landerreche [EMAIL PROTECTED] wrote: A workmate come with this idea, which then I have searched on web and haven't found too much information about it, but this: [1] and [2]. The idea: using fieldset and legend for adding structural markup/labes [3]. It seems that using fieldsets _outside_ forms doesn't make the code to invalidate. Also, in HTML 4.01, legend is required, but optional in XHTML. Currently, I like the approach of adding structural markup using a heading (hn class=structural) even just a simple strong class=structural, and if necessary, hide them by CSS I borrowed the idea from NetRelations.se and 456bereastreet.com. Example: div id=main-nav strong class=structuralMain navigation/strong
Re: [WSG] Fwd: using fieldsets and legends (outside a form) for adding structural markup
Hi Julian, strong is for emphasis. I am on your side on that one. divs are for separating components/sections of a page and can be semantically very strong, especially when given a meaningful class or id name (e.g. header, footer, contacts, product, etc.) fieldset however is quite specifically defined in W3C documentation as being used for grouping 'form elements', hence it is fairly conclusive in my mind that using fieldset elsewhere is an abuse of the standard, even though it passes validation. As responsible and sensible developers I think we ought to leverage what has already been (pretty well) defined in the official documentation from W3C and utilise the tags we have available to us as best we can. We can work further on trying to come up with better mechanisms for handling some other matters for which we feel current HTML is insufficient. I am hoping that XHTML2.0/HTML5 will help with that, although at the moment it is not looking too promising. That's it for now from me. Your English is very good and your points are well made. Regards, Jason www.flexewebs.com On 5/20/08, Julián Landerreche [EMAIL PROTECTED] wrote: @Jason and @Svip quoted: Svip wrote: I do disagree with Julián's approach. Also, if I may add, strong should only be used as an inline element (you cannot really compare hN with strong, headlines are block elements, while strong is inline) and only in a case where you have a strong point to make, and not a replacement for making bold text. I'm *not* using it as a replacing for making bold text. I use strong to make the text (the content of the structural markup) strong (emphasized). Have you take a look at NetRelations.se [1] source (or better, disable the CSS to see the structural markup in action). In fact, in my example, this strong element is child of a block element (div), so it's not only semantic (see below paragraph) but also valid [2] (inline element validate as child of a block element and sibling of another one). Back to the *semantics* of this: divstrongmain navigation/strong //.../div I repeat: that's semantic, for me: this text is strong, it's important, and no, it's not a paragraph or a heading (we could disagree). Yes, it would not be the most perfect semantic out there, but perfect semantics aren't achievable by current XHTML elements . Not everything out there fits perfect on being a paragraph, or a heading, or an unordered list or whatever (lets not talk about the semantics of div and span). I agree, web pages are documents, web pages should look as documents and should make sense with/without CSS enabled (dont' forget that CSS disabled is, in fact, browser default CSS, and not a totally reseted CSS). So, if reading a site with CSS disabled (default browser CSS), the semantics are given to us (sighted people) by visual formatting of elements (headings are bold, have bigger size, blockquotes are indented, etc), and structural mark-up adds semantic help for people with are visual impaired (but not blind), cognitive disabilities, or even, people using a device with no support for CSS. So, if reading a site with a screen reader, semantics are given by speech (pronunciation and/or help speech), and in consequence, a text marked by strong will be read with emphasis. Then, the structural markup (the strong) on my example has its semantics, it's important to be read loud. Again, no, it's not a heading (but could be), nor a paragraph (does every chunck of text out there on the web deserve to be a paragraph, if it isn't a heading nor a list)? Jason wrote: Needless to say that your application should progressively enhancehttp://en.wikipedia.org/wiki/Progressive_Enhancementthrough the presentation layers. the basic (X)HTML page should make total sense with everything (images, css, javascript and flash) switched off and nicely 'upgrade' as you add each new piece of technology to it. Adding structural markup is, in fact, progressive enhancement, as the research [3] I linked on the first post. The question here is: *how to markup the structural markup? which is the best way?* - using headings, as, for example, in 456bereastreet [4] ? - using strong, as, for example, NetRelations.se [1] ? - using the fieldset+legend approach as suggested in this thread? About the last one. Yes, the W3C tells about using fieldset and legend for adding structure to forms. So, case closed? It doesn't say anywhere (aparently) not to use them outside form and this, combined with the fact that both tags validates being outside, *this make it possible to rethink its semantics*. Of course, a research on accessibility/usability regarding using fieldsets and legends for structural markup should be done before claiming it hurts the user experience. Do you have facts about this affecting visitors negatively? Progressive enhancement is not just for sighted people. Accessibility can and should be enhanced if possible.
