1

I have a sign up form where the email address needs to be displayed, but cannot be edited (it is pre-determined, like an invite). Is it sufficient to grey the populated email field out to signify that it can't be changed?

An argument against this would be to remove the users email from the form altogether and have it sit above the form.

The reason for wanting it within a form field however, is to cement the fact that this is the email attached to the account and to keep it as close to the create password field as possible (create password & confirm password are the only other fields).

  • 2
    If I see a what looks like an input box that is greyed out, I assume there must be something I can do to un-greyout it. Having it just displayed, rather than in a input-style box sounds better to me m – Christy James Feb 11 '16 at 21:07
  • As a general rule, unless a field value can somehow "become editable" on a screen, I always render it outside of a form element (e.g. Plain text/bold text) so that the user doesn't even think mistakenly that they can edit it. – scunliffe Feb 12 '16 at 23:32
1

There are other ways to make elements appear as part of a group.

If you place the email address in a label above the form, but make the space between the email address and the first text box the same size as the space between the 1st and 2nd text boxes, then people will automatically see them as a group (gestalt principles). The space between this form and the other elements on the screen should then be much bigger.

Something roughly like this:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

0

If you allow the user to the change email address, you may also do this on this format.

enter image description here

If the user is not allowed to change email, Franchesca's answer above is a good approach.

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.