Our Blog

Are you responsible for creating the emails for your company? Have you noticed when you are sending emails they have white gaps through the images? Avoid those ugly white gaps!

The solution for getting rid of them is relatively simple. If you have images stacked on top of one another, a simple fix to remove the gaps would be adding a style="display: block" attribute to each image.

Have other HTML design concerns?  Looking for HTML design tips and tricks?  Check out the Delivra HTML Email Guide created by the Delivra design team!

The HTML Email Guide was created to help with your HTML code and to assist in creating beautiful emails!

Recently, Delivra announced that it would be the first ESP to integrate with TabSite by Digital Hill Multimedia. The goal with this integration is to allow Delivra customers a way to easily create an email sign up form for their Facebook Fan Page and it allows new customers to sign up for Delivra email marketing services through TabSite.

With today's blog post, we'd like to clarify what this integration means for you and how you can make the most out of it!

1. TabSite Account. In order to use the two systems, users must have  a TabSite account. The great part is that TabSite is modestly priced and even offers a FREE option as well.

2. Email Icon. Next, find the email icon in the TabSite toolbar. Once you click on the Email Icon, an information box will pop up.
3. Sign In. The pop up allows you to :

a. Not a Customer: Sign up for Delivra email marketing services.

b. A Delivra Customer: Sign in and get access to your Delivra account.
4. Form Code: Once you've gained access to your Delivra account, you can access your signup code under Utilities:  Web Forms:  New Subscribe Form.  Click Get HTML.  Copy the code and then paste it into your TabSite Page Manager.

From there, TabSite will ensure that the form works on Facebook and those that sign up via your Facebook Fan Page will automatically be added to your email marketing list in the Delivra application.  What's even better is that you can take that signup form and brand it with headers and graphics to make it easier to find and act upon within your Facebook page.

Need help getting started? TabSite wrote a blog post that outlines these steps with great graphics.

Still having trouble getting started? Check out the TabSite How To section!

Lavon Temple | Marketing

In my line of business, I sign up for a *lot* of email newsletters.  Most of my subscriptions aren't necessarily based on an affinity for the brand, but rather a desire to stay in touch with how other companies--beyond Delivra's clients--are using email.

One observation I've made is that (in my inbox, at least) the bulk of email I receive from retailers is aimed at driving traffic to their e-commerce websites.  But brick-and-mortar retailers can use email as a way to motivate shoppers to visit their physical stores.   In fact, we recently added a feature to our HTML editor to allow retailers or retail brands to create their own scannable coupons that email recipients can print and use.

Our Creative Services team has been using our new Barcode Editor to insert barcode images into mailings they've designed for a regional retail chain in the New England and Mid-Atlantic states.   We're now pleased to offer this capability to all of our Professional and Enterprise clients, available by request to your Delivra Account Manager.

Partial screenshot of Barcode Editor

The Barcode Editor supports the most popular barcode formats supported by retail point-of-sale systems, including UPC, Code 128, and Code 39 (also called "3 of 9").  Designers can control the size of the barcode image, as well as the message to be encoded.   Barcodes are inserted into mailings as JPEG or PNG images, and can be oriented vertically or horizontally with respect to the mailing content.

If you choose to send barcoded coupons to your subscribers via email, keep in mind the following tips:

1. Before sending, test your barcodes by printing the email and scanning the barcode with actual equipment used at point of sale.   Without going into too much technical detail, let's just say that not all scanners can read all formats or dimensions of barcodes.
2. Be careful about the offers you send.  A Midwest grocery chain recently found itself in hot water with shoppers after it pulled the plug on an Internet coupon offer that proved too popular and was becoming too costly.  The coupon, for $10 off a purchase of $10 or more, amounted to a giveaway of free money, with the company realizing no benefit.  Once a coupon is published on the Internet, assume that it will be forwarded and multiple copies printed.  Consider using a "percent off" offer, or one requiring a higher minimum purchase amount, to limit your financial risk.
3. The "text" of your barcode--the letters and numbers it represents--can be dynamic.  You could load a unique coupon code for each recipient into a Delivra demographics field such as Text2_, and use a merge tag (%%Text2_%%) as the text to encode in your barcode.  When the mailing is sent, a unique barcode will then be generated for each recipient.  If your point-of-sale system supports it, this would give you a way to track which recipients' coupons were actually used, or to limit each unique coupon code to a single use.

Interested in learning more or getting started with bar codes in your emails?  Contact your Delivra Account Manager today!

Chris Broshears | Product Development

Tales from a poor confused artist who thought school was finally over

I’ve been working at Delivra since last summer. I started with a basic e-mail marketing I.Q. of about 12, and considering how lost I get during conversations within the company or with other big-wigs of this particular market, that number does not seem to have changed much.  Fortunately, as a designer, my job is relatively straightforward and simple, but it does come with some memory-testing challenges.

The whole process seems to be like a never-ending finals week. You spend a few days studying (building the email), turning in homework (sending the client your drafts), you take the pre-quiz (send the test email), then panic your way through the final exam (send the email).  It’s stressful, nerve-wracking, and worth everything when it results in a perfect A+ (a happy client). And while it probably isn’t as nail-bitingly terrifying as that Psychology exam you just found out about, it is enough to give you nightmares about being eaten alive by HTML.

Fortunately, cliff-notes and study-guides are available in the form of blogs. Those come in really handy when an HTML-monster project comes along, and your usual weapons of choice aren’t cutting it. There aren’t many challenges out there that another designer hasn’t overcome, and they’re more than willing to help a clueless fellow out.

Before your next test (email), here are some things to memorize that'll help you out:

1. Paragraph and Header tags are evil. They sound like a brilliant idea, but really, they are not to be trusted. If you’re wondering why you have so much space between text, images or just space that doesn’t need to be there, chances are there is a <p></p> or <h1,h2,h3,h4,h5,h6></h> somewhere in your HTML code. P-tags will just show up uninvited if you hit enter after a sentence. Instead of enter use shift + enter; this will enter a break tag or <br />, which will move the cursor to the next line without inserting space that has no business being there. Also, instead of using header tags, just resize the text to match the size of your choice. Painless and a lot less hassle.
2. Keep your tables simple. You would be amazed how much havoc a complicated table can wreak. I got a lot of hate from an email I was working on, and could not figure out why until fellow designer Celeste looked at my code and pointed out how ridiculous my table was. I had all kinds of merged cells and spacing issues that looked ok in Dreamweaver, but neither email client or web browser were feeling it.
3. CSS: Embedded and External = Bad, Inline=Good. Styles in e-mail are becoming more and more common, but knowing which ones can or can’t be used is a little tricky. Not all email clients are created equal, and most clients treat CSS like a weird cousin who wasn’t invited to the family reunion but came anyway.
4. Convert Word Document or Copy to Plain Text before pasting into HTML editor. Doing this helps to prevent weird symbols popping up randomly throughout your email. No more question mark apostrophes for you!  Not sure how to do this?  One way that I often do this is to drop the text into Notepad, which is an application listed under your Accessories of your computer (Start | Programs | Accessories).  You can then select Edit/Paste from Notepad and take it right into the HTML editor without any pre-defined formatting that might not otherwise work in an HTML version.

Hope this helps you as much as it helped me!

Peace out!

Abby Alexander | Design Services

One of the most common questions fielded by our Support team goes something like this: "My email looked just like I wanted in the editor and when I tested it, so how come it didn't look the same for my recipients?"

It's a common misconception that HTML is a "standard."  Web developers have known for years that different web browsers (Internet Explorer, Firefox, Chrome, Safari, etc.) interpret HTML in slightly different ways.  I like the way this web design tutorial puts it:

Your Web browser is a translation device. It takes a document written in the HTML language and translates it into a formatted Web page. The result of this translation is a little like giving two human translators a sentence written in French and asking them to translate it into English. Both will get the meaning across, but may not use the same words to do so.

There was a time when browser compatibility was a bigger problem for Web page designers than it is today.  Years ago--during the so-called "browser wars," when Microsoft and Netscape were competing for market share--both browsers added their own proprietary "extensions" to HTML, instructions that only worked in their web browser. The difficulty faced by designers, trying to write HTML that would look good in either IE or Netscape, gave rise to a "Web Standards" movement, which held that:

If Netscape and Microsoft persisted in building ever–more incompatible browsers, the cost of development would continue to skyrocket, tens of millions would find themselves locked out, and the Web would fragment into a tower of digital Babel. In fact, we said, it had already begun to do so.

Adoption of Web Standards by the browser makers has eased the burden of compatibility testing on Web page designers.  But what about those who write HTML for email rather than for Web sites?  Unfortunately, there hasn't been widespread adoption of standards among different email clients (Outlook, Yahoo!, Gmail, etc).  Worse, some of the recommendations of the Web Standards movement aren't fully applicable to the current state of email clients.

For example, one of the principles of the Web Standards movement is that HTML should only be used to define document content and structure, while CSS (Cascading Style Sheets) should be used for formatting.  Therefore, use of HTML tags like <font> for formatting is no longer recommended.  And while the <table> tag still has a purpose, it has nothing to do with aligning and positioning text on the page. But if a designer tries to apply those recommendations to email, they're not going to be pleased with how their message looks in, say, Outlook 2007, or Gmail, or Lotus Notes.

So what's an email designer to do?  May I suggest:

1. Test, test, test.  Set up accounts on the free web-based email services, and use them to preview your email before releasing it to the world.
2. Use tools like EmailAdvisor, which send your email to a seed list of addresses, then provide you with snapshots of how the HTML message looked in each of several popular email clients.  Or...
3. Use a simulator that doesn't require sending to a seed list--this is especially useful when the designer is not the same person who will be triggering the email send (and therefore doesn't have access to a seed list).  Our designers at Delivra find a tool called "Email on Acid" particularly useful.
4. Design for the lowest common denominator.  Our built-in HTML editor purposely does not generate code that uses the newest instructions.  That way, when you create an attractive-looking mailing, you have fewer worries of it breaking in, say, Outlook 2007 due to lack of support for certain CSS features.

Chris Broshears | Product Development

ALT text is not something to ignore when putting together your email creative. Not all email clients will display your images’ ALT tags, but they’re still worth using. In the likely event that a recipient will have images blocked upon viewing your email content, the ALT text is what they will see first; if the text is visible and enticing, more recipients will open and click through your mailings.

It’s best to make your ALT text concise and clear, but try to use enough text to convey the content of the image. If you have a shiny orange image button covered with text and photos of packages, set it’s ALT attribute with just the text needed to convey the value – i.e. “50% Off Shipping - Click Here” (assuming you were, unfortunately, unable to use a bulletproof button in the first place).

Most email clients will simply cut off the ALT text relative to the size of the image. Keep small images’ ALT texts set to just a word or two, if possible, and limit your more descriptive lines of text to your bigger images.

Both the left and right versions above were coded at the same width, but the image on the right side did not have height and width attributes set (having these set is a best practice). As a result, most email clients stretched the image space to allow for all of the ALT text, ignoring the tables' set width and breaking apart the email content.

More interesting words from the industry on using ALT tags for email:

• Using ALT tags properly in emails and XHTML
• HTML Email + Alt Tags = More Bagels Sold
• Using ALT Tags in Email Design

Questions? Have another email design topic you want to hear about? Feel free to shoot me an email.

Celeste Odell | Design Services

Let’s say you’re just about done putting together your email content. It’s approved to send out and you’re proud of how great it looks. You send yourself a test email for one final check… and it’s completely blown apart! What do you do? Before you light your computer on fire and throw it at the nearest intern, check to see if it’s one of these top 4 issues.

• Are you using only inline CSS and HTML tables? If your text is displaying without all your fancy colors, sizes and fonts, you’ve probably formatted them using an embedded or linked style sheet. Make sure all your content is formatted with only inline CSS or HTML. Stay away from using CSS for positioning – use old-school tables instead.
• Were your images saved at the correct size before you placed them in your HTML? An image saved at a size too big for your email template may break it apart… even after you’ve set the correct sizes in your HTML. A few email clients will ignore your HTML image attributes, so even though you’ve sized down your beautiful 1200px by 1700px banner, it may display at its original size – stretching out the rest of your email. Save your images at their final sizes before you place them in your email content (or Delivra’s Media Library).
• Does your HTML contain lots of nested tables or tables with merged cells? Excessive use of nested tables (tables set inside tables) or complicated tables with merged cells can cause problems. Plan ahead and lay out your content before you take it into HTML. The more you tinker with your HTML as you put it together, the more likely it is that problem-causing invisible elements will be left in it.
• Are you using background images or colors? Code placed in or above the <body> tag can be stripped out – so any background colors or images here may be lost. It’s safe to use background colors in your tables and table cells, but some clients won’t display background images regardless of whether it’s set in HTML or CSS. Place a background color along with your background image just in case (especially if you have white text over it).

For more tips on coding your email content, check out Delivra’s HTML Coding Guide or our HTML Editor Help Guide.

Celeste Odell | Graphic Design 

When creating the content for your HTML emails, the dimensions are an important aspect to consider. The size and layout can have an effect on the success of your campaign. Below, I’ve listed a couple of basic pointers to keep in mind.

Width
The typical email has a width of 600 to 650 pixels. This may sound pretty small – but if you create your email any wider, your recipients may have to scroll both vertically and horizontally to view the email in its entirety… making it a pain to read. Create your email any narrower and your email may become very long in order to fit all of your content.

Despite the width norm of 600-650 pixels, formatting emails horizontally seems to be a growing trend among some retailers. The very helpful Smith-Harmon blog has highlighted various designs in horizontal format, which seem to be generating good results. (It’s worth noting that with these designs, the content usually isn’t very tall – so most recipients would only have to scroll in one direction. This is a good plan; the more you ask your recipient to do in order to read your message, the more likely they are to lose interest).

This just goes to show that it could be worth it to test out different variables in your email creative. Every group is different, and what doesn’t work for one group might create great results for another!

Not only does this email include pertinent information above the fold, the first line is coded in HTML – so the recipient wouldn’t have to enable images to see the text right away.

(click image for full view)
Designing for the Preview Pane: The 250-Pixel Rule
Many email clients will display the top portion of your email in a preview pane, which recipients will view before deciding to read the rest of your email. The size of this preview pane varies depending on the email client (Hotmail/Outlook 2007/etc.) and the recipient’s individual settings, but you can generally expect that most of your recipients will see the top left 250 pixels of your email in their preview panes. With that in mind, it’s a good idea to include compelling HTML content in this area to entice your recipients to read further.

Stay tuned for further posts covering email design basics! Have a topic in mind? Feel free to drop me a line.

Celeste ODell | Creative Services & Design

Today Delivra publicly announced the availability of our new social media integration that I hinted at in an earlier post.  I wanted to go beyond the press release and our whitepaper to explain our philosophy of social media integration, and why this integration is so important to our clients.

Much has been written recently about whether the rise of social media marketing comes at the expense of email marketing.  Experts have staked out positions ranging from "email is dead; long live social media" to "email has staying power; social media is just a fad."  We take the more moderate view, that email vs. social media doesn't have to be a zero-sum game.  For Delivra, introducing social media integration isn't about hedging our bets against the demise of email.  No, we think social media integration has the potential to enhance the value of email marketing, rather than detracting from it.

As our marketing manager puts it, "email is the original social."  Consider the Facebook account.  I sign into it with...my email address.  I have an inbox in which I receive private messages from my friends, and I can also subscribe to notifications sent in bulk by people or brands that interest me.  There's a list of my contacts (think "address book") to whom I can publish content or links that I think might interest them.  Now, Facebook lays on top of these basic functions some unique features--I can't play Mafia Wars or Bejeweled Blitz against my friends via email--but at it's core, it has more similarity with email than is commonly acknowledged.  In fact, I have my own Facebook account configured to send copies of the most important notifications to...my Gmail account.

So we added social media integration to our email marketing platform, we approached it from the perspective that email and social networks are complementary--two sides of the same coin.  It's important to give marketers a simple way to insert HTML code for creating "share this" links in email content, and we've done that, as have many other ESPs.  But more important to us is collecting data about sharing of social network sharing and feeding that information back into our system, to make email marketing more effective.

For example, our integration tracks exactly which email recipients are sharing which emails, from which email campaigns, to which social networks, and how many people on each network--beyond the original recipient--viewed that content.  When an email message is shared to one of these networks, we're also tracking how many people on those networks--beyond the email recipient--have viewed it.  Not only is all of this data available to the user in reports, they can also segment their mailing list, to send targeted messages to individuals based on their sharing behavior.  If you have recipients who post links to your content on Twitter, you can follow up and invite them to become followers of your brand on Twitter.  If a particular recipient is generating a lot of page views--we call them "impressions"--of your content on Facebook, then you likely want to engage with her differently than you would the subscriber who hasn't opened your messages in months.  And if you notice that some of your mailings are being more widely shared than others, you have a basis for analyzing what gave those messages their viral appeal and applying similar techniques to future campaigns.

At Delivra, our core competency is email.  Always has been, always will be; that's why the tagline "We Know Email" is part of our logo.  But knowing email means more to us than just MIME-encoding, handling unsubscribes, and opening SMTP connections on port 25.  If there's a technology that has the ability to work alongside e-mail marketing and make it more valuable--whether that's social networking, video, or something else entirely--we're going to make it our business to know that, too.

Chris Broshears | Product Development

NOTE FROM MARKETING:  Chris's Bejeweled score is consistently at the top of the leader board here at Delivra regardless of how long I play the game!

I don't know about you, but I was not born a designer.  I have learned quite a bit in the years since I have been marketing and even more so since I have been creating email marketing campaigns.  One of the greatest things I learned over time is to find valuable resources that you can call on from time to time.

Now with almost every email service provider out there, including Delivra, marketers are able to create visually appealing design that aligns well with brand guidelines and renders well to the end recipient.  With the advent of WYSIWYG editors, a busy marketer like me can easily drop images, copy and links to create that final email campaign.  The key now is to find resources that will help make that job as easy as possible.  Here are a few that I have found and use frequently:

Images: While most organizations have logos and standard in place for colors and fonts, images always help make an email more impactful and engaging.  Copy is king, especially in the email world where you cannot always predict how your emails will be rendered, but you do want to have an HTML based email with images as your first choice with a text based backup.  Here is an economical site I use to find images that fit what I want to communicate:  istockphoto.com.

HTML Cheat Sheets: While I am certainly no code developer, there are times when I may need to troubleshoot why the HTML code is not rendering correctly in my testing.  I found GoSquared.com as a great resource with cheat sheets that I could reference to fix any code errors I might have.

Witty Quotes & Sayings: Not sure if you feel this way, but after writing so many different types of communications, I am often stumped with creative inspiration.  I reference Brainyquote.com often for a relevant quote or for inspiration in my writing direction.

With tools like these, I can design with the best of them.  And last but not least, here's a list of even more!  I never claim to be an expert, but I certainly know how to find tremendous resources that help me get the job done.  Now design away without the worries and remember to keep it simple and keep it relevant to your audience.

Juggling a million other marketing items like me?  Strapped for time?  Short on inspiration?  Let us help!  Did you know that we  offer full service creative design services? (here are a few samples)  At Delivra, your success is our primary goal, so leave the work up to us and we will make sure your email campaigns are dynamic & engaging.

Carissa Newton | Marketing