• Software
  • About
  • Resources
  • Try Wired for FREE
Search
  • Software
  • About
  • Resources
  • Try Wired for FREE
Marketing

Fixing Common Email Template Problems

  • Amy Birch
  • 7th Jun '13
  • 1

If you’re an email developer, you’ll know that your job is never over. Clients wanting to make changes, unhappy clients, problems rendering designs in browsers, email clients or across different devices – all contribute to one big headache.

Professional email templates are only good to go once they have been checked across every single email client. So that’s Outlook, Gmail, Apple Mail, Lotus Notes, iOS Mail, and Windows Live Mail, to name but a few. Of course, savvy designers out there will know to only check those client’s that are most popular with your existing contacts. But there may be some that slip through the net.

The reason behind this is because every combination of device, browser and email clients produces a slightly different result. For example, Outlook supports stylising the email in the tags, Gmail does not. Gmail supports vertical alignment of content, Outlook does not. If you’re using heavy background images Outlook supports these in versions 2000 and 2003 but not in 2007, 2010 or 2013.

The main issue with coding problems is that one tiny fault has the potential to ruin the entire email template. To help identify the problem, we have outlined some common issues and solutions as well as some top tips.

Common problems

The most common complaint is that things just don’t work in the same way as they do in a browser. Video, Flash, Javascript and even simple surveys have limited support in email.

There are a number of reasons why images may not display as required:

1. Text is on top of an image

Background images aren’t supported in Outlook versions 2007 and later. Avoid using background images, instead use a back ground colour as a backup when the images wont display.

2. Link and hosting issues

Images should be hosted on a publically accessible server and referenced in your HTML, to ensure they are displayed correctly.

3. Blue borders surrounding images

Sometime this happens around images that include a link. This can be changed by entering code which removed the blue border.

4. Incorrect file formats

Some email clients are picky about which type of file they will support. If you’re experiencing issues with a PNG, BMP or TIF file, consider replacing it with a GIF or JPG instead.

5. Images are blocked

The majority of email clients block images automatically. Unfortunately there’s not a great deal you can do about this. Consider asking contacts to add you to their Safe Sender list to ensure images are displayed every time.

6. Gaps appearing under images

This tends to happen when the layout consists of several images sliced apart and placed together in a table based design. Add a small amount of inline CSS to each of the images that are causing trouble.

7. Font aren’t displaying correctly

If font is not displaying in the correct way, it could be for two reasons:

-    The font you’re using isn’t installed on the computer you’re using to view the email. Stick with web-safe fonts to ensure they render.

-    If fonts were specified in the <head> of your email, Gmail will remove them. Move your font styling to be inline.

Still having trouble? Here are our Top Troubleshooting Tips:

-    Override any default settings. Some email programs will have a default setting for how they assume elements should be displayed. Include values for everything, even if it’s 0. Stating colours and sizes can also prevent any issues.

-    Troublesome tables. If rows are not appearing in a table, add a border to understand the table structure.

-    Double check your calculations. If you find your layout is out by just a few pixels, add up all the table cells, and make sure they equal the width of the parent table. Some email clients include padding and margins in their ‘width math’, but others disregard it.

-    Isolate the problem. Find the source of the problem by removing the HTML. Reintroduce it bit by bit, and you should see where the problem occurs. Alternatively test the HTML alone to see if other elements are affecting it too.

-    Text isn’t aligning properly. If the text isn’t aligning in the way you’d like it to, make sure you’ve included properties such as valign and align in <td> cells and <p> tags.

 

If you’re STILL having problems, consider borrowing someone else’s eyes. It’s hard to spot your own mistakes, and someone else may be able to spot it.

email marketingemail templatesmarketingprofessional email templates
  • Share:
Amy Birch
Author

Amy Birch


Amy is our Campaign Manager and works with our clients to ensure all campaigns follow an effective campaign strategy and produce results.

Related Articles

Marketing
What is the best time to send email marketing campaigns?
Marketing
How to Survive Image Blocking
Social
Perfectly Timed Facebook Posts

Comments

Cancel Reply

You must be logged in to post a comment.

Search the Insider


No More Results
Previous Post

7th June: Top Ten Tweets of the Week

Next Post

Google Doodle: 10th June

The Wired Tag Cloud


analysis apple best practice business customer ecommerce economy email email design email marketing email marketing campaign email marketing campaigns Email template email templates etail facebook free email templates google guide inbound marketing law lifestyle linkedin marketing mobile news Photoshop effect pinterest professional email templates recruitment retail samsung social social media spam tech technology tips Top 10 Tweets Top Ten Tweets top tweets of the week Tutorial twitter UK email marketing wired marketing

Categories and Topics


  • Business
  • Marketing
  • News
  • Social
  • Tech
  • Tips
  • Uncategorized

Who are Wired Marketing?


Wired Marketing are a full service email marketing agency providing an enterprise level email marketing automation system and agency services for your digital marketing campaigns. From newsletter campaigns, segmentation, marketing automation, surveys and landing pages we help clients get the most from their email marketing and automation programs by becoming more 1:1 relevant with their contacts.

Find out more at wiredmarketing.co.uk

Copyright © Wired Marketing Ltd. 2016 - All rights Reserved.