JRAccessibility in Email Design
So, I got to thinking after reading Peter Brown's comment on this thread: https://litmus.com/community/code/1250-removing-paragraph-bottom-margin-in-outlook-com
In dealing with Outlook, Peter asks when a paragraph tag is really necessary. I want to take that a bit further and pose the question: How important is accessibility and semantic markup in email design?
On the web, accessibility is (rightly) a priority for a growing number of developers and designers. But I have yet to see that same level of commitment in email design. I'd argue that it is due to the demands placed on us by email clients and their rendering engines. It's hard to commit to using semantic markup when email clients won't display it properly without jumping through an unreal number of hoops.
Still, I'm wondering if I'm missing something. So, do you worry about accessibility in your email campaigns? Do you have any tips and tricks on making more accessible emails?
Let us know!
Accessibility is a huge topic, with so many different areas to consider and so many hacks we already have to deal with.
I jump between using semantic tags and not, ideally I'd always go semantic but it adds bulk to the mark up and time to the testing. I'll often switch it around for a quick fix.
Also if we're talking semantic code, we shouldn't really be using tables (unless you're displaying a table). Personally I'd hold Microsoft largely responsible for the lack of accessibility, as well as their poor support for the most basic html and css the way they handle scaling is terrible. Generally speaking if you have good responsive code it should scale up pretty easily for people with poor vision but the way Outlook DPI works is ridiculous.</rant>
I think Nathan has a good point, simply including a plain text version for screen readers should fix issues for people using those.
I've also been interested to test support for
speak:none;to potentially hide certain parts of the content from screen readers. Not that I'd use it much, it's just an extra tool to consider.I keep writing a few sentences then starting over. On one hand, if you keep things simple with styled text and a few images, it should be fairly accessible for most (color blindness, etc). On the other, our horrible markup would be absolutely brutal for someone on a screen reader.
Is the answer simple text-only versions? Pretty hard for plain-text to be non-accessible.
Hi!
Accessibility is a very important topic for some of our clients (public organisations like the Dutch Government and The Council of the EU). We have invested some time on this topic, and we learned there is a lot you can do make email more accessible.
I do not believe a text-only version solves your accessibility problems because it lacks hierarchy and semantics. You can let a screen reader read this text, but without knowing the structure of the text it will not be easy to understand. Download a screen reader and give it a try: you will be horrified!
Hierarchy and semantics allows screen readers to understand the structure of your email. When the screen reader understands the structure, it will allow the user to navigate through the email. This is extremely important because it means users can now skip the articles they don’t want to read, and spent time on articles they do want to read. In other words: they are in control.
Support for accessibility features of email clients is problematic, but most emails have a link to an “online version”. In other words: it lets you read your email in a web browser. And yes: web browser do support a lot of accessibility features.
It would be great if you could share some of your experience in an article here at Litmus or on a blog. Not many people have to deal with these issues on a day to day basis unless they have clients like you mention, related to public organisations, governments etc. It's the same situation with the large majority of developers saying "stop supporting IE7, it is 2015!" versus the ones that understand there are clients that just have to have support for older browsers.
Yes, Maarten, please work up an article. I for one, am potentially facing doing HTML work for a large company that encompasses all people. The only way we'll start to learn more about this is to share.
Sorry, for the late reply, but i think i've got something better than an article. I'm working on an accessibility checker for email. it's noi as technical as most wcag checkers, and i hope it will give a quick impression about the accessibility of your email.
you can find it here: http://www.accessible-email.org
as said: it's work in progress, so let me know what you think. for now it can check "online-versions" of email, using an URL, but i'm planning to make also possible to paste some HTML into an simple HTML-editor and check that.
I'd be interested to know how accessible all the email clients out there are and whether creating semantically correct emails could help in that respect.
Agree with all the points raised by you guys already - while I would very much like to create a beautifully designed, semantically coded email, the hoops I'd have to jump through to make that design with semantic code would result in some pretty horrendous looking code.
I guess implementing simple things like
tabindexcould be a simple place to start with and enabling access keys - thought I've not done any testing to see if any of that works in email.I know this post is pretty old, but I was wondering if you're still using
tabindexin emails and exactly how you're using them. Our emails don't read horribly at the moment, but I'm working to make them better.