1. Knowledge Base
  2. Find Answers
  3. Accessibility Requirements for Email

Accessibility Requirements for Email

This service is for faculty, staff, and students.

Accessibility Requirements for Email

  • Always include Alt Text on all images
  • Use size 16 font minimum
  • Spacing must be between 1.5 and doubled spaced
  • Single-column format for emails to make them more mobile-friendly 
  • Avoid using justified text alignment.
    • Centered may be used for headings or subheadings.
    • Body should be left-aligned.
  • Tag the language of your email in the <html> tag in the beginning of your email so that screen readers read it in the appropriate language. 
    • Example: <html lang="en">
  • Template / tables:
    • Most email templates are built using HTML tables. HTML tables are still the most reliable way to structure emails and have them display properly across the 90+ email clients in popular use. However, HTML tables are actually meant to be used for tabular data, not layouts. The default for most screen readers is to read each individual table, table row, and table cell out loud to the user. For emails that often rely on multiple nested tables, this means that subscribers have to wade through a lot of markup garbage to get to the actual content. We can easily disable this behavior by including an attribute on each table in our email’s HTML. 
    • By including the role attribute with the value “presentation,” we effectively remove the table from the screen reader’s model and prevent it from being read aloud. The screen reader then skips to the content within, allowing the subscriber to focus on the content instead of manually skipping through useless layout markup. It should be noted that there are other ARIA roles that could be used instead of presentation. Presentation is set to be deprecated in future versions of the ARIA spec, with the “none” role replacing it. However, support for none is currently limited, so it’s up to you to decide which role works for your specific audience. If you’re using tables to create bulletproof buttons, you may want to include the button role to provide additional context for users that need it. Just like with alternative text on images, though, you shouldn’t leave roles off of tables, as that will result in screen readers reading each individual table, table row, and table cell to the user.
    • HTML example: <table role="presentation" border="0" cellpadding="0" cellspacing="0"></table>
  • Tip: Use Litmus to run an accessibility check. It also has a feature that will allow you to hear how your email is read by a screen reader.
 To report a problem or receive additional troubleshooting, please contact the Tech Desk. 

Details

Article ID: 100151
Created
Fri 3/6/20 9:53 AM
Modified
Thu 10/13/22 1:23 PM