0
Do you care about semantics in HTML emails?
We are already making Emails with tables which is difficult for Screen Reader users to use so in my opinion using Seamantic HTML tag doesn't add any value to HTML. I guess for any block level element like h1 - h6, P we should use <div> only. By using div will also help us to get better consistency as some email clients have problem with margin and padding of P
Would like to know your thoughts on this.
I really care about semantic HTML in emails. To me, this is the perfect way to build a gracefully degradable email. This means that you can target more modern clients and ensure that your content stays understandable on older clients. Here's an example of a responsive email template I coded for a client without a single
<table>
(except for a few in[mso]
conditional comments).As you can see, even though Lotus Notes 6.5 can't handle the use of CSS, the content is still perfectly readable for a user stuck on this client, and the use of
<hn>
tags ensure a great content hierarchy.I use
<p>
,<ul>
,<li>
, and<h1>
to<h6>
tags all the time. And beyond a few default styles that you need to override here and there, I see really no reason at all to not use semantic HTML in emails.Do you mean that you code email layout structure using <div> not <table>?
It depends. But if possible, I always favor
<div>
s instead of<table>
s. If you have a simple layout with a single layout, it makes a lot of sense to use<div>
s as their default behavior will be to stack on top of each others. You can usemargin
andborder
on<div>
(officially part of Outlook's COREEXTENDED CSS support), but the rendering can sometimes be buggy on Outlook's Word rendering engine (and it doesn't supportpadding
on<div>
s either). So only then would I rely on<table>
for layout (and if possible only for Outlook using conditional comments).