We try to make email marketing as simple and easy-to-implement as possible, but even experienced designers sometimes struggle when it comes to designing email newsletters. That’s because email is different to any other tool you use and so, has its own rules.
I know many of our clients choose to use one of our pre-made templates (and it does make your life that much easier), but some GraphicMailers simply have unique needs and so want to design their own templates. So, here are some email design tips and best practices for all:
First things first
1) Your gut instinct might be to send out the most impressive, flashy email on the block – but that might not be the best idea. A clean, simple layout is not only easier on the recipient’s eye, but easier to code. There will also be less of a chance that your email will be incompatible with certain internet browsers or email clients.
2) Furthermore, some of your subscribers might be viewing your email in a very basic email client, or even on their mobile phone. Insert a link to a web server at the top of your email, so that, if the email client does not support all your imagery, they’ll still be able to view it in all its glory.
3) You’re probably aware that it’s illegal to send out marketing emails without offering the subscriber the option of opting out of your email. Even though it may seem inconceivable that someone might choose to no longer receive emails from you, it does happen. Make your unsubscribe link clearly visible – you’ll make it easier for recipients to unsubscribe and save yourself the trouble of having to remove them from your list manually.
The technicalities
1) It’s time to whip out those tables. While you can use some CSS styling in email design, all emails require their layouts to be designed in tables. With the exception of the 100% width wrap table, it’s best not to nest any other tables – rather use the stacking system. Your email will simply be much easier to control. (Bear in mind that most email clients only read the code in the body tags, not the tags themselves, so if you want to create the effect of a background color you’ll have to use a 100% width table.)
2) Contrary to what you might be doing for your websites, don’t create classes – email clients tend to strip them out. Instead, use inline styles.
3) Not all your subscribers have their images turned on by default; in fact, many of us block them. Remember to give alt tags to all your images! In the same vein, don’t set size specifications (width and height) for your images. If your recipient is viewing the email with images turned off, they’ll only be faced with large white blocks – and you don’t want that.
4) Keep in mind that most email users view their emails in a preview pane. Keeping your email width under 600px is considered best practice, as this is the width smaller preview panes are set at.
5) When designing emails you’re going to have to stick to HTML – all those fancy little JavaScript tricks, like pop-ups, trigger spam filters with ISPs and are more than likely to get your email spam trapped.
6) Needless to say, all your subscribers will be viewing your email in different email clients. As you can’t 100% guarantee what the character set they’ll be using will be, it’s best to make sure that all your characters are encoded. It’s a bit of extra effort, but it does guarantee that all your recipients will view the text correctly – especially if you’re working with foreign languages.
See if it works
I cannot emphasize the importance of testing your emails enough! How else will you know whether their rendering and displaying correctly? There’s no “undo” after you hit send.
1) Make use of Inbox Preview – it’s our new tool that allows you to see how your email renders in a range of different email clients. Nifty. If you choose to test manually, make sure that you not only have a range of email addresses at your disposal (like Gmail, Hotmail/Live, Yahoo! Mail and AOL mail) but also that you test it in a number of browsers – e.g. various versions of Internet Explorer, Mozilla Firefox, Apple Safari and Google Chrome.
2) The simplest and most effective way to test your newsletter is to conduct a test send. You’ll be able to see how the email displays, whether you’ve left anything out and check to see if your links and anchor links work.
Not sure what to test for? Read this post.
So there you have it – a few tips to help you out! If you have any other design related questions please drop us an email – info@graphicmail.com – and we’ll get a member of either our support or design team to help you out. You can also read more design articles and tips here and here.
