{"id":40,"date":"2026-06-13T20:58:43","date_gmt":"2026-06-13T20:58:43","guid":{"rendered":"https:\/\/www.vinamrmishra.com\/?post_type=lab&#038;p=40"},"modified":"2026-06-13T21:14:35","modified_gmt":"2026-06-13T21:14:35","slug":"bulletproof-email-boilerplate-vml-mjml","status":"publish","type":"lab","link":"https:\/\/www.vinamrmishra.com\/?lab=bulletproof-email-boilerplate-vml-mjml","title":{"rendered":"Bulletproof Email Boilerplate (VML + MJML)"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">A reusable boilerplate for building HTML emails that render consistently everywhere \u2014 including Outlook&#8217;s Word rendering engine. Includes VML fallbacks for background images and bulletproof buttons, a hybrid\/spongy layout that degrades gracefully, and dark-mode handling. Grew out of building 200+ production emails at Cvent.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Demo URL: <a href=\"https:\/\/www.vinamrmishra.com\/wp-content\/uploads\/2026\/06\/BULLET1.htm\" data-type=\"link\" data-id=\"https:\/\/www.vinamrmishra.com\/wp-content\/uploads\/2026\/06\/BULLET1.htm\">Download this HTML and use it!<\/a><\/li>\n\n\n\n<li>Stack: HTML, VML, MJML, Litmus<\/li>\n\n\n\n<li>Status: Live<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Sample: the bulletproof CTA button<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!-- Bulletproof button: Outlook gets VML, every other client gets a padded anchor --&gt;\n&lt;!--&#91;if mso]&gt;\n&lt;v:roundrect href=\"https:\/\/example.com\"\n  style=\"height:48px;v-text-anchor:middle;width:220px;\"\n  arcsize=\"14%\" stroke=\"false\" fillcolor=\"#1f6feb\"&gt;\n  &lt;w:anchorlock\/&gt;\n  &lt;center style=\"color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;\"&gt;\n    Primary action\n  &lt;\/center&gt;\n&lt;\/v:roundrect&gt;\n&lt;!&#91;endif]--&gt;\n&lt;!--&#91;if !mso]&gt;&lt;!--&gt;\n&lt;a href=\"https:\/\/example.com\" style=\"background-color:#1f6feb;border-radius:8px;\n   color:#ffffff;display:inline-block;font-family:Arial,sans-serif;font-size:16px;\n   font-weight:bold;line-height:48px;text-align:center;text-decoration:none;width:220px;\"&gt;\n  Primary action\n&lt;\/a&gt;\n&lt;!--&lt;!&#91;endif]--&gt;<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>A starter template for HTML emails that survive Outlook \u2014 VML fallbacks for backgrounds and buttons, tested across major clients.<\/p>\n","protected":false},"featured_media":0,"template":"","meta":{"footnotes":""},"lab_type":[],"class_list":["post-40","lab","type-lab","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.vinamrmishra.com\/index.php?rest_route=\/wp\/v2\/lab\/40","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vinamrmishra.com\/index.php?rest_route=\/wp\/v2\/lab"}],"about":[{"href":"https:\/\/www.vinamrmishra.com\/index.php?rest_route=\/wp\/v2\/types\/lab"}],"version-history":[{"count":3,"href":"https:\/\/www.vinamrmishra.com\/index.php?rest_route=\/wp\/v2\/lab\/40\/revisions"}],"predecessor-version":[{"id":49,"href":"https:\/\/www.vinamrmishra.com\/index.php?rest_route=\/wp\/v2\/lab\/40\/revisions\/49"}],"wp:attachment":[{"href":"https:\/\/www.vinamrmishra.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=40"}],"wp:term":[{"taxonomy":"lab_type","embeddable":true,"href":"https:\/\/www.vinamrmishra.com\/index.php?rest_route=%2Fwp%2Fv2%2Flab_type&post=40"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}