A couple of months ago, me and my girlfriend Amy hupe opened a joint venture called Franklywhich aims to help create understandable, accessible and user-friendly digital products.
We believe it is extremely important to form the right foundations. This means that you need to think carefully about the big picture, as well as pay close attention to the smallest details.
Together we wrote this article about one such detail that we encountered along the way of our project.
The problem with mailto links
It was very important for us that the website reflects our core values while remaining simple, accessible and user-friendly.
One of the questions we ran into was whether to add standard mailto links to the email address or not.
We didn t want to add them because, although they are widely used on the Internet, they present a number of challenges.
First, mailto links make it difficult to copy an address, for example if you want to share an email address with someone else.
Secondly, some users use more than one email application, and the link uses only the default application, preventing the use of another.
Finally, many users do not have their email application configured. This means that the link may lead them to a dead end or “rabbit hole”.
For example, when you click an email address in Chrome on your Macbook, the Mail app downloads a request to set up an email account. We use Gmail and it s really hard to set it up in Chrome.
For these reasons, we decided to remove the mailto link and add the mail address in plain text.
But this solution had its drawbacks.
Pros of mailto links
We questioned the decision to remove the mailto link because:
- they are used everywhere – so people could get used to them and expect the appropriate behavior from the site
- On mobile devices, users often have to set up their default email address, so clicking on this link is exactly what most mobile users intend to do: it opens a compose dialog box.
But that still doesn t guarantee a great experience for a user who wants to copy an email address and add it to a note or send to a contact.
Offering a choice
Given the clear advantages and disadvantages of mailto links, we decided that it is best to provide users with a choice, which is one of the principles of inclusive design.
Thus, the next day after the launch of the site and after a short Twitter discussions, we added a mailto link next to the email address, keeping the address itself as plain text.
People who want to go to send the email can click on the mailto link, and people who want to copy the email address can copy the text.
Adding a copy address button
This may not have been a bad decision, but mailto links are so common that some users still expect to be able to click on an email address to compose a letter.
To fix this, we decided to add a mailto link to the email address, and place a “copy address” button next to it, which allows users to quickly copy the address to the clipboard.
This way, they can paste the copied address into their email app to write an email, add it to notes, or share it with a contact.
This gives users the same choices as described above, but the design looks cleaner and more familiar.
However, it s worth noting that this only solves one of the three problems with mailto links we mentioned above: they make it difficult for users to copy the address.
Even using our solution, people following this link are still:
- get stumped if they don t have an email app configured
- won t get a choice of which app to use if they use more than one email app
What we really like
This is such a common problem and it seems that browsers and operating systems should fix it.
We believe it would be ideal if users clicking on the mailto link see a menu with options like this:
- Send email from Gmail
- Email from another account
- Copy email address
- Share your email address via …
This meets the most common needs and gives the majority of users the ability to move forward.
Here s a little story about mailto links. What do you think?