> From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
> On Behalf Of Oliver Boermans
> Sent: Saturday, January 30, 2010 8:21 PM
> To: wsg@webstandardsgroup.org
> Subject: Re: [WSG] Minimal forms or marking up a search field
> 
> On 31 January 2010 13:45, Thierry Koblentz <thierry.koble...@gmail.com>
> wrote:
> >> You do not need <fieldset> nor a <legend> as they are intended for
> >> grouping form fields on more complex forms.
> >
> > I agree.
> > I'd just use a DIV to wrap these form controls.
> 
> Thanks guys, I'm glad I asked this question. I was carrying around the
> idea that the required element around any inputs inside a form element
> was a fieldset. Seems I was wrong, any block element will satisfy the
> spec.
> 
> So presuming we do away with the legend:
> <div id="searchform">
>        <label for="search">Keyword/s</label>
>        <input type="text" id="search" name="search" />
>        <input type="submit" value="Search" />
> </div>
> 
> .and assuming there are no other 'search' fields in the page we need
> to distinguish from. I'd like to test some further assumptions:
> 
> - Some people don't know how to submit the query without a 'Search'
> (or 'Go') button?
> <div id="searchform">
>        <label for="search">Keyword/s</label>
>        <input type="text" id="search" name="search" />
> </div>
> Apple seems to believe the the submit input is unnecessary
> <http://www.apple.com>
> 
> - Now that the legend is gone I should use the label to describe the
> purpose of the text field rather than what one should enter in it?
> Everyone knows you put keywords in a search field, right?
> <div id="searchform">
>        <label for="search">Search</label>
>        <input type="text" id="search" name="search" />
> </div>
> 
> - Is including the keywords hint in the title attribute useful to
> anyone?
> <div id="searchform">
>        <label for="search">Search</label>
>        <input type="text" id="search" name="search" title="Keyword/s"
> />
> </div>
> 
> - Does everyone agree this is taking simplicity too far?
> <div id="searchform">
>        <input type="text" id="search" name="search" title="Search" />
> </div>

I'd go with:

<div role="search">
<label for="search_query">Search for:</label>
<input type="search" placeholder="Keyword(s)" id="search_query"
name="search_query" size="20">
<input type="submit" value="Submit">
</div>

It won't validate though.
You could also throw "autofocus" in there in case you plan to focus on the
field when the page loads.


--
Regards,
Thierry | www.tjkdesign.com






*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*******************************************************************

Reply via email to