Your Weekend Blog Tip

I thought that a cool little feature I could start doing on this blog would be to share little HTML tips for all of my bloggy friends out there.  They will be short and sweet, and hopefully you will learn something you didn't know before! So here we go.... blog tip #1:

How to encode your email address

Having a blog, many of us are scared to post our email addresses on it as links for fear that we will be spammed by bots or ghosts or people from China telling us they have an inheritance for us to claim. I see email addresses written like this all the time (and I admit, sometimes I am guilty of it too... when I am too lazy):

dana[at]thewonderforest[dot]com

Or other variations of the @ and .com.  I don't know about you, but personally I hate having to type out someone's email address and replace the [at]s and [dot]s with the real characters when sending them a note.  I'd much rather just click the link and have my email program pop up.  So how can you do this without the spam risks? EASY! Encode your email address.

Encoding basically turns your text into a bunch of crazy looking characters, so it can't be read by bots, etc.  There are a bunch of websites that allow you to quickly and easily convert your email address to crazy encoded characters... like this one.

All you do is type your real email address into the box, and hit "Encode".  Then, copy the encoded text to your blog and replace your email address with it.

for example, my email address looks like this when encoded: 
dana@thewonde
rforest.com

Pretty, huh?  So if I wanted to link my email address on my website like this:

dana@thewonderforest.com

I would enter (in HTML):

<a href="mailto:&#100;&#097;&#110;&#097;&#064;&#116;&#104;&#101;&#119;&#111;
&#110;&#100;&#101;&#114;&#102;&#111;&#114;&#101;&#115;&#116;&#046;&#099;&#111;&#109;">

&#100;&#097;&#110;&#097;&#064;&#116;&#104;&#101;&#119;&#111;&#110;&#100;&#101;&

#114;&#102;&#111;&#114;&#101;&#115;&#116;&#046;&#099;&#111;&#109;

</a>

So you're pasting the encoded email address two times. Once in the A HREF "mailto" code, and once where the actual name of your link would go. When you view your blog, all you will see is your actual email address, not these crazy characters as they stay behind the scenes.

If you wanted to link some text to your email address, you could also do this easily. To get a link that looks like this:

click here to email me

You could just change the purple text in the example above to your text, i.e. "click here to email me".  Easy!! You could also do this with image links.

Hopefully I didn't confuse the pants off of you!  Let me know if you have any questions! Do you think I should continue these little tips??

xo Dana