How To Create An HTML Newsletter by Sameep Shah
OK So you've decided it's time to send an HTML newsletter to your email list
but you're not quite sure where to start? No Problem, we've all been there. I
tried and tested many times before I created my first successful html
newsletter.
Creating an HTML Newsletter is very similar to creating a webpage, with some
minor twists on the old rules.
Now if you already know how to create a webpage then you won't have any
problems. But if you're not sure, then you can always use a WYSIWYG - What You
See Is What You Get HTML editors such as Microsoft Frontpage or Adobe
Dreamweaver. Or you can skip all those steps and just download a newsletter
template, and add your text.
The only real difference between a newsletter and a regular webpage is how it's
designed and how its sent.
Let's Get Started.
1) Remove everything before the open (body) tag, and everything after the close
(/body) tag. Then get rid of the body tags themselves. There should be no
(html) tag, (head) tag, (title) tag, (metatags), and no css stylesheets. The
only remaining html code will be what you originally found BETWEEN your open
(body) (/body) and close body tags - Tables, images, text, links etx.
2) No more javascripts - Email providers don't allow javascript in their email
and they will disable it. So if you have any javascript within your newsletter
then get rid of it.
3) No Flash, No DHTML, No Web Forms - Most if not all of time they will not
work so your newsletter will be better off if you don't include them.
4) No more ads - Actually you can have ads, but just not the popular Google
Adsense Ads. Google's Adsense uses javascript and javascript won't work in the
newsletter. You can however find link exchanges, or other advertisers that use
plain links for their ads, and include those in your newsletter. These ads,
banners, and text links will work just fine.
5) No More CSS - Often designers will use CSS for a webpage's layout, but in
the case of an html newsletter it would be better to use tables, instead of
writing lines and lines of inline css code. You can set padding, background
color, and lots of other table properties, just as you can with CSS. Remember
keep it simple.
6) If you must use CSS then get inline - Since you can't import style sheets to
style and format your html content you will need to use inline CSS which
includes all of the css properties in line. EX: style="background: white;
color: black;"
7) Images - When adding images on a webpage we would normally use urls such as
image1.jpg, but with a newsletter you'll have to enter the complete or the
absolute url.
Tip: Make sure to set your images' border to 0 so that it will show up
seamlessly inside your newsletter.
8) The first link in the email should be a link to the online version of your
html newsletter. Even if you have option for html or text newsletter, it's a
good idea to include a link to your online version at the top of the
newsletter.
9) Include an unsubscribe / remove me link at the end of your email, and text
for compliance with canspam laws. If you don't have an unsubscribe button then
your newsletter could be seen as spam and you don't want your subscribers
thinking they have no way to unsubscribe. If you have more then one newsletter
then include a link such as Manage my subscription or a link that takes them
directly to their online account. Placing this link will allow your users
access to their account and allow them to manage their subscriptions. Who knows
maybe they'll subscribe to more newsletters.
10) Test, test, and retest on major email providers (Hotmail, Yahoo, Gmail).
You may notice that with that the new MSN Windows Live Mail Beta the text in
your newsletters will be centered. Don't rely on defaults to left align your
text, use the left align button on your editor to align them when needed.
During my previous newsletter tests some of the special characters in my
newsletter rendered oddly in Yahoo, so make sure to find the character codes
for those special characters, and then paste them directly into your html. For
more special characters visit
http://www.freenewslettertemplate.net/Keyboard_Codes.cfm
For ex: this ' apostrophe will turn into ' This will allow the text to
display properly. For more character codes scroll all the way down or google
"Special Character Codes"
11) Before you send your email make sure to set the email's content-type as
HTML, so that it can display as an Html newsletter, or it will just show up as
plain HTML code.
12) Get Online - Before you get started make sure to upload those pictures and
your original HTML newsletter to your hosting account so that your subscribers
can visit your newsletter online.
That's it. Happy HTML emailing!
About the Author
Sam runs Free Newsletter Template
- A Website filled with tools and information from email marketing to email
list building. Try out their FREE Html Newsletter Tester at
Free Newsletter Template
|
