Newsletter Tips

Recently I have been doing a lot of newsletters for one of my clients. I hadn’t really had a lot of previous experience with them. So I started out by coding the page just like I would any other page. I used absolute URLs for all the img’s, and attached a stylesheet using it to a few test accounts like gmail, hotmail, yahoo mail etc. Result: disaster. The only email program it looked decent in is was outlook, but that’s just because they have a built in browser.

So, I did some testing. First, I changed the Doctype to HTML 4.0, rather than XHTML 1.0. Then, I took out the [quickcode:noclick] [/quickcode] made the styles embedded, and also upon hearing that hotmail completely deletes anything between tags of an email i assigned each paragraph or span to a class, and put styles after the head tag. It did ok in gmail however in hotmail and yahoo mail it the same as before

Back to the drawing board. I thought in the beginning that possibly,I had to write all the css out within the actual paragraph and span tags. However, knowing this would take longer than I wanted, I triede again this time in the CSS to only use classes for the text, and then within the DIV tags I did the stuff I wanted to. Still no luck for Hotmail.

Finally, I decided to write it all out. So, I didn’t have any styles defined in my HEAD tags anymore. The code was long and a bit messy. I then sent it for the test, and all the text worked right. However, the email still wasn’t centered. So, I decided to center it using a table. It was very difficult for me, having not used the TABLE tag for some time now. But, I went for it.  Also, Hotmail was stripping the body tag. So I made a main div, and gave it this style: “margin:0 auto;
width:800px;� . After that, I put a TABLE and aligned it to the center. I sent the email again and it worked like a charm!

Final thoughts: I realized through this experience, that its ok to work outside of pure CSS andstandards for emails. Why? The market is targeted. They need to see the email how I want them to. Spiders will never crawl it. And its the onlyway to make things the same across most HTML-based mail programs. Sothe lesson learned: ugly code, some tables, assigning styles withintags and patience is the way to get email newsletters to look the way you want!