How To Format an HTML Email Part 3

Incase you missed it Here is Part 1 and Part 2

How To Format an HTML Email Part 3

 

In part 2 we discussed editing the background color and the header image using our text editor! 

Editing the Sidebar

Today in Part we’re going to edit the left sidebar of the email!

Lets start by finding out where we in our HTML Code. 

Look for this part of the code right after the header image that we previously edited!

Code:

 

<tr>

               <td>

                  <table width=”580″ height=”130″ border=”0″ cellspacing=”16″ cellpadding=”0″ class=”content”>

                     <tr>

                        <td class=”sidebar” align=”left” valign=”top” width=”192″>

                           <h3>In This Issue</h3>

                           <ul>

                              <li><a href=”#”>Nullam egestas feugiat felis</a></li>

                              <li><a href=”#”>Lorem ipsum dolor sit amet</a></li>

                              <li><a href=”#”>Donec porttitor ligula eu dolor</a></li>

                           </ul>

                           <img src=”hr-small.gif” alt=”Small hr” width=”192″ height=”28″ />

 

Oops! Remember we added width to the header image in part 2? So we need to make this opening table that contains the side bar and the body content the same width as the header! Its very simple just replace change this line of code.

Code:

  <table width=”580″ height=”130″ border=”0″ cellspacing=”16″ cellpadding=”0″ class=”content”>

Replace with:

  <table width=”780” height=”130″ border=”0″ cellspacing=”16″ cellpadding=”0″ class=”content”>

Very simple right?

Ok onto editing the content of the sidebar. Let’s examine this line part of the code and break it down so you know which part goes where:

Code:

      <td class=”sidebar” align=”left” valign=”top” width=”192″>

                           <h3>In This Issue</h3>

                           <ul>

                              <li><a href=”#”>Nullam egestas feugiat felis</a></li>

                              <li><a href=”#”>Lorem ipsum dolor sit amet</a></li>

                              <li><a href=”#”>Donec porttitor ligula eu dolor</a></li>

                           </ul>

Notice the <td class=sidebar. This references the class in the CSS stylesheet this attached to this page it controls how the page is displayed on your browser. After that line we have align= left which aligns the text left you can change to ‘center’ or ‘right’  then we have valign which stands for vertical align which brings the text to the top of the table as opposed to the middle or bottom. Then we have the width, this is very important! We can change the width of this table but just remember that whenever you change it whether increasing or decreasing you need to change the width of the table that contains the body content as well. However 192 should be more than enough width for this sidebar.

Next we have the <h3> tag, this is the ‘header’ tag it is used to emphasis on whatever is in between the tags. This happens to be the title of this block of content that says ‘In This Issue’. 

Next we have an <ul> or unordered list. A <ul> displays as bullet points where as a <ol> ordered list displays as numbers.

Code:

 

<li><a href=”#”>Nullam egestas feugiat felis</a></li>

                              <li><a href=”#”>Donec porttitor ligula eu dolor</a></li>

                              <li><a href=”#”>Lorem ipsum dolor sit amet</a></li>

The <li> tag tells you what is actually listed in the list. Confusing right? The weird looking words are just latin filler words used by designers to show example text. Here is what it might look like for your newsletter!

Code:

<li><a href=”#”>This Month’s List of Stuff Not To Do</a></li>

                              <li><a href=”#”>Gary’s Newest Article to Save the World</a></li>

                              <li><a href=”#”>Check Out These Sweet New Sites!</a></li>

You get the picture right?

Now you may be wondering what the <a href> tags are. These are the tags that let you link other files or sites on the web. They stand for a= anchor and href = hypertext reference… Don’t believe me do you? Ok check it out at yourhtmlsource.com

So why is it linked to the ‘#’ this is called an ‘anchored text’ tag. It doesn’t link to another page or website it links to someplace in the body of the content on the same page.

So lets edit these links right now.

Code:

 

<li><a href=”stuff”>This Month’s List of Stuff Not To Do</a></li>

                              <li><a href=”gary”>Gary’s Newest Article to Save the World</a></li>

                              <li><a href=”sweet”>Check Out These Sweet New Sites!</a></li>

 

Now we will have to finish the anchor tag in another lesson but just remember what you put in here for the anchor tags.

Ok well that is enough for today… My head is about to explode explaining all of this HTML stuff to you! 

If you have any questions please feel free to comment on the post!

 

 

How To Format An HTML Email Part 2


Welcome to How To Format An HTML Part 2!

Incase you missed it here is Part 1 We are going to start with editing the background and header of the email. After you have downloaded the .zip file from Part 1, or you can get it here.

Open up the Folder ‘Example’ then the File ‘index.html’ . This is a template page we will be editing. There is also a .css style sheet attached but for now we will not use the style sheet. Most email readers have difficulty rendering .css sheets. 

To do most of this editing you will need a text editor. I personally use Adobe’s Dreamweaver it’s very simple to use. So lets open the index.html file and you’ll see these first few lines of code:

<html> <head>    <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>    <title>Template 9 – Left Sidebar</title>    <link rel=”stylesheet” type=”text/css” href=”screen.css”> </head> <body>

Lets edit the background color by adding a couple simple lines of code:

<html> <head>    <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″>    <title>Template 9 – Left Sidebar</title>    <link rel=”stylesheet” type=”text/css” href=”screen.css”> <style type=”text/css”> <!– body { background-color: #000000; } –> </style></head> <body>

This has given us a black background  the color code # for black is : #000000. You can find any color you want using a color wheel.

Next we are going to edit the header image. Now here you can create a new header image/graphic in your favorite photo editor or graphic creator. I use photoshop because I’m very familiar with it. 

Look for this bit of code:

  <tr>                <td class=”header” align=”left” valign=”bottom”>                   <img src=”header.jpg” alt=”ABC Widgets” width=”580″ height=”130″ />                </td>  

            </tr>

As you can see the header.jpg image is 580 px wide with 130 px height. This can be easily changed to accomodate your new header image. If your header is 600 x 100 thats fine just change it to the appropriate settings in the above code.

However if you make your header image wider you are going to have to increase the width of the rest of the tables in your email so they don’t look all jumbled up!  I adjusted the header image to 780px width so therefore I need to change the width of the table above the header image.

Here is the code:

  <table width=”580″ border=”0″ cellspacing=”0″ cellpadding=”0″>             <tr>                <td class=”permission” align=”center”>                   <p>You’re receiving this newsletter because you <em><strong>SIGNED UP AT <a href=”http://www.yoursite.com” name=”top” name=”#top”>YOURSITE.COM</a> / BOUGHT WIDGETS FROM US</strong></em>.<br />                      Having trouble reading this email? <a href=”#”>View it in your browser</a>. Not interested anymore? <a href=”#”>Unsubscribe Instantly</a>.</p>                </td>             </tr>  

Change to :

  <table width=”780″ border=”0″ cellspacing=”0″ cellpadding=”0″>             <tr>                <td class=”permission” align=”center”>                   <p>You’re receiving this newsletter because you <em><strong>SIGNED UP AT <a href=”http://www.yoursite.com” name=”top” name=”#top”>YOURSITE.COM</a> / BOUGHT WIDGETS FROM US</strong></em>.<br />                      Having trouble reading this email? <a href=”#”>View it in your browser</a>. Not interested anymore? <a href=”#”>Unsubscribe Instantly</a>.</p>                </td>             </tr>  

See not that difficult is it?

Now there is one thing that I want to mention.

I made this mistake multiple times when I first started with HTML emails. Anytime you insert an image you need to place the image on your web server, and you need to insert the whole URL of that image into your HTML email. Example:

<tr>                <td class=”header” align=”left” valign=”bottom”>                   <img src=”header.jpg” alt=”ABC Widgets” width=”580″ height=”130″ />                </td>  

            </tr>

 

The header image above would not show up correctly in any email reader. It would simply show up as an empty box with the dimensions listed above!  You want to avoid this at all costs! So to fix it simply do this:

<tr>                <td class=”header” align=”left” valign=”bottom”>                   <img src=”http://www.yourdomainname.com/header.jpg” alt=”ABC Widgets” width=”580″ height=”130″ />                </td>  

            </tr>

Thats all you have to do to change the background color and header image in this email template.

Be on the lookout for How to Format an HTML Email Part 3 !

Technorati Tags:,

How To Format An HTML Email Part 1


Choosing Between HTML and Text

Many Email marketing professionals will tell you to stay away from using HTML for your email marketing campaigns if you are just starting out. This can be good advice if you don’t have any working knowledge of HTML. Simple plain text emails work just as well as HTML.

However I believe HTML emails not only look better but you can also add functionality to these emails. HTML emails can contain logos, pictures, backgrounds and other stylings that you can use to help brand your email campaigns. I think adding color and some style to your email campaigns never hurt! Unless of course those emails are not rendered in any popular email readers!

Many email readers have trouble rendering HTML! Microsoft’s Outlook and Entourage seem to be the best at rendering all emails, that may be good for you if most of your consumers are business professionals. However if your consumers use their personal email such as GMail, Yahoo, Hotmail and others then HTML is not rendered nearly as well in these readers!

If you have no clue what I mean when I say HTML then lets just play it safe and stick with simple text emails, however if you are ready to get into some simple coding then lets jump in!

HTML Emails

When starting a new email campaign you have to ask yourself what is the purpose of this email? Is it a newsletter, press release, sales flyer, etc? If you decided you want to start a newsletter then start listing out the areas you want to include in your newsletter:

  • Featured Articles
  • Columns with Guest Writers
  • News About Your Company
  • Sales that you have going on
  • etc

Then you can pick a template that seems appropriate for your campaign! There are a couple of sources that I like to use for Free Email Templates!

I like these templates because they are tested to work with nearly every email reader. Pick your template, I’m going to pick Template 9 with a left sidebar. 

Download this and we will begin editing it in Part 2!

 

Technorati Tags:,


Does PPC Help Grow Your Email List?


Does Pay Per Click advertising help grow your email list? Well it can if done correctly! PPC can bring hundreds or thousands of visitors to your website daily. The sheer amount of traffic coming to your site should be able to increase your mailing list. However you do have to put in some effort to help these visitors join your email list!

Add Your Email Sign Up to Your Landing Page-

Your landing page is what visitors see when they click through on one of your PPC ads. This page can be used to sell a product, offer a free download, it can even be your home page. Whatever the page is, if your focus is on growing your email list you have to make sure that your Email List sign up form is visible! It needs to be plastered on everything page of your site, and especially your landing pages! 

Even if your paid visitor doesn’t initially buy, and they usually don’t then at least try to capture their contact information! This way you have a way to continue your sales process and can eventually turn them into a happy consumer!

If your paying for this traffic coming to your site you at least need to get something out of it! If you have a long sales letter than make sure that the email sign up form is sprinkled throughout. If you are directing traffic to your home page make sure that you form is prominently displayed. There is nothing worse than paying from a visitor to come to your site and not getting anything out of it except a boost to your traffic. Granted you have more visitors to your site which is what you want. What you want more of is tightly targeted consumers coming to your site looking for their needs and desires to fulfilled!

Make sure that your email sign up form is on every landing page for every PPC campaign that you have! Don’t let any possible consumer get away from your site without at least giving them the option to sign up for you Email Marketing list!

Technorati Tags: ,


No One Knows When To Send Out An Email Marketing Campaign

 

Lets face it! No one knows when the best time to send out an Email Marketing Campaign(EMC). We can look at data and reports till our eyes pop out. But there is no set time to that guarantees a high open rate or click through rate on your EMC! It’s impossible! So what are we to do?  First you have to be able to track when your subscribers are opening your Emails! If you can’t do this then you’ll never be able to figure out the best time to send out your EMC’s.

  • Split your email list into two equal groups
  • Send the same EMC to each group
  • Send the EMC to the First group on Tuesday at 10 am
  • Send the EMC to the Second Group on Thursday at 10 am

Keep everything the same except for the date! This is a simple A/B test! Collect the results of these EMC’s did you get more open rates on Tuesday or Thursday? Stick with that day for your next campaign. Data shows us that Tuesday-Thursdays are the best days to send out EMCs. However, that doesn’t apply to every consumer base! You have to do tests and determine when you get the best open rates for your Email list! Ok so you have the results from the first A/B test.  Now lets test which time works better for your list. Are you consumers businesses (B2B) or consumers (B2C)? Why does this matter? Businesses and Business people will tend to open their Email during the day during working hours, as opposed to consumers who tend to check personal Email on their personal time! ( At least thats what numerous reports have said!)  So your collected the test results from your first test and it shows that you got a 35% open rate on Thursday at 10am and a 25% open rate on Tuesday at 10 am. So on your next EMC lets set the test up again. I like to ‘un-group’ my mailing and then re-arrange them into 2 new groups. Lets send one EMC at Thursday at 10am and the other at 1pm. Gather the EMC results! Which time had the higher open rate? If Thursday at 10 am had a higher open rate than 1pm. Then it’s the winner of this simple A/B test!  Now testing doesn’t stop here! You must continue refining your EMCs and keep trying to obtain the 100% open rate.  There are numerous variants to test for with your EMCs:

  • Time Sent
  • Day Sent
  • Headline
  • From Address
  • Design
  • etc.

This list could go on and on. Always test your EMCs and always build on what’s working!

echnorati Tags: ,

Do Facebook Ads work?


Facebook, now has 150 Million active users. If you have been on Facebook lately you’ve undoubtedly seen the ‘targeted ads’ when viewing other’s profiles, or maybe you haven’t. That’s what we’re going to talk about today.

Does advertising on Social Networks actually work or are customers ‘ad blindness’?  I have not seen any reports released that state click through rates and conversion rates from Facebook just yet. I have my feelings that they are on the way though!

Let’s think our way through this idea of advertising on Facebook… Why do people go to facebook? To get up to second news on what’s going on in all their friends lives right? They need that constant feed of news and gossip so they that never feel left out of the circle! While they’re on facebook are they actually looking to buy or be advertised to?

My immediate answer would have to be No! When I’m  on Facebook I don’t want ads to be sprayed all over the pages I just want to look at what my friends are up, what’s going on in their lives! However. Lately I have found myself clicking on a lot of ads! So I don’t believe consumers have ‘ad blindness’ I think the ads just need to be more tightly targeted.

Of course this is what Facebook has done. They have recently released their newest version of their ad market place with more tightly defined ad targeting. You may ask what ads have I been clicking on, (or maybe not)? I tend to click on ads that are relevant to me and my interests! WOW amazing concept isn’t it? I actually want to hear about stuff that is relevant to what I want. Now granted a lot of theses are for upcoming concerts in my area, but hey they know I like music so that’s why they are displaying these ads. Relevant is more loosely defined on Facebook than it is on Google of course, but they are in the Social Network biz not Search Engines!

As I said in the opening I have not seen any reports yet on Facebook click-through or conversion rates but I would have to suspect that the ads are getting better and better conversions! As long as Facebook keeps improving their ad marketplace with tightly targeted ads then it can be a fairly attractive option to start placing PPC ads! I do believe you can find your market out on Facebook, however you might be better off starting with a Social Network that appeals to a more narrow demographic!

Technorati Tags: , ,

Why Would You Want to Give Away Free Information?


Why would you want to give away valuable trade secrets or free products that you could eventually turn into a profit? That doesn’t make any logical business sense at all! Aren’t you just in business to make money and make a profit? If you aren’t then you’re not in business your just occupying a hobby!

WRONG!

When it comes to Online Marketing everyone gives away free things! It can be a free subscription (which is somewhat confusing because we usually associate subscriptions with purchasing) free white papers, free reports, etc. Everyone is giving something away! Why are these crazy business people giving things away? 

It’s quite simple actually, to get you to come back and look around their website more and hopefully purchase something! I’ve read numerous reports that say on average it takes 5-7 visits for someone to purchase from your website. For me personally it takes a lot more than that, but I’m very frugal!

The whole reason to give stuff away is to get you to come back and buy! Marketers realize that you are more than likely not going to buy on the first visit so they offer you something for free in exchange for your contact information. Usually just an email address and a first name and boom you have something free show up your email box!  

So what are you giving away? 

Develop a small product inexpensive product that is relevant to your business and offer it to new prospects for free! If you sell shoes develop a shoe fitting guide that helps show prospects what shoes to select according to how they have wore down their previous shoes!

See how simple this is? 

Offer this free product as an incentive for ‘Opting In’ to your Email list. Use an autoresponder to deliver an email with a link to your free product. Then follow up with set intervals and pre written marketing emails that lead prospects down the sales road! This is a very effective marketing tool to use especially for larger ticket items. 

Just remember you have to give something first before you can ever expect to receive something. Deliver something of value to your prospects and it will make tilt the odds in your favor of converting them to consumers!

Technorati Tags:,,

Is Social Media a Good Marketing Tool for Beginners?


Social Media is a Great and Cheap way to get your brand/company out to millions of eyes! Facebook has over 150 Million active users! Therefore that opens up tons of doors to get your website. However if you are just beginning to develop and online presence Social Media may not be the best way to go! 

Think about it  like this, what is the purpose of being out in front of millions of users if you don’t have anything valuable to offer? NOTHING. If you have a bare bones website with content spread out thinner than a sheet of paper no one is going to ever come back to your site! 

Social Media marketing has not been completely figured out just yet. The soul of  these sites is community, people don’t want to be marketed to in Social Networks. They come to these sites for a sense of belonging and to get away from all the marketing that goes around on the rest of the internet. 

If you are  an Online Marketing beginner I think your time and money could be better served on developing your own site and developing your relationships with your consumers instead of going out trying to make new relationships. If you feel like you absolutely need to be engaging in Social Media, then do so, however make sure its as an active community member offering something valuable to the rest of the community. Do not engage in Social Media just to try and promote your site, or your brand. If you engage in the Social Media community often enough and your engagements are relative then others will want to know more about you! 

If you’re an Online Marketing beginner stay away from using Social Media for Direct Marketing and use it as more as subtle brand building! Make your name a respected name in the community and with time you will be seen by others as an authoritative source and expert!

Technorati Tags:,,