Silverpop - The "Bulletproof" Button
It appears you are using an older version of your browser. This site was developed to be progressive and future-compatible. Please take a minute to upgrade your browser for an optimal experience.
Skip to content
  • Subscribe:

The "Bulletproof" Button

blog post thumbnail image
by: Loren McDonald (@LorenMcDonald)
25 September 2009

We all know that image blocking by ISPs and email clients can wreak havoc with your HTML emails and affect click-throughs and conversions.

This is particularly a critical issue with image-based call-to-action (CTA) buttons. But all hope is not lost.

In our recent Webinar, "Using Innovations in Email Creative to Drive Increased Engagement," Aaron Smith and Lisa Harmon of the email creative agency Smith-Harmon outlined a great technique that enables email marketers to use image-based buttons but still convey the CTA if images are blocked.

Here is Smith-Harmon's "bullet-proof" button approach:

This technique uses the BACKGROUND attribute in HTML to place a graphic beneath font or link tags. For optimum results, also using a background color (with the use of the BGCOLOR attribute) will ensure the area still shows up as a color block even without images enabled.

It also will render in Outlook 2007 when images are disabled, either by purpose or without changing the default images-off setting.

Aaron and Lisa said they've tested this technique many times against purely graphical buttons. The vast majority of results come out in favor of the bulletproof button technique.

Here's what the HTML code looks like. In this example, "View the Catalog" is the text block that will appear even when images are disabled:

<table cellpadding="0" cellspacing="0"> <tr>

<td align="center" width="118" height="21" background="" bgcolor="#e1792e">

<a href="" style="color: #ffffff; font-family: Arial; font-size: 12px; text-decoration: none;">View the Catalog</a>

</td> </tr> </table>
View the Catalog

One final caveat: The width and height of the container object (in the example above, the TD tag around the link with "View the Catalog" text) should match the dimensions of the image being used.

Otherwise, if the container happens to be bigger, the background image will repeat in a tiled fashion (much like old Windows 3.1 wallpaper patterns).

If you or your email designers would like more tips and advice on creative innovations in email, download the hour-long recorded presentation and the slideshow.


Sign up Now!

Subscribe to IBM Marketing Cloud's Digital Marketer Newsletter!

Popular Categories

Top 5 Posts


To give you the best experience, this website uses cookies.

Continuing to use this website means that you consent to our using cookies. You can change your cookie settings in your browser at any time.
Find out more here or by clicking the Cookie Policy link at the bottom of this page.