Rich HTML email signatures straight from Gmail

One of the benefits of using a dedicated email application like Apple Mail or Mozilla Thunderbird is the ability to send emails which included rich HTML signatures. These email signatures are easily recognizeable and often include hyperlinks, images, or a combination of the two. Although Gmail users could easily access their accounts via POP allowing for HTML emails, web-based users are were forced to use plain text signatures. For quite some time, I yearned for the ability to add a little more personality to my emails. Unfortunately, because I managed all my email accounts via Gmail’s web interface, the option was non-existent. That was until I discovered the Better Gmail Firefox extension.

After installing the Firefox-only Better Gmail extension, you’ll discover a handful of configurable options – one of which is the “Allow HTML in Signature” option under Gmail > Settings. Once the option is selected, you now have free reign as far as HTML signatures are concerned.

Getting started with your basic HTML signature

Before embarking on the task of creating an HTML signature appropriate for your own needs, take some time to read through David Greiner’s A Guide to CSS Support in Email. Although the goal for this tutorial is not as robust as a full blown CSS / HTML announcement email, the tables which outline what email clients support what rules is of significant value (well worth bookmarking).

Creating a single line signature + graphic

In order to show how easy it is to create an HTML signature using the web version of Gmail + Better Gmail extension, we’ll create a single line signature which includes 1) an avatar / favicon, 2) your name, 3) contact info, and 4) a URL (website, blog, etc.).

Unfortunately, due to some email client incompatibilities, the best way to create an HTML signature similar to that found in the image above is with the use of an HTML table.

Important: Notice the inline CSS? Inline styling for the form element allows us to resize and customize the color of the font. It is also very important not to neglect the <img alt="" which is displayed by default when a recipients mail client blocks images from emails.

Use your HTML signatures wisely

Keep in mind that most, if not all, free email services will – by default – remove external images from emails. That is why the aforementioned alt="" is important in order for recipients to know what they may be missing. Don’t overload your HTML signatures with too much fluff. Keep it simple and light; your contacts will thank you.

For the rest of you that are concerned about a graphic in the email signature, you should be aware that I, nor most of the people I know, will ever see it. I don’t display the graphics on my phone, in outlook nor when accessing mail via the web. Is it really worth the trouble putting it there?

whenever i tried to use canned responses, the problem is if i m sending mail to unknown person then sometimes mail first goes to spam!!!!!!
that is the big trouble
i dont want my mails to go 1 in spam & from there u have to allow them then after that all mails come directly to inbox….
need help!!!!!!!!!