Skip to main content

All About Emails

Kevin P. Murphy
Office of Digital Accessibility

This week, I want to showcase two policies covering a similar problem around email links. When placing email links, like other linked content on a web page, it's essential to consider the user's experience. 

Follow these policies to ensure email address links are accessible: 

Policy 1: Email Link without Mailto

Sometimes screen readers will miss a broken link depending on the link's HTML. Suppose your email link looks like this <a href="murphykp@stanford.edu"> instead of this <a href="mailto:murphykp@stanford.edu">. The first HTML example will result in a broken link, but might not be as noticeable as a normal 404 error. Adding "mailto" to your email link will ensure your link works properly and is accessible to screen readers. This Siteimprove policy covers this issue.

Policy 2: Emails without links

Copy/pasting an email address can be difficult for users with certain disabilities, such as issues with dexterity. Instead, wrap your emails in links. If you code your email link like this <p>murphykp@stanford.edu</p> (no link around an email address), the link is not accessible to all users. Instead, your email address should be wrapped in a link like this:

<p><a href="mailto:murphykp@stanford.edu">murphykp@stanford.edu</a></p>

 View this Siteimprove policy to learn more.

DISCLAIMER: UIT Blog is accurate on the publication date. We do not update information in past blog entries. We do make every effort to keep our service information pages up-to-date. Please search our service pages at uit.stanford.edu/search.

What to read next:

Element is Empty

Kevin P. Murphy
Office of Digital Accessibility

Semantic HTML

Kevin P. Murphy
Office of Digital Accessibility

When Working with Element IDs, Make Them Unique

Kevin P. Murphy
Office of Digital Accessibility