Blog comments: links and formatting

Hi there, readers

Over the last few months, several bloggers have mentioned to me the ability to add web links and basic formatting (bold, italic, underlining) to blog comments - something which I do fairly routinely, but many others do not. So I decided to explain the techniques, and concluded that a blog post was probably the best place to do it.

It's all about using so-called tags, which are bits of text enclosed in angle brackets < >. These are in fact elements of HTML, the language in which web pages are written, and they act as instructions to the web browser, to tell it how to display parts of the text.

For example, if you want a piece of text to be bold, you put <b> where you want the bold text to start, and </b> (note the slash '/' before the 'b') where you want the bold text to end, like this: <b>bold</b> - which should appear in the posted comment as bold. You can include more than a single word between tags, so <b>here's some bold text</b> becomes here's some bold text.

Similarly, for italics, use <i> to start, and </i> to end - <i>italics</i> - and for underlining use <u> to start and </u> to end - <u>underlining</u>.

As you can see, there's a pattern here: a tagged section of text starts with something in angle brackets, and ends with the same thing, preceded by a slash, also in angle brackets. This doesn't work for all the letters of the alphabet, but there's at least one more that you might want to use at some time, 's' for strikethrough (<s>strikethrough</s>).

"So what about links?", I hear you say. Once again, it's the same basic idea, using tags to mark off the section of text that you want to be the link. For historical reasons, the letter to use is 'a' - not 'l', as you might expect. Also, of course, you have to say where the link should go to - the web page address that's usually shown somewhere near the top of your browser window - so there's more information to go in the starting tag. Thus the format ends up being like this:

<a href="http://www.blogger.com/">Blogger website</a>

which appears as this:

Blogger website.

Note some important bits:
- the space between the 'a' and the 'href' is necessary - the tag won't even be recognised without it;
- the 'http:' bit is also necessary - the browser won't know what to do with the link without it;
- the double quotes around the web address are probably not necessary but will help web browsers to recognise the address properly.

You can of course put any text you like between the tags, so if you want to display the actual web address as well as providing a link to it, you do something like this:

<a href="http://www.blogger.com/">http://www.blogger.com/</a>

which appears like this:

http://www.blogger.com/

Wandering slightly off the original topic, you can do more things with links than just connect to web pages: for example, you can provide a link to an e-mail address, which will open up an empty e-mail window. In this case, the 'a href=' bit is the same, but the contents of the double quotes are different, like this:

<a href="mailto:wanderingpom@orangehome.co.uk">send me e-mail</a>

which appears like this:

send me e-mail

Comments are welcome, and I'm happy for you to try out the things I've suggested in comments to this post.

Take care

Mark