RE: [WSG] Minimal forms or marking up a search field

[michael.brockington]

 
 
_

a) Submit button as label:



   
   
  
   






>From a purely technical point of view, think what is supposed to happen when 
>you click on a  
Then think what happens when you click on a , and ask yourself which 
one is supposed to happen?

Regards,
Mike

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

RE: [WSG] Minimal forms or marking up a search field

[Foskett, Mike]

Hi Paul,

An interesting question.

I'd go with b.
The label is almost, but not quite, redundant when presented with in a simple 
search form.

I'd advise against method a.
A confusion of goals takes place.
The label is explicitly associated via the for attribute to the search field, 
but implicitly associated by position to the submit button.
That breaks the original WCAG guidelines priority 2 parts 10.2 and 12.4



Regards

Mike Foskett


-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org] On 
Behalf Of Paul Novitski
Sent: 17 February 2010 19:25
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] Minimal forms or marking up a search field


>A practical distraction for the standardistas and accessibility gurus�
>
>Hoping tap your brain for an alternative perspective on the simple and
>common HTML scenario of a site search form.
...


To revisit this topic, I'm considering the
following and would appreciate feedback:
_

a) Submit button as label:



   
   
  
   


_

b) Label hidden from view:



   Search:
   
   



label#search-label
{
 position: absolute;
 left: -1000em;
}
_

The rationale for both of these is that the
"Search" submit button serves as a clear and
unambiguous label for the input field. In listing
a) the button is literally the label; in b) there
is a separate literal label present in the markup
but hidden from cosmetic view.

Both validate for W3C HTML & Cynthia 528 & Accessibilty.

Can you see any problems with them?

I favor a) but it feels edgy.

Regards,

Paul
__

Paul Novitski
Juniper Webcraft Ltd.
http://juniperwebcraft.com



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





This is a confidential email. Tesco may monitor and record all emails. The 
views expressed in this email are those of the sender and not Tesco.

Tesco Stores Limited
Company Number: 519500
Registered in England
Registered Office: Tesco House, Delamare Road, Cheshunt, Hertfordshire EN8 9SL
VAT Registration Number: GB 220 4302 31

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

Re: [WSG] Minimal forms or marking up a search field

[David Dorward]

 
On 17 Feb 2010, at 19:24, Paul Novitski wrote:
> To revisit this topic, I'm considering the following and would appreciate 
> feedback:
> a) Submit button as label:
> b) Label hidden from view:



Neither

"""
The label element is not used for the following because labels for these
elements are provided via the value attribute (for Submit and Reset 
buttons), 
the alt attribute (for image buttons), or element content itself 
(button).
"""
  — http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-TECHS/H44.html

-- 
David Dorward
http://dorward.me.uk



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

Re: [WSG] Minimal forms or marking up a search field

[Paul Novitski]

A practical distraction for the standardistas and accessibility gurus�

Hoping tap your brain for an alternative perspective on the simple and
common HTML scenario of a site search form.

...


To revisit this topic, I'm considering the 
following and would appreciate feedback:

_

a) Submit button as label:


   
  
  
 
  
   

_

b) Label hidden from view:


   
  Search:
  
  
   


label#search-label
{
position: absolute;
left: -1000em;
}
_

The rationale for both of these is that the 
"Search" submit button serves as a clear and 
unambiguous label for the input field. In listing 
a) the button is literally the label; in b) there 
is a separate literal label present in the markup 
but hidden from cosmetic view.


Both validate for W3C HTML & Cynthia 528 & Accessibilty.

Can you see any problems with them?

I favor a) but it feels edgy.

Regards,

Paul
__

Paul Novitski
Juniper Webcraft Ltd.
http://juniperwebcraft.com 




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

RE: [WSG] Minimal forms or marking up a search field

[Thierry Koblentz]

> 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 
> wrote:
> >> You do not need  nor a  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:
> 
>Keyword/s
>
>
> 
> 
> .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?
> 
>Keyword/s
>
> 
> 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?
> 
>Search
>
> 
> 
> - Is including the keywords hint in the title attribute useful to
> anyone?
> 
>Search
> />
> 
> 
> - Does everyone agree this is taking simplicity too far?
> 
>
> 

I'd go with:


Search for:




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
***

Re: [WSG] Minimal forms or marking up a search field

[Oliver Boermans]

On 31 January 2010 13:45, Thierry Koblentz  wrote:
>> You do not need  nor a  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:

   Keyword/s
   
   


…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?

   Keyword/s
   

Apple seems to believe the the submit input is unnecessary


- 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?

   Search
   


- Is including the keywords hint in the title attribute useful to anyone?

   Search
   


- Does everyone agree this is taking simplicity too far?

   


Thanks for indulging my hairsplitting.

Ollie
--
@ollicle


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

RE: [WSG] Minimal forms or marking up a search field

[Thierry Koblentz]

> If you are looking for a simple search form (i.e. the input box into
> which user enters a search term followed by 'Search' submit button)
> you should be using something like this.
> 
> Search
> 
> 
> 
> You do not need  nor a  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. 

--
Regards,
Thierry | www.tjkdesign.com






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

Re: [WSG] Minimal forms or marking up a search field

[Jason Grant]

Hi Ollie,

If you are looking for a simple search form (i.e. the input box into
which user enters a search term followed by 'Search' submit button)
you should be using something like this.

Search



You do not need  nor a  as they are intended for
grouping form fields on more complex forms.

Hope this helps.

Thanks,

Jason

On Sun, Jan 31, 2010 at 2:31 AM, Oliver Boermans  wrote:
> A practical distraction for the standardistas and accessibility gurus…
>
> Hoping tap your brain for an alternative perspective on the simple and
> common HTML scenario of a site search form.
> 
>        Search this site
>        Keyword/s
>        
>        
> 
>
> As far as I understand it this mark-up meets the requirements demanded
> of such a form.
> Although, in striving for simplicity, there may be significant redundancy.
>
> My question regards the HTML and text used:
> How much mark-up can be removed without breaking it?
>
> - FIeldset / legend combination are required to meet HTML standards
> and provides valuable context to my mind.
> Am I missing anything?
>
> - Sacrifice the label and add a title attribute on the text input?
> 
>        Search this site
>        
>        
> 
>
> - Once supported, will the new HTML5 placeholder attribute make the
> label redundant
> 
>        Search this site
>        
>        
> 
>
> - How many users know that they can use the Enter key to submit the form?
> 
>        Search this site
>        
> 
>
> - The future?
> 
>        Search this site
>         />
> 
>
> Editable mark-up here
> http://fixee.org/paste/bxmsvue/#url=bxmsvue
>
> Redundancy can be a good thing, but where do you draw the line?
> Looking forward to your considered thoughts and relevant experiences.
>
> Cheers
> Ollie
> --
> @ollicle
>
>
> ***
> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
> Help: memberh...@webstandardsgroup.org
> ***
>
>



-- 
Jason Grant BSc, MSc
CEO, Flexewebs Ltd.
www.flexewebs.com
ja...@flexewebs.com
+44 (0)7748 591 770
Company no.: 5587469

www.flexewebs.com/semantix
www.twitter.com/flexewebs
www.linkedin.com/in/flexewebs


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