[whatwg] Placeholder option for text input boxes

[Garrett Smith]

On Mon, Sep 29, 2008 at 5:20 PM, Andy Lyttle <whatwg at phroggy.com> wrote:
> Hi all!
>
> I would like to see Apple's <input type="search"> adopted as an official
> standard, but there's one particular feature that would be easy to adopt
> without supporting the rest, and that's the "placeholder" option.
>  Currently, lots of sites are implementing placeholder text through a
> combination of creative CSS and JavaScript hacking, but each site has to
> reinvent the wheel, and very often the wheel gets reinvented badly (examples
> below).  Making it a standard feature of HTML would eliminate the need for
> all the extra scripting and improve accessibility, and consistent behavior
> would make a better user experience.
>
> The desired behavior is for the placeholder text to appear in the field with
> a gray color when the field is not focused and the value is empty.  Of
> course the meaning of "gray" is up to the browser.  The placeholder option
> was originally intended for search fields, but it's useful for other input
> types as well, and Safari already supports it on all text input fields.  The
> HTML simply looks like:
>
> <input name="zip" placeholder="Zip Code">
>
> Here are a bunch of examples of sites that currently use JavaScript and CSS
> tricks in an attempt to simulate this behavior, to varying degrees of
> success:
>
> These use black placeholder text that disappears on focus but does not
> reappear on blur:


>
> As you can see, that's seven different behaviors, some of which are clearly
> not ideal, and all of which require JavaScript, which takes time to
> implement, test in multiple browsers, and debug.  Supporting the placeholder
> attribute (which is already implemented in one major browser) would solve
> all of these problems.
>
> Comments?
>

|placeholder| sounds a little like |alt|. Alt is a property and an
attribute on INPUT.

How to specify alternate text:
http://www.w3.org/TR/html401/struct/objects.html#adef-alt


> --
> Andy Lyttle
> whatwg at phroggy.com
>
>