Thursday, June 5, 2008

URLs

Here are some common questions about URLs and adding hyperlinks in Blogger.

What is a URL?
URL stands for Uniform Resource Locator. It is a way of uniquely identifying the location of a resource (such as a web page, an image etc) on the vastly complex network of the Internet.

The key word here is “uniform” meaning uniqueness; i.e. a given URL should point to one and only one resource on the Internet. In other words, the same URL cannot point to (i.e. identify) more than one resource. Two URLs, however, can point to the same resource.

How do I represent a URL in HTML?
HTML uses the “anchor” element ( i.e. <a>…</a>) to define URLs. The word anchor gives the idea of linking. When an anchor element is used to refer to a URL, the resulting entity is usually referred to as a hyperlink.

The usual syntax of the anchor element is shown below.

<a href="url to link to">Link Text</a>
  • <a …> is the opening tag
  • href (or hyperlink reference) is an attribute which carries the URL of the page to link to as the attribute value
  • Link Text is the text that will be actually displayed on the browser
  • </a> is the closing tag, which marks the end of the anchor element
For example, when:

<a href="http://bguide.blogspot.com">The Blogger Guide</a>

is entered in to the HTML code of a web page, the following hyperlink will appear on that page.

The Blogger Guide

How do I open a link in a new tab/window?
Sometimes when you click on a hyperlink, the target page opens in a separate window or tab of the browser. (Whether it opens on a new tab or a window actually depends on the settings of the browser)

The way to achieve this is to add the attribute target with the value _blank inside the opening tag of the anchor element.

E.g.

<a href="url" target="_blank">Link Text</a>

How do I add a hyperlink in Blogger?
There are two ways in which you can add a hyperlink in Blogger.

One is to use the Compose (i.e. WYSIWIG) mode editor.
Steps:
  1. Highlight the text that should be linked
  2. Click on the Hyperlink icon
  3. Enter the URL to link to and click OK
See the figure below for an illustration of the above steps.


The other method is to directly type the HTML code in the Edit Html mode of the post editor as shown below.


Note:
If you want add the target="_blank" part, then you have to use the Edit Html mode and change the HTML code.