Idea for placeholder text

[markjaquith]

Placeholder text has a fatal flaw, in my mind: once the field is focused, that placeholder text is gone. This can be confusing, especially if you tabbed into that field or it was selected by default. You can actually use placeholder text instead of labels, for a minimalistic form layout, but only if you correct this flaw.

So here's a potential solution:

​http://txfx.net/files/wordpress/labels/

It uses HTML 5's placeholder attribute (newest Safari and Chrome support it), with a jQuery plugin to handle that support for other browsers.

Thoughts?

Looks cool. Didn't realize the placeholder attribute was already being supported.

I don't see the advantage of using the placeholder attribute if, in the end, it's going to take up as much space as a regular label would.

I second what scribu says: if there's enough room for a label below the input, just put it there with CSS consistently. Then those with JS disabled and screen-readers don't miss out on labels.

Also note that the W3C HTML 5 working draft ​explicitly says

The placeholder attribute should not be used as an alternative to a label.

When Mark and I first talked about this, it was re the Title field on the post editor, which uses placeholder text instead of a visual label for visual design reasons, though it has a "label" for screen readers. I need to read up on the accessibility issues, but if accessibility can be worked out, I think this approach has a lot of potential and would be worth doing some prototype screens and testing with users. I'm thinking specifically of media uploader or the Settings section.