How do you design super long forms?

over 5 years ago from chris limbrick, Digital Product Designer

  • Joe ShoopJoe Shoop, over 5 years ago

    Every single point in this article is a way that floating labels commonly fall short, but all of these potential problems can be accounted for and fixed.

    1. hints could appear on field focus, then go away once the user starts typing, like hints normally would.

    2. Make sure the text is large enough to be readable.

    3. Make sure there is enough space for the labels to move into.

    4. Keep animation to a minimum and ensure that it adds value, not just ornament.

    5. Make sure they have enough contrast to be readable.

    6. Style the input text differently than the placeholder label so it is clear that a field has been filled

    7. For radio buttons, he makes a good point. bBt dropdowns could still have a placeholder label if you don't have a default pre-selected.

    8. Keep label text short

    9. see 1.

    That said, the primary benefit of placeholder labels is to reduce vertical height, and to make an unfilled form feel less complicated. Sometimes those things are not a huge concern.

    1 point