Multiple email address field in a simple form

Question

This is a survey site, and after completing the survey the user has the option to send a copy of the report to themselves. There is a small container on the page, with a text field and a submit button. The user just needs to enter their email address and click on submit.

Now there's a new request to allow the user to enter 2 email addresses. The purpose of the 2nd email is to allow the user to send a copy of the report to a 2nd person. E.g. if I completed the survey and I want to send a copy of the report to my partner, I enter their email address.

There are a few ways to go about doing it, I'm just seeking advice as to which is a better approach.

1. Add one more text field to the form. This is straightforward, but is kind of repeating UI to me.

2. Change the text field to allow multiple email addresses, separated by comma or semi-colon. This will be accompanied by one line of text to inform the user of this feature.

3. Use one text field, and when the user clicks on submit the action happens in the background. Just show that report has been sent, and give the user the option to enter another email address and click submit again.

4. Still using one text field, just that there is a plus button added, so in the event that user needs to add in more than 1 email address, another field would appear below for them to enter. Using this approach, we would need to set a maximum number of email addresses to enter as that could affect the layout of the page.

The rest of the team seems to vote for Option 1. I personally would prefer Option 3, which is cleaner. So seeking advice from you guys how to go about presenting this to the user.

Answer 1

This is most often handled by contact applications, and Gmail contacts does a good job with this. Essentially, you provide a discrete button to "add email address", which then will provide another field to add a second address.

This way you don't distract the majority of users that will only add a single email address, but you make it clear for anyone that wants more than one email address.

Answer 2

If the purpose of this email field is purely as an addressee for whom you want to send the report to, then why not mimic a traditional email application (as that's basically what the form is doing itself).

Give it a 'To' field which would be the compulsory field, and add a 'CC' field in there too, so they can add one or more additional email addresses in there. Give them the ability to split out the emails by commas or semicolons, just as they would be able to do in a traditional email application.

Answer 3

After the survey is submitted, repeatedly show a dialog to the user till he says No, Thanks

Answer 4

Option 1 has the flaw that you are fixed on 2 mail addresses then. Before you were fixed on one. What if someone wants to enter 3?

Option 2 requires the users to read and understand how the addresses should be entered. It might also be harder to provide client-side validation for this.

Option 3 can be used in addition to whichever way you choose. It can’t hurt to provide this option after the form is submitted. Even more so when you have nothing else to show than a confirmation message.

Option 4 would be the best. Such a button does not distract those users that only want to enter one address. It will be clearly understood without having to read something. And it is flexible.

So I’d go with option 4. And where appropriate option 3 in addition.

But I think you shouldn’t restrict the number of possible addresses simply because of your layout – better fix your layout. However, restricting the number might be required because of potential "attacks" (sending massive amounts of mails that way).

A nice solution might be to inform your users, as soon as they entered the maximum amounts of addresses, that they should better use the (B)CC function of their mail clients when they want to inform so many people about the survey reports.