EmailDirect Admin Blog

EMAILDIRECT BLOG MOVED TO EMAILDIRECT.COM/BLOG

2011-11-14T11:56:29-08:00

If you are reading this please go to http://www.emaildirect.com/blog

Email Coding Guidelines – Part 2: Picking Inline CSS Apart

2011-04-28T10:13:14-07:00

In my last post, we picked apart tables and went over some ways to simplify your code with nested tables. While you don't have to read Part 1 to understand what I'll be talking about here – it helps to have some knowledge about tables and their tags.

This time, we'll be building a bit on tables with styling using inline CSS.

CSS – or Cascading Style Sheets – allows you to format the layout, colors, fonts and in some cases the behavior of elements in an HTML or XHTML document.

Typically CSS is used either internally – inside the same HTML document, before all the HTML or it's included externally – outside the HTML document but referenced in the HTML.

In the Land of Email, CSS has to be inline – inside the HTML document, but throughout the HTML. Never use an external style sheet! Save internal styles for hacks like Outlook background images and Hotmail centering – these hacks provide backup solutions if the email client strips the CSS.

Because the CSS isn't grouped together (internal) or attached through a link (external), inline CSS can be quite redundant.

I can definitely understand when I see some of our clients using internal or external CSS – it's all in one place, easy to see and maintain, and makes it a lot simpler to format elements in the HTML. Later in the post, I'll show you some ways to make inline CSS easier to handle and way less frustrating.

Because you're dealing with email, there are certain CSS attributes that just won't work and there's certain ways some CSS needs to be applied. I'll be talking about a few of the most common CSS issues we see when evaluating or restructuring code.

Apply styling to a table

Looking at the two bits of code above, the first has styling applied to a table and the second has styling applied to the table's cell. While both could work, the styling applied to the table cell is the correct method. In general, the closer CSS is to the element it's styling, the better chances it will render correctly (that's where the "cascading" comes from!). In email, cells are like divs so styling the cell would be the equivalent to styling a div.

Borders are a basic CSS attribute that seems to render just fine everywhere except for Hotmail.

Here's the code that could be used:

Here's the rendered results:
From Outlook 2007

From Hotmail - where'd the border go?

There is a workaround, it's not the shortest, but it's fairly easy:

Nested tables are back! This time, they can be used for "faking" borders. The slightly larger table has a regular HTML bgcolor applied to it (CSS background-color works fine here too) with a one pixel padding applied. The smaller table has a white background and is set to 100%. Using 100% lets the table stretch out automatically to the one pixel padding of the outer cell and it eliminates having to set a specific width to the smaller table. If you want a thicker border, simply add more padding to the larger table.

When it comes to centering the creative in the middle of the subscribers screen, we often see the HTML tag <center></center> wrapped around the creative. We recommend not using this method – email client support is unstable. Instead, add an align="center" attribute to the main table, and that's it!

For creatives that have a full screen background color (notice I said color, not image), we usually see either the HTML bgcolor or CSS background-color applied to the body tag. Sometimes that can be stripped out if the email client has its own plans for the body tag; so to combat this, use a 100% table around your creative and apply either a bgcolor or CSS background-color to the 100% cell.

The background-image CSS attribute, in my opinion, should be supported by all email clients because it is a crucial attribute that can make or break an email creative. Outlook 2007 and Gmail will remove a background-image so while it will work in other email clients, include a background-color as a backup for the absence of the image. Of course, there's a workaround to this as well – I won't go into details about it in this post because someone already has! Caution though: this is an advanced workaround and not for the faint of heart - be prepared to experiment!

Applying styling to content

This is where most of the redundancy of inline CSS happens, along with the frustration. Before we look at ways to ease the pain, let's go over some of the most common styling issues we come across.

Use the tag instead of the tag. Some email clients that are a little more advanced when it comes to CSS support will see as a depreciated tag – and we've even seen it trigger spam filters. Also, when you're styling your font sizes, use pixels for exact size. Using ems or percentages will render differently in each email client.

We also recommend using two tags to make paragraphs rather than the tag. Often a client will apply styling to the tag and find that everything is all smashed together without styling in Outlook 2007 – fun times!

For styling your content for aesthetic reasons, check out this post I wrote a while back on Typography. It provides CSS tips and tricks that you can apply to make your content look neat and professional.

You've probably already cringed at the idea of having to repeat the same CSS style over and over again. To help the burden of inline CSS, there are options:

Rule of thumb: content first, styling second!
Make your creative using internal CSS, call the classes throughout your HTML document and before you upload or copy and paste the code into your ESP provider, find and replace your class name with the actual styling attributes.

For example, if you have a class called "articleTitle"
.articleTitle { font-family: Arial, Helvetica, sans-serif; font-size: 11px; }

and you've called that class in your HTML:
 The Title 

You can specify in your code writing program to find class="articleTitle" and replace it with style="font-family: Arial, Helvetica, sans-serif; font-size: 11px;"



Be sure to include the "class=" and "style=" part otherwise, it gets really ugly!
Even easier, you can run your code through an inline CSS converter. I like the Inline styler by Torchbox because your file can have either internal CSS, external CSS or both! It even tells you a percentage of email clients that will support your new output code and what email clients won't support what CSS attribute

It's unfortunate that most email clients don't support all CSS because it would let email designers and coders do outrageous and fun things in an inbox. The upside is that the limitations present opportunities to use what we can do in some really cool ways!

I'm a big Google fan so I always encourage a Google search – this time on HTML for email. If you're comfortable with HTML enough to make your own email creatives, it's crucial that you understand how coding for email works. It will help your deliverability and in some cases, help click rates!

Until next time - happy designing!

Optimize Social Media Content with Keywords

2011-04-26T12:00:00-07:00

If you’ve been doing your Social Media research, you’ve probably found that keywords are proving to be the most important factor when it comes to improving online visibility. By researching keywords, you can learn exactly what your consumers want. Not only will you discover what they are searching, but how they are searching. By using Google’s SEO tools, you can see what people are searching for related to a particular keyword or phrase. Even further, you can track patterns and trends over time, by product category, geographic region, etc. This insight will help you optimize your content for the present and future.

According to Ben Castelli at Capture the Conversation, keyword research is crucial because it brings together search engine optimization and social media optimization to increase “awareness, traffic, leads, revenue and brand advocates.” Once you identify the keywords being used, searched, tagged, etc., in your community, you can then incorporate them into your content and improve your overall online presence.

Keywords obviously provide useful insight to the world of your consumers, but why are they the focus instead of overall content optimization? Monica at Social Strategy1 explains that the reason keywords have become so pivotal to content optimization is due to the restrictions of Social Media. Such things as character limits and the short attention span of online users are the reasons why content must be more focused and to-the-point. And what better way than using Keywords to get you idea across in as few words as possible?

Of course, your content still needs to be engaging and relevant. The goal is to incorporate the popular keywords into your content seamlessly. This way you are still delivering a good message, but it is sprinkled with popular phrases that ultimately increase search engine visibility and site traffic. Doing your keyword research is well worth the effort!

~Roxanne

Gmail & Hotmail make updates to their spam filters

2011-04-20T16:25:50-07:00

We have heard that Gmail and Hotmail made recent updates to their filters which is sending some people that have been getting delivery in the past, to the junk folder. One of our partners ReturnPath released the following blog post:

Some of our clients have recently inquired about increased bulking at Gmail and Hotmail. Additionally, senders and ESPs throughout the email marketing industry have noticed an increase in bulking at Gmail and bulking and deferrals at Hotmail. We have confirmed with both Gmail and Hotmail that they made recent updates to their filters, so we shouldn’t expect these issues to resolve on their own. Senders experiencing a decrease in inbox delivery at Gmail or Hotmail will need to take steps to address mailing practices in order to improve delivery.

The following are recommendations for senders who are experiencing lower-than-usual inbox delivery:

Follow Hotmail’s published “Policies, Practices, and Guidelines.”

Remove inactive subscribers from your list – users who haven’t opened, clicked, purchased, or been otherwise active with your mail in some period of time.

Consider adjusting the frequency and/or cadence of your mailings.

Ensure your mail is properly authenticated.

Immediately process all bounces and complaints and review complaint trends to determine the drivers of subscriber dissatisfaction.

Leverage Hotmail’s SNDS tool to track your sender reputation.

Check your content prior to deployment to ensure your URL reputation is positive and review spam filter results.

I will post again once I know more.

-Richard King

Fresh Content Ideas to Improve your Email Program

2011-04-19T08:00:00-07:00

Sure, receiving an irresistible offer or generous coupon is great, but you need to think outside of the box when it comes to your email content. People receive numerous emails every day and most of them fall into the promotion category. This kind of email can get stale and the key to a successful email marketing program is giving your subscribers relevant and quality content. A special offer may be what reels in a first-time customer, but fresh and engaging content is what will keep them coming back.

The trick is to give your subscribers something that they don’t normally see in email. Of course, producing unique content is much easier said than done, so here are some ideas for your next email:

Recipe
How-to article
Company blog posts
Case study
Stories and anecdotes
Opinion pieces and reviews
Best of
Survey
Event information
Interview
Employee Bio
Q & A
Quiz or fun test
Cartoon or comic

Try including one of these content ideas into your next email campaign and hopefully you will see boost in subscriber engagement. That is not to say that you should stray from the types of emails that you usually send, but it can’t hurt to incorporate new content and see how your subscribers react. And remember, you know your audience best, so make sure that the content is both valuable and relevant.

~Roxanne

EmailDirect's VP of Business Development to Moderate at The Power of eMarketing Conference

2011-04-17T15:21:24-07:00

Sacramento, CA (PRWEB) April 17, 2011

The eMarketing Association announced today that Kristine Dobson, Vice President of Business Development for EmailDirect, will be moderating two separate panels in San Francisco on April 19th and 20th. EmailDirect is a Sacramento-based corporation that provides web-based software for online marketers to easily manage their email marketing programs. The company's core focus is to provide robust email marketing tools paired with pro-active, hands on customer service. Dobson, who has been with EmailDirect since its inception in 2005, oversees large-scale email marketing programs including Fox Mobile and Big 5 Sporting Goods.

"I am excited about the opportunity to participate in this conference because it brings together so many industry leaders. At a conference of this magnitude, everyone walks away with valuable information and new ideas. As a panel moderator, I will not only get to hear others speak about the latest topics and emerging trends, but I will also get to share my knowledge about the industry as well," says Dobson of her involvement in event.

The Power of eMarketing conference, which is designed for senior marketers, will cover such topics as email list-building techniques and processes, social media trends, reputation management and emerging marketing technologies. The speakers include such industry experts as Experian Vice President of User Experience, Janice Rohn, Loren McDonald, the Vice President of Silverpop, and Lyris Senior Vice President, Tina Stewart. More information on the conference is available at http://www.emarketingassociation.com/2011/SF/index.html.

About EmailDirect

Founded in 2005, EmailDirect, Inc. provides a powerful, hosted, direct email marketing platform designed for mid to large sized email senders to manage intelligent email marketing programs. In addition to the hosted email marketing solution, EmailDirect provides hands-on support to every client through a dedicated email marketing consultant. As a full service email marketing company, EmailDirect offers clients a wide range of email marketing services including: graphic design, HTML email coding, email creative optimization, email campaign management, scheduling and reporting analysis.

About the eMarketing Association

The eMarketing Association (eMA) is an organization of individual marketers, companies and governments committed to the advancement of marketing in the digital age. The eMA provides marketing resources, certifications, educational programs and events to its members and the marketing community. Each year the association holds two conferences within the United States in a goal promote marketing education, research and recognition. With members in over 40 countries around the world, the eMA is one of the largest associations of eMarketers.

EmailDirect, is a Sacramento, California based corporation which develops cutting edge email marketing programs for permission based marketers.
# # #

Back to Basics: Don’t Skirt the Subject

2011-04-15T13:10:54-07:00

For those of you who have been in the world of email marketing for some time now this may seem like a waste of time, but in reality, too many businesses are missing out on opens and potential customers because of a lack of time spent on the subject line of an email campaign. Here are some key ingredients to a winning subject:

Avoid words like “FREE”, sale, discount, %’s, $ signs, etc. that may trigger spam filters.
Create a sense of intrigue.

* Don’t give away the content (you want subscribers to open the email to view the message).
* Make sure the subject is in fact relevant to the content/message you provide.

Include the date (e.g. April 22, 2011) to give your subject line an editorial feel.
Keep your subject line under 50 characters. Anything more than that and it may get cut off in your subscribers email client.
TEST FOR INBOX DELIVERY!!! You could have the best subject line in the world, but if it doesn’t reach an inbox…it won’t do you any good.

If you’re not convinced intrigue is the best way to reach your target audience, A/B test different subject lines. Test a direct approach (e.g. “Eco Friendly Yoga Mats – date”) against a subject that leaves a bit more to the imagination (e.g. “Save the Planet One Pose at a Time – date”). Be sure you use the same creative, send on the same day at the same time, and the only change the subject! If you have too many variables you won’t know for sure which was the cause for the difference in response.

I’ve suggested this strategy to several of my clients when they asked how to increase Open rates. Here’s a few examples of EmailDirect senders A/B Test results:

Direct	Vague	Winner/Loser
5% off orders placed by midnight	Are you about to run out?	Vague opened 6% higher than direct. CTR was 1% higher for Direct vs Vague, but Vague increased overall ROI by 3%
Free Shipping Today Only	For a Limited Time Only	Vague opened 3% higher than direct. CTR was .4% higher for direct vs Vague, but Vague increased overall ROI by 4.3%
$17 Off All Apparel	Rehabilitate Your Wardrobe	Direct and Vague had equal opens. CTR was 4% higher for Vague and increased ROI of 6%

In example #1, my client lost a few clicks for the group of subscribers receiving the vague subject line, but the increased Open rate more than compensated resulting in more profits at the end!

In example #2, the CTR was nearly identical so the extra 3% in opens generated 4.3% more revenue than the Free Shipping subject line.

In example #3, the opens for both Direct and Vague subject lines were the same, but the higher CTR and ROI for the Vague subject show us that subscribers who opened the email without any specific product in mind, in this case, were more likely to make a purchase based off of a Vague subject line. Those who opened the Direct campaign were more likely to only search for a specific product and when it was not found in the creative, lose interest in any and all other featured products.

These are examples and the only way for you to know if this works with your subscribers is to A/B test!!!

Happy A/B Testing!

~ Katie

Help security! Someone is stealing my email!

2011-04-05T02:34:53-07:00

Uuhhgg, another blog article about the security breach over at Epsilon. In fact, in doing some research, this might be the second time in the last 6 months they were breached with potential to actually stop it as seen here. Then again who knows! Who cares, right? Well we care and so should you!

Email Service Providers and anyone holding large email lists for that matter are prime candidates for first round attacks to gather information to launch mischievous “spear phishing” campaigns on consumers and grandmothers alike. So it is very important that ESPs take these security breaches very seriously! However, just like any security measure put into place as I was taught in the Coast Guard is the importance of educating not only the individuals building the virtual walls, but the users around them.

Although it is true attacks are becoming increasingly sophisticated in their execution and maliciousness, not every campaign is fueled by cold Chinese food in a dank bedroom filled with empty Jolt Cola cans and the faint repeated beat of DJ Keoki in the background. The truth of the matter it’s far less romantic in its imagery and is nothing more than an uneducated user clicking on a DHL package notification with a zip file attached. As one of the members in charge of creating a secure environment here at EmailDirect I can’t stress the fact enough that we all need to play a part in insuring our data is safe.

EmailDirect goes to great strides to insure all our clients data is protected and we will continue to fight the good fight but I also want to pass on a few things that can help insure all the work we are doing on our side doesn’t go to waste. After all, the Qin Dynasty spent centuries building the Great Wall only to have a turncoat general simply let the Manchu horse soldiers ride right through to Beijing. So even though you might be surrounded by a “Great Wall” it doesn’t necessarily mean you always remember to keep the door locked. Here are a few things you can do to compliment the security measures EmailDirect does on its side to insure your data doesn’t get stolen.

1. Never give your password to anyone else and never write it down on a little sticky note and place it under your keyboard. Keep in mind we allow you to create Role accounts which allows you to provide limited access to others without allowing them to have full control of your account.

2. Be sure to pick a strong password that is at least 8 characters long and has a mixture of upper case letters and numbers. I know 8 characters is a lot but in the Military we have 14 character minimums!

3. Be sure to change your password every once in a while. We suggest once a month but never keep a password for longer than 3 months.

4. Never open an attachment from an unknown user or from anyone when you’re not expecting it. Most unauthorized breaches start from the simple phishing attack.

5. Use common sense and don’t be lazy when it comes to securing your data. This means don’t leave your email lists on your desktop or on a flash drive in the center console of your car.

Unauthorized access sucks, especially when it’s your account and your data. So be sure to make every effort to help keep your precious assets protected. We’ll do our part and continue to come out with new prevention measures but it will all be for nothing if you give a thief the keys to your car.

Get Support Whenever You Need It

2011-03-31T17:00:00-07:00

Check out our newly redesigned online support center! And don't worry, the one-on-one service we provide through dedicated Email Marketing Consultants isn't going anywhere.

We understand our customers appreciate a knowledgeable single-point-of-contact at EmailDirect and we have no intentions to change that. Our online support center is for fast answers and system documentation, any time you need it, 24/7.

LiveChat
Got a quick question? Let's chat about it! Live chat with an EmailDirect expert 9AM – 5PM PDT (west coast time). Find our live chat button, when an EmailDirect expert is online and available, in the top-right corner, from the online support center.

Knowledgebase
Need details and documentation? Search through hundreds of frequently asked questions and documentation articles directly from the online support center.

Videos & YouTube
We've been cranking out tutorial videos. Take a look from either our online support center or by visiting EmailDirect's YouTube channel. If you are a YouTube user, be sure to subscribe to EmailDirect's channel to be notified as we upload new videos.

Email Coding Guidelines – Part 1: Picking Tables Apart

2011-03-31T10:05:38-07:00

We often have clients ask why their creative doesn't look good in their email client, but it did in Dreamweaver and in the browser while they were building it. When I look at their code, most times it looks pretty solid – so I'm sure they're shocked when we report back that the code needs to be restructured for email.

If the code looks good, then why redo it? Because only web browsers understand the code – not email clients. Email clients are from the old school; they like things done a certain way and won't understand all this new "mumbo-jumbo". Kind of sounds like someone's grandfather...

Back in the late 90's and early 2000's, websites were made using tables. This made for painful, frustrating, time wasting creation and maintenance. One could get lost in the sea of td, tr and table tags! Then one grand day, divs and CSS came along and made coding so much easier. We could update an entire website from one file; code became much easier to look at and made for quicker maintenance and ultimately happier designers.

While we've seen web browsers update to handle divs and CSS, email clients didn't jump on the bus. Even with the Email Marketing boom over the last few years, most email clients haven't embraced our lighter and more efficient way to code; in fact, a popular email client - Microsoft Outlook - reverted back even further with Outlook 2007, by eliminating support for some of the most basic CSS attributes. Maybe Microsoft has something against designers since we still have to deal with Internet Explorer 6 (yuck)...but I digress...

We have no choice but to learn the ways of the old school, but it can be difficult to wrap around the concepts because most of us designers and coders have been taught that tables are used for tabular data not for layouts.

These series of posts focuses on the most frequent issues that we address from our clients who like to get dirty with code, whether through evaluations of their code or restructuring the code for them. For this post, we'll be tackling tables, why we have to use them and the best way to use them.

I'm assuming that you understand how to use tables, even if you've only used them to display data – but you have a basic understanding of the tags used and how tables behave - or don't like to behave! Check this link out for a refresher course if you need one.

Why, oh why do we HAVE to use tables?

Just because they're used for email instead of websites now, doesn't mean the piles of table, row and cell tags disappear – it's still complicated! Yeah, it sucks. There's no getting around it because some email clients (like Gmail and Outlook) don't support the CSS float tag.

The float tag allows us to position divs to the left or to the right of its parent container to have better control of the flow and order of divs. These divs then house the content that make up a website, usually in more divs or some other type of block element.

In the Land of Email, cells are divs. Of course, in order for a cell to render properly, it has to be wrapped in a tr and then a table tag; that's just the rules. For a layout like this:

The code that would normally be used is:

While the CSS somewhere would look like this:

But since this is for email, here's what the code needs to look like:

Note that the align attributes used in the td tags sets the alignment of the content inside the cell, not the alignment of the cell itself. The order in which you add cells sets the alignment, so since the Side area is to the left, that cell is set first, then the Main area because it's to the right. The natural flow of cells are just like divs - from left to right, top to bottom.

There's a fun attribute inside the td tag for the header: colspan. This allows a cell that sits above or below a row that contains more than one cell (like the Side and Main area row) to completely span across the cells. Otherwise, the header cell would only be as long as the Side area cell.

Colspans should be used sparingly – they can get confusing after a while if you have multiple rows that will have different amounts of cells in them. We often evaluate code that gets lost somewhere because of colspans and rowspans all over the place. I NEVER use rowspans – they add a whole different level of confusion. To avoid the use of excessive colspans and rowspans altogether, use nested tables.

View nested tables like additional divs inside the Side and Main area cells.

Notice in this example, there is no colspan in the cell for the header. That's because the next row contains a nested table which then has the two cells. Because the nested table is its own separate table, it doesn't affect the main table so it eliminates the need for colspans and rowspans.

Nested tables also take care of another issue we commonly see: spacer gifs. Usually if I see excessive use of spacer gifs, it's an indication that the client has used Photoshop or Fireworks or some other program that can produce HTML based on slices. Using spacer gifs adds unnecessary code and almost always destroys an email creative. Their purpose is to "tighten" up loose ends that the client created while slicing an image but too many of them will make the image to text ratio unbalanced which will affect delivery.

While we're on the subject of using programs to write HTML – here's a tip for that: stop it. These programs (depending on how the image was sliced) can make code so cluttered that it's easier to just start from scratch – which is what I end up doing every time I have to restructure a client's code who has used this method. These programs also add comments to your code, which is also another common issue. We've seen comments sometimes appear in a deployed campaign, so we recommend that you delete all comments before you paste in your code into your ESP providers program.

Another issue that can be corrected using nested tables is empty cell tags. Empty cell tags are often used to create space. While it generally would work, some email clients could collapse the cell if it's empty which would break your creative. Sometimes adding a non-breaking space ( ) will add something to the cell so it doesn't collapse, but to be on the safe side, I like to use nested tables.

In the example above, there are two small empty cells on either side of the larger cell that would house content. You can simplify the code and get rid of the two cells with nested tables.

With this method, the shorter width nested table with the align="center" attribute in the table tag "floats" inside the longer width cell so it automatically creates the space on either side without the need to actually code the space!

I've got plenty more tips when it comes to tables but they involve the use of CSS and styling your tables. So in my next post, we'll pick apart inline CSS – why we use it, what works, what doesn't and some tips to make inline CSS not so irritating!

Until next time - happy designing!

Tiana :)