banner
Welcome to HTML.co.uk, the number one resource for all news, information, and happenings regarding HTML.

Updates: HTML.co.uk has just been relaunched. Subscribe to our RSS Feed to stay on top of HTML news and techniques.
Jun
10th

Different types of URLs used in Hyperlinks

Author: Editor | Files under HTML Basics, HTML Tutorials
Tags for this article: , , , , ,

As discussed earlier, Hyperlinks are those elements of HTML which makes it possible for us to navigate through different web pages or to different locations within a single web page. They are also used for adding e-mail support in the HTML document. In fact, hyperlinks act as the backbone of a website. As these links are used to fulfill different types of needs and demands, the way they are defined in the HTML document varies according to the circumstances. Every hyperlink needs an address to the location where the hyperlink is intended to redirect us. Technically speaking, each hyperlink needs a URL in order to point towards another location. External hyperlinks points towards a webpage of a different website on the same web server, whereas internal hyperlinks point towards a location on the same web page or to a different webpage of the same website. He structure can be more complex if a hyperlink is intended to point towards a web page of different website on the different web server. In each of the cases the way a URL is defined differs. It is very important to understand and learn the different ways to write the URLs because each type of URL changes the meaning of the hyperlink. The syntax of the URLs decided whether a hyperlink is internal, external or it is an e-mail link. Below are some examples of most common ways to write the URLs, each changing the intended meaning of the hyperlink.

1) <A NAME=”bottom”>Bottom</A>

<A HREF=”#bottom”>Go to bottom</A>

This is an internal hyperlink which is redirecting the user at the bottom of the same web page which he is currently viewing. To make this hyperlink an internal one, note the way the URL is written after the HREF attribute of anchor tag. There is no file name or path to a file name before the # sign. This makes the hyperlink an internal one.

2) <A HREF=”welcome.html#hi”>

This is an example of a hyperlink which redirects to a different document of the same folder. This means that both the linked documents are contained under the same parent folder.

3) <A HREF=”hello/welcome.html#hi”>

This is a hyperlink which points towards a different document residing in a different folder. But, in this case both the folders whose web documents are linked with each other are on the same web server.

4) <A HREF=”http://www.yahoo.com/good/hello/welcome.html#hi”>

The above example represents a hyperlink which is pointing towards a different web document which resides in a different folder on a different web server. This makes the hyperlink completely an external one.

5) <A HREF=”mailto://queries@content mantra.com”>

This type of URL consisting of ‘mailto:’ protocol indicated that the hyperlink is linked to a mail server.

So, the way URLs are used, changes the purpose and functioning of the hyperlinks. In fact, how much information you should include in the URL of a hyperlink depends upon where the hyperlink is redirecting the user i.e. where the linked resource is is located.


May
20th

HTML: Navigation within a Document

Author: Editor | Files under HTML Tutorials
Tags for this article: , , , ,

With HTML things have changed drastically and definitely for the good. Just imagine when at one point people just could not afford the communication cost, HTML has changed the communication technology. It did not do the whole changing but it definitely played a major part in the revolution. Without the development of HTML, things would not have been what they are at present.

So far we have seen how HTML was initiated and what all happened in its development stage. How many versions have been there and what were the changes made in each version. The basic HTML structure, the meaning of tags, what role they play in HTML designing. We have gone through the basic reason for developing HTML. Now sharing and linking being done, we still have to scroll through the topics. Many web pages have something like hundred topics on one page and scrolling to each topic can be laborious and useless. You feel times have changed but still there are many dreading jobs which can be avoided but how you don’t know. Well for those who put up a hundred topics on one page and cant afford another page for the topics should make way for navigating from one topic to another. This makes life easier and saves a lot of time used up by unnecessary scrolling. But before we proceed with the linking in the same document we need to know something about linking. A link, hyperlink or web link, forms the basis of the HTML language. There are two ends to a link- called anchors and a direction. A Link starts at the source anchor and destination anchor. Let us see how this scripting is done in HTML.

<H1>Table of Contents</H1>
<P><A href=”#section1″>Introduction</A><BR>
<A href=”#section2″>Some background</A><BR>
<A href=”#section2.1″>On a more personal note</A><BR>
…the rest of the table of contents…
…the document body…
<H2><A name=”section1″>Introduction</A></H2>
…section 1…
<H2><A name=”section2″>Some background</A></H2>
…section 2…
<H3><A name=”section2.1″>On a more personal note</A></H3>
…section 2.1…

Without going into the technical details, here we have seen how the source and destination anchors are used and what exactly their purpose is. Now similarly we can also navigate from one part of the document to the other part. There are some steps involved in doing so. We have described the method in the next few lines. You can use the normal anchor tag here to navigate from one part of the document to another. Here instead of using name of another page, you can use the same portion of the document. You can name the area of the document you are interested in navigating in the bracket named area. This code looks something like shown below.

name=”name_of_area”>text</a>

you can call a link to the place you are right now to go to the area you want to you can use a statement given below.

href=”#name_of_area”>text</a>

HTML has definitely improved the way a web page works. It has given various features over its development stages. We always find some new addition or unwanted deletion in the new versions.