I'm creating a web site that requires users to log in using either their email address OR mobile number.

What is the best way from a UX point of view to indicate that only one of the fields should be filled in. I'm thinking either an option to select which one the user will enter, having two text boxes and disabling one when text is in the other, or having one text box with some fancy regexing to work out if what is entered is an email or password. However, I'm not a UX designer and I'm open to any better ideas.


2 Answers 2


We ran into the exact same problem in the previous project. As it turns out, using only one textbox and label it "Email/Phone" would do fine. Regex is used both on the client side (javascript validation) and server side to check whether user's input is email or phone.

Here is link to my login mockup.

one field for email or phone number

  • Could you add a mock up of your solution?
    – edgarator
    Commented Nov 23, 2012 at 2:58
  • There is a downside to the single field option though. You cannot supply hints on the input type that would supply content-specific data entry for numbers vs email addresses (e.g. the different iPhone keyboards you get).
    – user597
    Commented Nov 24, 2012 at 11:23

Agree with user21630

The same idea comes to my mind that just use one text box with grayed out hints said "email/phone".

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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