Email Newsletter Code

Email coding is typically basic HTML. I normally lay out my email newsletter with a basic table setup of 3 rows and 3 columns for the content area. I use set table widths to help improve rendering and try to avoid using nested tables since they can be problematic in rendering for some clients like the dreaded Lotus Notes for example.  I had success also with using width settings as percentages so that theoretically the email would scale to the width of the preview pane.   Typically the width of the preview pane is considered to be 600 to 650 pixels wide and around 400 pixels tall.

CSS usually also causes problems in a lot email clients, including many popular free ones as they strip out anything above the body tag.   So if you do use CSS, you need to use inline styles to do things like setting font face, size and color. Although you can use older HTML tags for this like font face and font color too, and that will usually work. I almost always use the old school < b > and < i > tags for bold and italic, since it’s shorter to type and always renders.

Finally a little advice on translating special characters across platforms. I write my emails on Mac, but send them to PCs. This can cause a lot of problems with characters like apostrophes, quote marks, and symbols. So I hard code special characters using the html code for ASCII characters. I find you want to use the ones that begin with ampersand and have letter designations over the numerical codes. Some examples of this might be using & trade; for the trademark symbol or & rsquo; for a right single quote or apostrophe. You can’t use these in the subject lines so make sure that if you have a character like an apostrophe you type that in, do not copy and paste from something else like word. A lot of programs use these little devils called smart quotes. They put the curled quote marks when you type the key and those do not render well across platforms. Typically they end up appearing as a Greek letter which is only good if you’re writing to fraternities or sororities.

You can write out the html code of an email newsletter using a simple program like notepad, but I found Dreamweaver to be a lot easier. One way to check if you’ve written good code for your email is to forward it to yourself. If the email arrives and has actual email rendered properly in the forwarded section, then you’ve done a good job.

Leave A Comment