Best practices for your HubSpot email design

Posted by Mariana Morales on July 13, 2016 at 11:23 AM

In email marketing

New to HubSpot and still trying to figure out how to build the most effective email template for your marketing efforts? We've got you covered with this best practices list for building out your HubSpot email design. 

 

Best practices for building out your email template

First your email template design should be simple and responsive with a focus on content. Your email should be 600 px wide, keep this in mind when designing items like your header. Avoid including rich media, HTML bullets, PNG images, background images and invisible text.

Before you begin building out your template, create your mockup and wireframe with the above best practices in mind. Once you have finalized your design, you can begin building your email template in HubSpot’s design manager.

Building out your email is simple using HubSpot’s drag and drop template builder. Use the modules to best fit your design needs, you can customize those modules using the CSS edit option.

 

Consider the differing email clients

Not all email clients render your coding the same, this is particular true of Microsoft’s Outlook. For example, Outlook does not support background images, so if you were thinking of enhancing your design with a creative background image, you might want to reconsider. For a full list of what is and is not supported by the most popular email clients click here. 

 

Best Practices for customizing your email

For best results, use inline CSS to build out and customize your HubSpot email templates. If you do not do this and instead use internal or external CSS the results of the coding may not render correctly across all email clients.

Font wise, use a default font. Most email clients do not support and will not render custom fonts. For your images, make sure they are as small as possible, and ensure they are the correct size (ie no larger than 600 pixels wide). Don't forget to include CTA's and social buttons to enlist action. 

If you are not well-versed in CSS or don’t feel comfortable customizing your email template you can always outsource the work to certified HubSpot design partners. They know the ins and outs of the program and how to best achieve your design goals. 

 

If you're choosing to build and send your emails in HubSpot, you have chosen a tool that will allow you to build beautiful, repsonsive emails that concentrate on engagement and action. We encourage you to head over to their blog to find some great examples of marketing emails. For help building out your own HubSpot email template check out the video below, where we walk you through the development of our very own monthly HubSpot email template.  

how to build HubSpot templates from a photoshop design file