Help! I’m a new email developer!

I’ve seen quite a lot of people introducing themselves on the Email Geeks slack group recently saying that they are new and want to know where to start. We’ve all been there. Thrown in at the deep end and not knowing exactly how we got there or what we are doing. So I had a brainwave. Try and bundle my experience and knowledge into a friendly welcome package to all the newcomers to the industry.

Rule Number 1: Begin with what you are comfortable with.

Each email developer has their own preferred method of coding emails. For some, they avoid using <table>’s and prefer using <div>’s. Whereas, others like myself like using <table>’s. There is no right or wrong way of coding things, as long as it works as expected (remember to test!).

The method I used to learn how to code emails was the hands-on approach. I downloaded a responsive template and broke it to learn how it worked. You can find free HTML email templates online. A few examples are from Litmus, Email on Acid and BeeFree (more a are available from a Google search — other search engines are available).

Once you have the basics down, you can move on to the fun stuff like making your own responsive template. I use the term responsive broadly here as there are different types of responsive design. A list of common terms has been put together by Mark Robbins, a great influencer in the email marketing industry. The breakdown is as follows:

Fixed Template: This would be when your <table> or <div> has a fixed width defined on it, either through the use of a width=“600” attribute or width:600px CSS call. By using this method your template will stay the same size* (*may be scaled down to fit on a mobile device) and cause scroll bars to appear on the screen if it is not big enough to fit it all on.

Fluid Template: By defining a width of 100%, using any of the methods mentioned previously, means that your email will scale itself to the size of the window it is being viewed on.

Spongy Template: This method is a great mix between the Fixed and Fluid templates. With this method you give your <table> or <div> a width of 100% but use CSS to give is a max-width:600px. By doing this, it allows the email to nicely scale down if the window is less than 600 pixels wide. If the window is bigger than 600px, the max-width will limit it so that it doesn’t scale up.

Responsive Template: This was the common method I came across when I started my email career. Using an internal stylesheet with a @media{} query within it tells the template what to do when the criteria are met by using classes or attribute selectors. An example would be to tell a <table> with a fixed width of 600px to change its width to 100% making it scale for the device that it is on.

Adaptive Template: Similar to the above, the adaptive template uses media queries. Instead of taking your email from a fixed width to a fluid width, this changes the fixed with of your email to a specific width based on your media query.

Hybrid Template: This template method gives the most control of your email by combining methods from the Spongy Template and Responsive Template. With this combination, you can ensure your email displays full width on a wide range of devices and allows you to make tweaks depending on devices by using media queries.

Advanced methods: Once you have a good understanding of coding emails you can then explore new frameworks and templating systems with confidence. Some popular choices are MJML, Maizzle, Pine and Cerberus.

Rule Number 2: Test Test Test!

This rule may sound like a no brainer, but how do you go about testing your email design to see if it renders correctly in different email clients? You may try and install every email client you can think of and set up multiple email addresses to send your test to. But that would be a very time consuming and a very unproductive way to go about it.

Luckily for us, there are platforms that will render your email in lots of different email clients. All you have to do is send a test to one email address or even copy and paste your code into the web browser. The tools that allow you to do this are Litmus and Email on Acid.

When buying any software, it is important to get the right one for you. Both Litmus and Email on Acid offer free trails on their platform so you can judge which is best for you.

Rule Number 3: Outlook hates you.

Okay. That statement may be a bit harsh. Outlook doesn’t specifically hate you. It just uses Microsoft Word as a rendering engine which means it doesn’t play well with HTML emails. You can ask all experienced email developers and they will all agree that Outlook is the most problematic to code emails for. Despite all this, Outlook still sits at the 3rd position for the most commonly used email client.

So what can you do to prepare for this? Email on Acid released a blog with common problems people come across with Outlook. This will allow you to troubleshoot any quirks you see when testing your email.

Rule Four: Resources are important!

Nobody in the world knows everything. Therefore, knowing where to look for help and knowledge is important. The one thing I wish I knew when I started out in Email Marketing is the existence of the EmailGeeks community. I know I mention it a lot in all my articles but there is a good reason. This community is home to a wide range of people who specialise in different parts of the Email Industry. Each person shares their knowledge and experience to those who need it and thus helping you to become the best of the best. If you are experiencing a problem with an email, there is a good chance that someone has also encountered it before you and found a solution to it, ergo minimising your troubleshooting time.

Another great organisation related to Email Geeks is the Women of Email. A 501(c)3 nonprofit association aimed at promoting leadership and cultivating professional growth among women in the email space. This is a great place for women starting out in the industry to find mentors, advice and most importantly support.

Keeping up to date with the latest news and updates in the Email Industry is also important. Signing up to newsletters from Litmus and Email on Acid would be a sensible thing to do as using their tools to test your emails is important. However, there are a couple more newsletters I suggest you sign up to as well.

Action Rocket’s #EmailWeekly is a good email to digest what has happened in the email industry over the week.

Another is Email Marketing Tipps. Similar to Action Rocket, Email Marketing Tipps sends out a weekly email of different articles about the happenings in the email industry as well as them being available on their website.

Events are excellent places to learn and to network with others in the industry. A great list of upcoming email related events has been compiled by Taxi for Email.

If it’s design inspiration you are after, then look no further than Really Good Emails. RGE is home to community-sourced email designs from brands in all different sectors around the world. This is always my first stop when I am looking for inspiration or ideas on how to improve my emails.

Conclusion.

Everyone has to start somewhere and we have all been there. I hope this article has made your journey into the email industry that little bit easier. If you have any questions, recommendations or general feedback to improve this article for the next newcomer, feel free to reach out to me on Twitter or on the EmailGeeks Slack.