Accessible email design ensures messages render and can be read across clients and by people using screen readers or high contrast: semantic HTML, alt text, sufficient contrast, readable font sizes, and a logical reading order.
What good looks like#
- Done: Use a single-column layout that reflows on mobile.
- Done: Set alt text on every meaningful image and empty alt on decorative ones.
- Done: Maintain 4.5:1 contrast and at least 16px body text.
- Done: Include a plain-text alternative and test in dark mode.
What bad looks like#
- Seen in audits: Text embedded in images with no alt.
- Seen in audits: Tiny grey text on light backgrounds.
How to move from bad to good#
Work through the good list in order and re-verify after each change. Most teams find one or two items from the bad list already present; fixing those usually produces the largest improvement.
Frequently asked questions#
Does dark mode change email colors?
Some clients invert or adjust colors. Test in Gmail, Outlook, and Apple Mail dark modes and use transparent PNGs where possible.