Ask users for Email addresses
How to ask a user for an email address.
When to use this pattern
Use this pattern when you need to collect an email address from the user.
How to use this pattern
When using this pattern you should:
- tell users why you need an email address and what it will be used for
- make sure the field can accept all email addresses
- help users enter an email address in the correct format
Explain why you need the email address
ons-label__description with the input component to reassure users why you need an email address and what it will be used for.
Allow all email addresses
How to check email addresses
To help users enter a valid email address, you should:
- allow them to paste the email address
- check they have entered something in the email address field
- check that what they have entered is valid
- show an error message if they have not entered anything or what they have entered is not valid
- ask them to confirm it is correct using the check answers pattern
Use the correct errors pattern and show the error details above the email address field.
If the email address field is empty
Use “Enter an email address”.
If the email address entered is not in a valid format
Use “Enter an email address in a valid format, for example, email@example.com”.