If you are a web developer, sooner or later you are going to run into the issue that you will have to build a email newsletter. Like it or not, every developer I know has had to code a email newsletter that goes out to a ton of people. Here are a few tips that could help make coding a email newsletter easier for all you newbies.

 

1. Keep it under 650 pixels

Now the reason why I say use at most 650 pixels of space, its because anytime you go bigger than this size you will run into some issues with it displaying on mobile. Believe it or not now, according to Litmus, email open percentages topped 51%. Thats right, most email is checked on mobile phones nowadays, which tops desktops.

2. Style through the inline.

I know most of you are use to using a CSS stylesheet…well you can’t do that here, and you can’t put it in the header…some email clients will strip out the header section of the code which means if you put the style elements in the header…it won’t work and you will be SOL when your email shows up with nothing showing.

3. Don’t hate the table hate the game.

One of best tools you will have to use, will have to be a table. You will have to push yourself to decode and go simple. Tables were before div’s…and believe it or not you will have to use tables to keep your email nice and tidy…and sometimes you have to use…tables in tables and tables. Which has happened to me on several occasions.

4.Absolute URL’s

I know I know another rule that you will have to break. Most people use a relative tag which is /image/image.jpg but when you are dealing with emails you have to use an ABSOLUTE URL to help make sure your images show up.

BONUS TIP: ALT & IMAGE SIZE

You will need to make sure you always include alt tags to EVERY SINGLE IMAGE cause it helps blind people know what is in the email. Its also better emailing that will make sure you get past the spam filters. Also one issue that I have noticed is that if you leave out the width and height of an image…some email clients will just blow it up to 100% of whatever cell it is in. I have seen it before…especially with people who use outlook. Don’t ask…just believe it, some people use outlook 2010/2007. Best to cover as many bases as you can.

5. TEST SEND TEST SEND AND TEST SEND!

Ok, how can I say this easy without typing out TEST 200 more times. Using a email like litmus or email on acid will help you recognize issues and show you what your email will be like when you send it to however many people are on your list. Testing it through these email testing clients will definitely save you a big headache when you send it to a client and they see it and are like “why is it showing weird to me.” Well ignoring the fact that their settings might be insane, this is the definitely tool that you will need to do to make sure you craft the perfect email.

 

Well I hope these tips will help you out especially with coding up a email. I know its a going back to basics with some of this stuff, but it will definitely help cause every web developer will sooner or later have a code at least one of these bad boys sometime in their career.