What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 131 Stack Exchange communities.

I catch myself clicking twice when I click into a text box here on Stack Overflow. Why? Because my brain thinks, “Oh look, grey prompt text is still there — you didn’t click right, Alan; try again.”

On an even closer inspection, I have noticed that my cursor actually appears in the grey text! It doesn’t go away until I start typing.

Now, two items.

  1. Native HTML5 <input placeholder /> support, in my browser (Chrome 8 on OS X) clears the placeholder on focus.
  2. iOS doesn’t clear placeholder text on focus (c.f. search fields in the iPod/Music app), but it DOES place a very visible cursor at the BEGINNING of the input field, not wherever I clicked.

As-is, SO’s placeholders feel very wrong. Please improve them!

share|improve this question
1  
Interestingly, the site search box does empty itself on focus, creating even more confused user expectations. –  Alan H. Jan 12 '11 at 4:07
    
@Alan - Does this question relate to the Edit Summary box when editing a question/answer? –  Barry Jan 12 '11 at 8:19
    
@Barry: Try the Ask Question page (title and tags fields). –  Jon Seigel Jan 12 '11 at 17:39
1  
+1 because I think the behaviour should at least be consistent. –  Jon Seigel Jan 12 '11 at 17:42
    
We have recently changed the placeholder functionality (I assume it works similar to the site you linked to). So you can choose if you want [status-bydesign] for "Input prompts don’t clear on focus" or [status-completed] for "cursor appears in prompt text" :) –  balpha Feb 4 '11 at 6:33
    
I just noticed this has been implemented. Awesome! One little thing, and slight difference from the Square site: I notice that before I start typing, the cursor is very light grey. Is the input box semitransparent? If so, is that necessary anymore? It doesn’t seem to be the case over at Square. –  Alan H. Feb 5 '11 at 2:41

2 Answers 2

I just saw a similar-in-spirit custom placeholder implementation in effect on https://squareup.com/ — check it out and come back here.

Notice any differences?

  1. On focus, the placeholder text fades to an even less contrasting color, providing concrete feedback that you did focus successfully.

  2. No matter where you click, your cursor does not show up within the placeholder text, but rather at the very left of the input box. This is much more confidence-inspiring (and is what iOS does)

Note that their implementation clears up my criticism with the placeholder text here on SO entirely (as surely the cursor appearing in middle of placeholder isn’t “by design”).

share|improve this answer
    
interesting we will definitely take a look at that.. thank you! –  Jeff Atwood Feb 1 '11 at 18:51
    
Yep, their implementation looks very much like the way we're trying to solve it as well. I guess that's a good sign :) –  balpha Feb 1 '11 at 18:54
    
You’re quite welcome. Hope it helps! –  Alan H. Feb 1 '11 at 19:59

This is by design, as we want the help text to be visible until you start typing.

share|improve this answer
    
IMO, this is a bit unexpected, but okay. Can we at least make the behaviour consistent across all fields where this happens? (See the 1st comment on this question.) I was a rebel on SEDE and even made the "search" prompt reappear OnBlur, but that can be changed easily enough to match. –  Jon Seigel Jan 12 '11 at 17:41
    
I can see keeping the text there as by design, though I do find it inconsistent — but don’t you think that the cursor appears in the midst of placeholder text a bit disconcerting? Surely that isn’t by design. –  Alan H. Jan 13 '11 at 6:54
    
@Jon, Jeff — Have you considered only providing this functionality after detecting whether or not the browser supports native placeholder functionality? Native placeholders are bulletproof (e.g. re-apply themselves on blur) and guarantee as broad a consistency as possible on the user’s platform –  Alan H. Jan 13 '11 at 6:57
    
@Alan H.: Jeff's answer says "we want the help text to be visible until you start typing" -- the native placeholder (at least in Chrome) disappears as soon as you focus the field –  balpha Jan 13 '11 at 9:31
    
Well it’s your guys’ call, but I wouldn’t expect myself to be the only one who is thrown off by the nonstandard behaviors. There are other ways to solve the problem you’re trying to solve here: Use an actual label, or let the user decide to blur if they forgot what it said, etc. I would definitely change how these controls work, myself, because consistency with other sites matters more than what you conceive as ideal. But I’ll leave now, having shared my piece. –  Alan H. Jan 14 '11 at 21:21

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .