In the past, I have written about the value of purchasing a professionally created website template, however if free is the way you want to go then I can certainly understand. That said, a site you might want to look at is TemplateMo.

TemplateMo offers a variety of free templates ranging from pure HTML/CSS, Flash and WordPress. There are lots to choose from so the odds are you will find something you like.

The templates on the site are free for any use you see fit and you can modify them as needed. The author only asks that you provide a link back to their site so they can receive credit for their work.

In Windows Live Mail (as in the e-mail client and not the web site) the default method for an e-mail signature is nothing but plain text, like this:

You can however create advanced e-mail signatures using the freely available Nvu web page editor.

Here’s how it’s done.

1. Download and install Nvu. It’s free.

2. Copy any images you plan to use to the folder My Stationary.

My Stationary is a folder you already have on your computer, located under My Documents. This was created when you installed WL Mail originally. Any images to be used in a signature must reside in this folder, else it will not work.

For the example below I’m going to use a small image of myself:

The above is a 48×48 pixel image. You should keep whatever image you use small so you don’t annoy the people you send mail to. If you’re asking the question, "How big is too big?", try not to use anything over a 100×100 image.

If you have an image you’d like to use but it’s too big, you can resize it quickly using Pixlr editor. This is a free in-browser editor (no need to install anything). Load that site, open the image you want to edit, click Image then Image Size from the black bar at the very top and resize to 80×80 or smaller, then save as PNG or JPEG.

When your images are ready, copy any you intend to use to the My Stationary folder.

4. Launch Nvu and save a blank signature first.

When you first launch Nvu you will be given a blank web page to edit, much like editing a new document a word processor. The first thing we’ll do is save this file. This is necessary to do first so that images can be added in more easily.

Click the Save button. You will be prompted to title the page. Call it signature, like this:

Click OK.

You will be be prompted to save the file somewhere. Navigate to the My Stationary folder and save your file as signature, like this:

The file will be auto-saved with the .html file extension.

5. Edit and save your signature.

First we’ll add in the image. Click the Image button at the top of Nvu. A new window will open.

Click the Choose File button.

Example:

You will be automatically placed into the My Stationary folder to find the image you want. If not, navigate to My Documents then My Stationary. Find the title of the image you want to add, then double-click to open it. 

After that, tick the option for Don’t use alternate text (if you don’t, Nvu will force you to use alternate text for images, which is not necessary).

You should have something like this:

Click OK.

Your image will be inserted into the page.

After that, type in some text you want in your signature.

For any text you want linked to another web site, highlight the text and click the Link button at the top of Nvu.

Here’s an example of what you could have:

The last thing we’ll do is change the font.

Press CTRL+A to highlight everything in the page.

Click the drop-down menu that states Variable With or Mixed and pick Helvetica, Arial like this:

It is strongly suggested that you only use Helvetica/Arial, Times or Courier as everybody has these fonts installed on their computers. If you choose a font that is non-standard, chances are high that it will show up as nothing but Times New Roman (or other standard serif font) on the recipient’s computer.

Lastly, adjust the font size by using the font increase/decrease size buttons:

Remember that you can highlight and select different text just as you would in a word processor program, adjusting some to be one size and other text a different size.

Here’s an example of what you could have:

When we’re all finished, simply click Save and close Nvu.

6. Enable the signature in Windows Live Mail.

In WL Mail, press ALT+M to bring up the menu, then click Options:

For the new window that appears, click the Signatures tab, then tick the option File at bottom, like this:

Click the Browse button to the right of File.

From the Open window that appears, change Text Files to HTML Files, like this:

Navigate to your My Stationary folder and select signature (this is the file you just saved a few moments ago).

At this point you will see the file path next to File, similar to this (the path will be different on XP computers because My Documents is in a different location):

Make sure Add signatures to all outgoing messages is checked:

Click Apply then OK.

7. Compose a new e-mail to yourself to test it out.

If all goes well…

Success! Your new advanced signature works!

Questions answered

My signature doesn’t look the same as it did in Nvu. Did I do something wrong?

No. You’re probably viewing and/or composing mails in plain text only.

In Options/Read, uncheck Read all messages in plain text, like this:

In Options/Send, the Reply to messages using the format in which they were sent checkbox must be unchecked, the Mail Sending Format must ticked as HTML, like this:

How do I re-edit my signature?

Launch Nvu and open the signature file from the My Stationary folder. Make any edits you wish, then save. It will instantaneously take effect in WL Mail on any future mails you send out.

Are the images I use in my signature attached as inline?

YES. They are attached to your e-mail and sent inline without any need to host them externally on other web sites like ImageShack or PhotoBucket. Your signature will never "break" because it will be not be dependent on any external image hosting whatsoever.

Can I use colors when editing my signature?

YES. You can highlight any text and make it any color you want.

Can I use advanced features when editing my signature such as tables, horizontal rules, paragraph alignment and so on?

YES. You can use all those things.

What can’t I do with my signature?

You can’t do anything that involves scripting of any kind. For example, if you entered in some JavaScript, that absolutely would not work. Everything in your signature file must be static in nature (which it is by default).

Why must the signature file itself and images I use be in My Stationary and not in a more convenient spot?

WL Mail has a feature called Stationary. It is something not too many people use simply because the stationary choices are terrible, and the way to create them is even more terrible (File / Save as Stationary doesn’t work, and the Stationary Wizard via the Options/Compose tab/Create New button isn’t too much better).

The signature file itself must reside in My Stationary for any signature images to work. For example, the image I used was menga48.jpg. When in the My Stationary folder, the HTML markup written by Nvu has src="menga48.jpg" in the <img> tag for the file path. If it were in any other directory, Nvu as well as any other editor would write something like src="file:///some-local-location/menga48.jpg", and that simply will not work.

Images for signature use almost must reside in My Stationary for file path reasons as well. When you have both the signature HTML file and the images in My Stationary, everything works.

Can I "export" my signature?

YES. Copy the signature.html file and whatever images you use to a USB stick, go to any other computer with Windows Live Mail installed on it, copy the files to the My Stationary directory on that computer, then follow steps 6 and 7 above.

What e-mail account types will this work on?

The signature will work regardless of account type, be it POP, IMAP or HTTP (Hotmail).

Is it absolutely required that I use Nvu?

No. Dreamweaver will work as will coding your HTML file "by hand" even with something as simple as Notepad. The editor is not necessary. I only mention it because it’s easier for most people to work with.

Can I use my word processor to export an HTML for use as a signature?

I highly recommend against doing that because word processors export HTML files with lots of useless junk code – so much so it may crash WL Mail on attempt to use it as a signature.

I use Outlook Express 6 and not Windows Live Mail. Will these instructions work if I’m using that software?

Yes, but the stationary folder on most XP computers is this:

C:\Program Files\Common Files\Microsoft Shared\Stationery

You will have to substitute My Stationary for the this folder if you want to do this in OE6 using the above instructions.

Also remember that signatures are not shared. If you use a signature in OE6, it will not import over to WL Mail so you will have to manually copy the files from the OE6 Stationary folder to the WL Mail one.

I learned of fixoutlook.org from this article, so I’d like to add into the fray why I don’t use Outlook personally.

First of all, I used to use Outlook. And I’m not talking about Outlook Express here, I mean the full version of Outlook. The client was good but there were certain things about the software that really rubbed me the wrong way.

I couldn’t stand the "heavy" nature of it. Outlook has always been a beast. Yes, I know it has a ton of functionality to it (which is a huge perk), but the tradeoff is that the software is huge not only in size but also in what it eats up for memory.

It’s a target. The only time I ever, and I mean ever, got viruses from emails that actually infected my computer was from Outlook. Being it’s so widely used it is a huge target for getting your computer infected. In an enterprise environment this isn’t really a problem since there’s an I.T. staff ready to take care of problems like that, should they occur. But for the home user, you really have to make sure you’ve got some better-than-average protection specifically for your email when using Outlook.

The Word rendering engine. This is a huge bone of contention with a ton of people and the primary focus for the article linked above. I also hated this because that engine never rendered HTML emails correctly. And for Outlook 2010 it’s probably not going to change.

The reason the Word engine is bad is because it’s the "Microsoft Way" of viewing email which does not follow web standards. And yes, this has to change. Email should be rendered in the client in such a way where it follows standards like everybody else does it.

Do you use Outlook now? Is there stuff about it you can’t stand?

(I’m particularly interested in I.T. guys out there who have to support this thing on an enterprise level.)

Let us know by posting a comment.

If you have done any web development, you are probably very aware of the ‘quirks’ different browsers have and ultimately have to try to make your site work with them as best you can. Now that Internet Explorer 8 has been released, a site you might find useful is this post titled “Site Compatibility and IE8“.

While not a comprehensive list, this is good reference (many of the comments are helpful as well) for trying to troubleshoot any IE8 compatibility issues you may have. As you can imagine, most issues are going to come from any javascript you may have on your site.

Hopefully one day all browsers will be able to just get along…

What makes the Internet into the “world wide web”? Or more accurately, what makes it a “web”? It is links. See, if there is a web page floating out there on a server with no links pointing to it, it might as well be completely off the Internet. Nobody can get to it! It is links which link one web page to another and it is links which form the continuous flow that is the Internet experience.

Obviously, a link is essentially an element on a web page that, when clicked, takes the user to another page. When that link is a text, it is usually signified by being an underlined and your mouse cursor will turn into a little hand. You clicked on a link to get into this very lesson.

OK, now let us jump right into how to create a link.

Please Login or Register to read the rest of this article. Gold/Silver Membership required.

Tables are something you will probably need to make use of on your web pages. You may use them to simply structure your data for easy viewing. Some people actually use tables to form the basic layout of their pages. I will address using tables for design later in this course. For now, let me simply introduce the HTML needed to create simple tables.

Please Login or Register to read the rest of this article. Gold/Silver Membership required.

OK, it is now time to start actually creating a webpage. In this lesson, I am going to introduce you to HTML. In the following lessons, we will get into specific areas of HTML.

HTML stands for Hyper Text Markup Language. An HTML file is just a text file which contains small “markup tags”. A markup tag is a small little bunch of text which tells the web browser how to display things on a website. And HTML file must have an HTM or HTML file extension, and that file can be created in any simple text editor. HTML is NOT a programming language.

Please Login or Register to read the rest of this article. Gold/Silver Membership required.

If you’re administering your own web pages (or possibly WordPress themes,) it’s more or less required to know Cascading Style Sheets, a.k.a. CSS for short. In the video below I give a very basic tutorial on how to adjust font styles using CSS.