Re: placeholder text in input controls

The HTML5 placeholder attribute will indeed standardise its use and will negate the need for JavaScript to handle placeholder behaviour. 

Irrespective of this, consideration must be given to older/non-modern browsers and older screen readers, so bringing it back to the lowest common denominator, i.e. raw HTML is the best bet. 

Ensuring that labels are always in place and appropriately associated with form fields will provide a base layer and then titles and placeholders can be used as progressive enhancements. 

As the major screen reader vendors get most of their income from government programs supporting VI people in employment, but with 67% of VI people of working age in the UK being unemployed, technology adoption and particularily mainstream screenreaders are cost prohibitive. As there is no provision for those not in education or employment, screen reader hand me downs that rely on older browsers are being utilised by many VI people, thus the importance of this approach.

Best,

Sandi

Sent from my iPad

Sandi Wassmer
Copious Ltd / digital agency
t: 020 8446 3806
m: 07808 887 201
e: sandi@copious.co.uk
w: www.copious.co.uk 

Read Sandi's Action for Blind People Blog:
www.actionforblindpeople.org.uk/your-community/blogs/sandi-wassmer/

Follow Sandi on Twitter:
www.twitter.com/SandiWassmer

Follow Copious on Twitter:
www.twitter.com/copious

Company Registration number: 4213718      
VAT Registration Number 774 4416 14

If you receive this e-mail in error please notify the sender by replying using the words Misdirected E-mail in the subject, and then delete the message and any attachments from your system.


On 9 Dec 2011, at 20:37, "John Foliot" <jfoliot@stanford.edu> wrote:

> Devarshi Pant wrote:
>> 
>>> Bart wrote:
>>> Now some sites start to use placeholder text instead of visible labels
>>> next
>>> to the control. I don't see this technique in WCAG2.0. Do you consider
>>> this
>>> sufficient to comply with success criterium 3.3.2 labels or
>>> instructions?
>>> The placeholder text is visible in the control and disappears when the
>>> field
>>> receives focus. Keyboard users see the text until they actually need
>>> it.
>>> Title attributes are not displayed on keyboard focus, only on mouse
>>> over.
>>> JAWS11 reads the title and not the placeholder attribute.
>>> Please advise whether the above example is ok or not.
>>> 
>> *****
>> Bart - This example could satisfy SC 3.3.2, when we factor in the
>> following:
>> 1. The title attribute and the placeholder text should convey the same
>> meaning, which in your case are fine. "What is your first name" and
>> "First Name" are quite close.
>> 2. Those screen reader users who have settings that favor the label
>> will not get the title attribute information. Furthermore, since the
>> placeholder information is unavailable too, the form will be hardly
>> accessible. Therefore, you might want to caution your users about this
>> behavior and probably state somewhere that settings should favor the
>> title attribute - some users like their default settings - so tread
>> carefully in this regard.
>> 
>> You may use off-screen labels if you want to avoid touching users'
>> settings.
> 
> Hi All,
> 
> I've not fully tested this everywhere, but as we see developers continue
> to transition to HTML5 they have the ability to add placeholder text to
> their form inputs without relying on JavaScript by using the placeholder
> attribute
> (http://dev.w3.org/html5/spec/common-input-element-attributes.html#the-pla
> ceholder-attribute) the spec clearly reads: "The placeholder attribute
> should not be used as an alternative to a label." But we all know that
> many will conveniently or inadvertently miss that detail, so we need to do
> a good job reminding developers about this problem.
> 
> While placing the <label> content off screen is a tried-and-true
> technique, another way forward will be to use the aria-label attribute,
> like this:
>    
>    <input type="text" name="email" placeholder="My Email Address"
> aria-label="My Email Address">
> 
> This *should* work in all modern browser/screen-reader setups, but as
> previously noted I've not done extensive testing so you mileage may vary.
> 
> JF
>    
> 
> 
> 
> 
> 
>

Received on Friday, 9 December 2011 21:57:09 UTC