It was the first day in April a few years back when one of my team members hurried over to my desk. “Oh crap, what is this spike in web traffic we’re getting? Is it another DNS attack?”
We worked for DigiCert at the time, an online security services company, and due to the nature of our business, we were regular targets of DNS attacks. In our marketing department, we had a TV screen up displaying a custom-built Google Analytics live view of our website traffic. If traffic started to spike, we would see it and could act on it quickly.
We went over to the screen to look at the traffic source module of the Analytics dashboard. To our dismay, all the traffic was coming in from an email source… but we hadn’t sent any emails that morning. Had we?
The non-April Fools’ joke
We pulled up our marketing automation tool and found that, unbeknownst to us, we had sent an email. Much of our database had accidentally received an email from us about our partner program. Within minutes of sleuthing, I found the problem. In training someone on my team, we had set up a campaign and had simply cloned content from one of our partner campaigns. We made the mistake of activating the account on a future schedule and not deactivating it.
I set my team to drafting an apology email to the recipients and then took the walk of shame to the other side of our building. It was my responsibility to tell our CEO about this mistake. Thankfully, everyone in the company understood… mistakes happen.
In the email response we sent to these mis-recipients, we played up the April 1 bit, but we were honest about it. The email began “Happy April Fools’! We wish we could say this email was an April Fools’ joke, but it wasn’t. We missent it to you. Please accept our sincere apologies.” We then explained our partner program in case anyone wanted to join it.
All ended well for us because we owned it well. We had a few extra groups join our partner program, and had some laughs… but it was one of the biggest professional mistakes I’ve ever made. It felt horrible at the time, and it’s still embarrassing to think upon.
Marketing automation & complacency don’t mix
Of the top three marketing automation suites, Hubspot, Marketo and Eloqua, Hubspot is currently the fastest growing as far as new user installations are concerned. HubSpot has garnered 1.7 percent growth in the number of installed customers for February 2017 (Datanyze).
Ease-of-use is one of the main advantages of Hubspot, and perhaps part of the reason they’re growing so rapidly. While ease-of-use can be a strength, it can also lead marketers to complacency — a trap you must avoid in email marketing.
Ever since that dreadful April Fools’ Day in 2014, I’ve become a strong advocate for following best practices.
HubSpot email marketing best practices
HubSpot Academy is an excellent source of training. I’ve been through the HubSpot Academy and passed their certification test. They have a lot of great content — almost too much. For example, this article about email optimization boasts over 30 best practices.
Which of those are most important? What best practices aren’t on there that should be?
With thousands of hours of experience with Eloqua, Marketo and HubSpot, I’ve built my own list of must-know email marketing best practices. The ones I’m sharing here are specifically tailored to HubSpot users. They are also of a more technical nature. For example, having a single, clear call-to-action is very important, but is a more broad marketing best practice and not as much a #martech tip, so I’ll avoid those more general suggestions.
Instead of throwing another long list of best practices at you, I’m going to impart my five best tips. If you can adopt just these five into your everyday emailing you’ll see great improvements — I promise!
1. Test, test, test
The top five email clients are made by Apple and Google, and account for 78 percent of email opens. However, each of the top five clients render emails differently, and there are still dozens of other clients out there in use.
Email testing is extremely important, not just to ensure that emails render correctly for your audience, but also to make sure you’re getting the best subject lines and body content in front of that audience.
After writing an email in HubSpot, at the top of the window there are a few buttons you can, and should, use.
- First, use the “view as contact” button to select a contact that you know will be receiving your email, and see where any dynamic personalization fields are swapped out. Make sure those look like you want.
- Then, be sure to use the “preview in other inboxes” button to pull up a dialog where you can select different email clients to test your message in. After checking the box next to the email clients you’d like to test, you should then click “test my email now” and go take a break. HubSpot’s testing engine does take some time. If you come back in 15 minutes, the tests should have run through and you can view the results. You’ll be able to open actual renderings of what your email will look like in each email client.
- Lastly, be sure to actually send a few test emails, too. HubSpot makes sending test emails really easy. When editing an email, you simply select the “Send test email” icon on the left navigation bar, and it will open the dialog box that allows you to do so.
Email testing is one area that HubSpot excels in. This screengrab from HubSpot shows you how simple it is to preview your email in a variety of email clients.
2. Minify your images
We’ve all received emails that take forever to load on our phones. Sadly, it seems this is the case for most HTML emails sent by marketing departments. Marketers are very good at being creative, especially when it comes to emails.
Extensive research has been done on how big an email should be before it creates slow load times and starts ending in spam folders. The general consensus is that emails should not be larger than 100KB. Considering most high-resolution images weigh in more than that, this can be tough.
In steps image minification.
Minification, you ask?
In a past life, I was a web developer. Coding was my life. I was trained to always “minify” my code before launching it. Minifying code means taking out all the unnecessary white space — the extra spacing, the line breaks, etc. It downsizes the code file size considerably.
Marketers can, and should, do the same with their own images, especially if those images are going to end up on a website or in an email.
How to minify your images?
You can use Photoshop’s “save to web” functionality and hope that you guess all the settings right to get a small image size. Thing is, no matter how well you guess, it’s still not going to be as small as it can be.
Instead, simply upload your .png or .jpg to TinyPNG and let that easy-to-use tool do its magic.
Here’s an example from TinyPNG’s website:
I’ve received huge images from designers in the past, and I just upload them to TinyPNG. I’ve also shown the end results to these designers and asked them if they could identify which image was the pre-TinyPNG and which was the post-TinyPNG, and they couldn’t.
Note: The only caveat here is if you have a .png with an aggressive gradient on it. Sometimes the gradients will be outlined with a background color, which can mess with your design. In this case, I recommend saving flat.
3. Make ‘text only’ emails look the part
Nothing screams “newbie” in email marketing like a “text only” email that has a clearly HTML based unsubscribe link at the bottom. The email marketer was trying so hard to make the email look like it was sent directly from the sales rep, but then the bottom of the email is a dead giveaway. Below is an example:
This example isn’t the worst I’ve seen either. Most of the time the unsubscribe link will be on a different color background or will be center aligned while the rest of the text is left aligned.
It can be tough to get the unsubscribe link set up so that it looks inconspicuously as if it is supposed to be there, but it’s worth the work. Below is an example I built for my employer where the unsubscribe link is more naturally placed and looks as if it is something sent on all emails by the sales rep.
4. Use the HubSpot in-app template builder
Larger marketing teams have the benefit of having a designer on hand. While this is a great advantage in many ways, in email marketing it can introduce a serious defect.
When launching a new email template, a well-intentioned VP of Marketing will go first to their designer, explain their vision and ask the designer to build it out. So, the designer opens Photoshop and starts their magic. Then they hand that magic to the email marketing team and ask them to create the template. Hours or days of work later, it all comes crashing down when the well-intentioned email marketer — who was trying so hard to stay true to the design — that they cut corners or got “creative” with inline CSS to make it work.
The problem is, though, that it won’t work. Once you get it into HubSpot and send a few test emails, it’s obvious that something is wrong. What is wrong is the older HTML and CSS methods that are now deprecated in internet browsers are the norm for email (see section below), and then trying to get old styles to play well in the HTML view of a template builder in Hubspot can be tough.
What’s the solution?
Use the in-app HubSpot template builder. It is point-and-click easy and does an excellent job of creating a layout that’s both visually appealing and correctly renders in all the email clients.
Important tip: It can be tough to communicate with your designer the slight constraints that exist by using a point-and-click designer like the HubSpot template builder. So, instead of having them give you designs that you then translate into actuality, give them access to HubSpot and train them on how to find and use the template builder. Then let them go crazy.
5. Go old style
With email marketing, you can borrow some coding best practices, such as minification (see above). Other coding best practices, however, will just get you in trouble. Such is the case for the HTML and CSS you use in your email marketing. Three important tips to follow, when coding your emails, are to use only inline CSS, don’t use shorthand CSS properties, and to use HTML tables for layout.
Inline CSS will save you a lot of headaches. Most email clients will strip out any CSS you put up in the HEAD section of your code. Instead, make sure you put all your styling right down inside the code itself. For example, if you want a paragraph to have a specific font, instead of putting that font declaration up in the HEAD section and then referencing a class in the <p> tag, you should reference your desired design effect in the <p> tag itself. For example: <p style=”font-family: Verdana; color: #ffffff;”>content you want to be styled</p>
Forgetting shorthand CSS best practices is best practice in email. Shorthand CSS is when you use a single style, such as “font” instead of three different styles, such as “font-family,” “font-style,” and “font-size.” Many email clients still don’t know how to handle shorthand CSS, and so your emails will look goofy.
HTML tables are all the rave in the wonderful world of email layout. While <div>s are great in standard web development, they often don’t work in email. So, when you’re putting together your email templates, be sure to use <table> elements instead of <div> elements for your layout. Also be sure to have different <table> sizings depending on the responsive version of email (mobile, tablet or desktop).
I’ve made these five HubSpot email marketing best practices so integral to my email sending process that they’re now second nature to me.
What email marketing tips are so tightly ingrained in your process that you’d be lost without them? How have they benefited your email marketing? Please share in the comments.