19 comments

  • Jonathan CourtneyJonathan Courtney, almost 9 years ago

    This being the problem btw: http://www.nngroup.com/articles/form-design-placeholders/

    4 points
  • Louis-André LabadieLouis-André Labadie, almost 9 years ago

    This is known as the Float Label Pattern.

    3 points
  • Dirk HCM van BoxtelDirk HCM van Boxtel, almost 9 years ago

    Why.

    Why not put it on top in the first place. Less legible? It's still less legible in the end result of that one.

    Nothing says "fill me out" like a labelled EMPTY field.

    Vote NAY, on fancy placeholders.

    Full disclosure: I'm a nag.

    1 point
  • Darth BaneDarth Bane, almost 9 years ago

    In my opinion, the real problem is that designers are leaning against placeholders too much, when they should be using labels "properly". I get it, placeholders look cleaner, but I'm moving more and more towards going back to traditional labels.

    1 point
    • Jonathan CourtneyJonathan Courtney, almost 9 years ago

      I agree that traditional labels are the safest solution here and they're also what I recommend to my clients - but still found this interesting.

      The advantage of placeholders is that the form can look shorter and more simple to fill out, increasing the conversion rate at times. The dissadvantages are too big to ignore though.

      This "floating label" solution seems like an interesting wy to solve it and I'd love to A/B test it.

      2 points
      • Darth BaneDarth Bane, almost 9 years ago

        I'm willing to bet traditional labels actually perform better in general than placeholders do. We split-tested this at Tastebuds on about 150,000 users and traditional labels drastically improved conversion on our landing page.

        0 points
        • Jonathan CourtneyJonathan Courtney, almost 9 years ago (edited almost 9 years ago )

          Against placeholders, traditional labels win - 100% agree. I've also seen this proven in split tests. But it's because the labels are being hidden when the user inputs text.

          What I would like to see is a split test using traditional labels and the "adaptive placeholder" method. Right now I can't imagine why the Adaptive method would perform worse.

          1 point
          • Darth BaneDarth Bane, almost 9 years ago

            I can see many potential reasons why it could perform worse, including:

            1. The functionality breaking on some machines
            2. Too much going on, focus is drawn to the effect rather than the main objective
            3. Placement diffusion from a user perspective

            ...and so on. I love split tests, would also like to see results. Sometimes the craziest ideas test better. But for the most part, traditional simplicity wins.

            1 point
            • Jonathan CourtneyJonathan Courtney, almost 9 years ago

              I think your point "2" could be the killer. Too much movement and distraction during form-filling is never a good thing. Nice point.

              Buuuut - I still want to see some results. Gimme.

              0 points
  • Catalin CimpanuCatalin Cimpanu, almost 9 years ago

    LoL...just wasted a click and 10 seconds... Put a proper title next time, this is not a gossip site.

    0 points
    • Jonathan CourtneyJonathan Courtney, almost 9 years ago

      Could you please explain what you mean rather than being rude and non-constructive?

      Maybe suggest the title you would have chosen.

      I thought it was an interesting design solution so I posted it.

      1 point
      • Catalin CimpanuCatalin Cimpanu, almost 9 years ago (edited almost 9 years ago )

        "Adaptive Placeholders" would have been a good title since it tells me what I can find after I click. Your title is in the realm of what you usually see on TMZ "Secret solution used by two famous stars for their quick weight loss"

        I like this site and I don't want it to turn into HackerNews were people are just posting for points. Just share the links without over-hyping. And I'm not rude... I'm just telling it like it is.

        And there's nothing "sweet" about it since the idea is probably copied from JVFloat.js which ported it from an Objective-C class, which recycled it from a very old Dribbble GIF. IMHO it doesn't fix any usability problem since there's nothing wrong with placeholders. Developers are just over-using them in places where they shouldn't. Two-three angry bloggers a problem does not make.

        3 points
        • Abhijit RawoolAbhijit Rawool, almost 9 years ago

          Even I don't think use of placeholders is a problem. Its the overuse of the placeholders that is a problem. On longer forms, I would still prefer to use traditional labels against placeholders.

          1 point
        • Jonathan CourtneyJonathan Courtney, almost 9 years ago

          Fair enough Catalin.

          I didn't intend on making this a sensationalist headline and I personally don't care where the solution originated (I just wanted to show it to people who might not have seen it), but i'll definitely keep your points in mind next time I post.

          I don't know or need to know why you're so bitter, but I would suggest in future to not try to reduce the comment section to a YouTube level of immaturity.

          Instead, give constructive feedback, let people know why you disagree and help improve the site you claim to love so much.

          1 point
          • Radu NicolaieRadu Nicolaie, almost 9 years ago (edited almost 9 years ago )

            His job title is "Editor"... probably he has a chief editor that drilled him into proper "titles" :))) But he's true. You "mislead" me too ... I thought it was something about menus. I'm pretty bummed right about now...

            ... nah...just kidding

            1 point
  • Cindy ChenCindy Chen, almost 9 years ago

    Here's another interesting approach to the same issue http://codepen.io/matt159/pen/htLqv

    Although I agree with using proper labels for form fields; less issue with browser fallbacks as well.

    0 points