If you want the browsers to download the content from your Website, an HTML download tag would be the perfect solution. But unfortunately there is no such tag as an HTML download tag. If you want to set up some file download files in your Website, you just link the file in same way as you would link a particular file in order to open in that browser window. Without a HTML download tag, you can initiate your download, as there are some ways to do it.

Do tell your Website readers regarding their Browser functionality

The browsers that are coming today are very modern in nature that has context menu. If you right click the mouse button this context menu will appear (or options plus mouse button for a one button Macs). Whenever you right click on a particular link, one of the options that appear on the context menu is “save link as…” or “save as…” if you choose this, that file which is on the other side of that link will be downloaded to a hard drive even though it could be opened in that browser.

To emulate HTML download tag, the simplest way or method is by telling the people to just right click on any of the particular link that is to be downloaded and you can write some thing like this as mentioned below

(Option-click or right-clicks on that particular link and then choose to do “save as…” in order to download that link to the hard disk directly)

In Order to download, compress the file

If you want to automatically download the file, then compress your file using your using your operating system and the compression is done by just zipping the file. The files that are zipped will automatically download.

With PHP trick the browser

At last, if you have the knowledge of some PHP, you can just use 5 simple line of PHP script, so that you cab force the Web Browser in order to download the particular file even without zipping the file or else you can ask the readers to do whatever they want. This type of method relies only on HTTP headers in order to tell the browser that this file is just an ordinary attachment rather than it is a Web document. (This PHP will just allow you to change HTTP headers).

]]> http://www.html.co.uk/147/what-is-the-html-download-tag.html/feed 0 http://www.html.co.uk/126/link-rot-explained.html http://www.html.co.uk/126/link-rot-explained.html#comments Wed, 14 Jan 2009 13:20:27 +0000 Editor http://www.html.co.uk/?p=126 Removal of a page from a website, by the web developer or a designer without putting up the replacement page which would describe the details of the previous pages, leads to the generation of the Link Rot. The reader is treated to a page not found or a 404 error message.

Why do page not found or 404 pages exist? The simple answer to this question is, that it is quite imperative to get some error message, when the user tries to go to the URL that does not exist. But unfortunately, this error message is still seen even when the URL exists. The only problem here is that the link does not exist in the location where the customer went.

There can be a number of reasons why the addresses of the pages are changed by their websites. Some of them are as follows:

• Our site was organised by us for its betterment
• We were not able to keep a proper track of our existing docs.
• Our site is getting rebranded
• Our hosting services have really gone down

At first these reasons might seem to be good enough for moving the page and leaving behind page not found or 404 error pages. But the truth is that, this change clearly indicates to the lack of planning and forethought at the time of creation of URLs.

Why care about the Link Rot?

You might not be aware about who will be having links to your site. You would want your targeted customers should bookmark your pages, but then suddenly your location is changed by you. You might feel that your navigation is too good and the customers should be able to find page anyway. But unfortunately, this is not always true as would be wished by the web developer. And the fact is that as a website owner, you have exactly eight seconds for forming your very first impression. If someone finds your URL in a book and after typing he gets a 404 or page not found error, there is every possibility that the user will not stay on your site long enough for navigating through your fabulous site.

Do not complain about Link Rot If you cause Link Rot

You are the prime contributor of the link rot if you have complained of it and ultimately changed your page locations without actually compensating or it. But unfortunately, the developer usually gets blamed for linking to you.

The first and the foremost thing is to consider permanent URIs. If your web pages are not at all well organized, take a deep breath and move on. Once your vision is set to recognize your site, make use of the tools which are available with the server for relocating the URIs. But, in case if you do not have the access to the server level redirects, you always have the option of using the JavaScript or meta refresh tags.

Organize Intellectually

• Always date your articles
• Don’t date static pages
• Leave out information
• Consider your software

Do not be a contributor to this link rot. You should always try and make the pages of your site stick around. If at all there is a possibility of moving them, always remember to leave the redirects up so that the customers are still able to find what they have been looking for.

1) External Hyperlinks
2) Internal Hyperlinks

External hyperlinks are those which points to another web page. On the other hand, internal hyperlinks are those which points to a different location on the same web page. Both the links are created by using <A> (anchor) tag. We can create the hyperlinks with the help of three attributes:

a) <A>, the anchor tag
b) HREF=””, which is used with the <A> tag
c) URL, which is used with HREF to tell the link where to redirect the user.

For example: to create an external hyperlink we can write the HTML code as:

<A HREF=”http://www.yahoo.com”>Go To Yahoo</A>

According to the above example, if you click on ‘Go To Yahoo’ text, you will be redirected to http://www.yahoo.com URL which is mentioned with HREF attribute.

Sometimes, we also need to jump to a specific location on the same web page instead of going to another web page. In these circumstances, internal hyperlinks are used. To create internal hyperlinks we have to decide the location and its name. Then, the name of that location will be used to jump to that location. When a particular location is identified, then to assign a name to it the ‘name’ attribute is used with the <A> tag. For example:

<A NAME=”bottom”>BOTTOM</A>

<A HREF=”#bottom”>go to the bottom </A>

In the above code, first of all we have assigned a name to the text BOTTOM as bottom with the help of NAME attribute. This text is written at the bottom of the web page. Then, in the next code we have specified that name after the HREF which will take us to the bottom of the page. One more thing which is to be noted here is that there is no filename before the # sign. This indicates that the link is pointing towards a location on the same web page.

Apart from external and internal hyperlinks, we can also insert e-mail links in the HTML documents. For this purpose, ‘mailto:’ protocol is used instead of http. For example:

<A HREF=”mailto://query@contentmantra.com”>Post your Queries</A>

According to the above example, if somebody clicks on the Post your Queries text, then the query will be submitted to query@contentmantra.com. For this purpose, after clicking on the link Microsoft outlook will get opened by default if it is installed on the system.

<A HREF=”URL”><IMG SRC=”d:\my folder\image1.jpg” WIDTH=”300” HEIGHT=”100” BORDER=”10” ALT=”This is the main page”></A>

The URL specified after the HREF attribute will tell the hyperlinked image where to redirect the user when he clicks on it. This URL can be a path to a .html document or it can be the name of an image file also.

For example:

<A HREF=”image2.html”><IMG SRC=”image1.html”></A>

Or

<A HREF=”http://www.yahoo.com”><IMG SRC=”image2.html”></A>

We can also make a hyperlink to point to an image. It means that when the user will click on the hyperlink it will be shown the image associated with that hyperlink. The code for this can be written as:

<a href=”http://www.contentmantra.com/image1.jpg”>Click here to display image</a>

Whenever the user will click on the ‘Click here to display image’ text, he will be shown image1.jpg located at http://www.contentmantra.com. After the image is displayed, you can right click and save it to your computer’s local hard drive. You can also use the target attribute of anchor tag to tell the web browser where to open the new image. The most commonly used predefined values of target are _blank, _self, _parent, and _top. Each of them will open up the image or the document associated with the hyperlink at different locations. The details of all the four values are as follows:

1) _blank: This will open the linked image/document in a new browser window with no name.
2) _self: This will replace the current html page to show the linked image/document. If the original document which has hyperlink on it is in a frame or frameset, then the _self will open up the linked image/document within that frame.
3) _parent: It will replace the html page it came from.
4) _top: This will load the linked image/document in the current browser by replacing anything within the browser.

The use of the targets is not mandatory. They are optional attributes which may or may not be used with <A> tag.

Links are the basic hypertext constructs, which help you to navigate from one resource to another either on the same page or between two pages. Images on the other hand are basically used in the background of the document or in the web page and maybe sometimes even in the logo. So the need arises to format this image or even add a new image. For all these purposes we need some tags related to images and links. When you use the tag <BODY> and </BODY> as tag then you are referring to the body of the text document. To change or edit the visited colour code you use the tag

VLINK=”#Colour Code” and

For unvisited colour code, you can use the tag

LINK=”#Colour Code”.

<A Name = “Label”> moves to the other portion of the web page. This link tag helps in navigating between web pages. <A HREF=”Item Location> helps you go to the destination marked by this link. So links are basically used to get two items or pages linked. This way documents are shared on the web.

You can use similar tags for the images too. Let us study each tag one by one. This is indeed a fun way of learning the HTML tags. You don’t need to be a master to understand this. Even basic computer knowledge is helpful to understand the tags. When you wish to import an image from its location, you need to use the tag
<IMG SRC =”Image Location”>. You can either align the text at top middle position and bottom middle or align it left, right and center. For this you use the tag

ALIGN=”Left, Right” and ALIGN=”Top, Middle, Bottom”

For alternative text you use the tag ALT while for bordering the image use the tag border. You can even change the width of the image in pixels by using HTML by using the tag WIDTH. Similarly, the height can also be changed by using HEIGHT. You may also decide the amount of horizontal and vertical space you require around your image by using the tags VSPACE and HSPACE. Now this is easy and you don’t need to be afraid of HTML programming anymore. Not that tags form HTML programming but they are definitely the basis for this programming and without understanding this you cannot move ahead.

Let us see how to add an image to your web page. You need to use the following command to add the image:

<img src=” . . . “>.

In the area marked by dot, as shown above, you need to place the name of the file containing the image you are planning to use to add the image.

The possibilities described on this page do belong to the stone age of HTML (1995), and are unfortunately not supported by all popular browsers today. Nonetheless, they offer one the amazing possibility to explicitly declare internal hypertextual dependencies of an HTML file, such as the previous or next page, or the sub-page and more. Search services or software can then produce entire “Site maps” of your HTML project, as in graphical representations of the site’s layout.

Web browsers should, if you find such tags in an HTML file, display a button or similar user element for the tags. By clicking the buttons, the user should be able to jump to the linked destinations. Microsoft has yet to adopt this reasonable navigation possibility, while other browsers, such as Opera, have long used it. Firefox has economised the navigation possibility with an individually installable extension (Firefox Add-ons).

You can write tags such as home page, index, glossary, help, first, previous, next, last and so on for every HTML file. However, you can also only use the tags you require. The following example shows link elements defined for this page.

<head>
<link rel= “author” title= “About Us” href= “http://www.html.co.uk/about”>
</head>

Explanation:

With <link rel you introduce a logical file relationship. Afterwards the type of file relationship follows. The following are recognised attribute values:

rel= “contents” relates to the contents.
rel= “chapter” relates to the chapter.
rel= “section” relates to the section.
rel= “subsection” relates to the sub-section.
rel= “index” relates to the index.
rel= “glossary” relates to the glossary.
rel= “appendix” relates to the appendix.
rel= “search” relates to the search function.
rel= “author” relates to the author.
rel= “copyright” relates to the copyrights.
rel= “next” relates to the next file in the “guided tour”.
rel= “prev” relates to the previous file in the “guided tour”.
rel= “first” relates to the first file in the “guided tour”.
rel= “last” relates to the last file in the “guided tour”.
rel= “up” relates to a higher level chapter page in the domain.
rel= “top” and rel= “start” relate to the starting page or home page.
rel= “help” relates to the help section.
rel= “bookmark” relates to a general point of orientation.
rel= “stylesheet” relates to a file with style definitions that are used to display the site.
rel= “alternate” relates to files with the same content as the current site, but in a different document version.
rel= “alternate stylesheet” relates to a file with alternate style definitions, which can be used for displaying the site if the user so wishes.
rel= “shortcut icon” relates to the icon shown for the site in the favourites.

You can also write multiple link elements with the attribute values chapter, section, subsection, appendix, bookmark, alternate, stylesheet, and alternate stylesheet if desired.

The href attribute serves to ensure where link with a destination should lead to. The same rules apply with value allocation as with regular links.

You can define the caption used by the browser when displaying the link button with the title attribute. The information should describe the link destination.

The following possible attributes inside a <link> tag are:
media for determining the export medium.
target for information on the destination window, that the link should direct to. With frames it can be one of the defined frame windows. But a reserved window name can also be entered: target= “_blank” opens the link in a new browser window, target= “_top” opens the link in the entire browser window and prevents the display of all eventually displayed framesets, while target= “_parent” opens the link in an upper level frameset and frees the display from the inner frameset.
hreflang allows you to enter the link destination site’s language using the language abbreviations.
charset allows you to specify the encryption the link destination uses.

The link element can also have universal attributes.

Take Note:

Next to the effects of the link elements in HTML, there are also additional elements that serve to define certain downloadable fonts.

An example:
<link rel= “fontdef” src= “http://www.meine.com/fonts/chianti.pfr”>
That way you define the font called chianti.pfr inside the HTML file. We will examine the topic of downloadable fonts more closely in a separate section.
If you work in XHTML standard, then you must write the link element as content less. Write the standalone tag in the <link … /> form to do so.

Backtracking Relationships

Backtracking relationships are envisioned for “bidirectional” relationships between two HTML files. This is the case if document A links to document B and B also links to A, if both are logical linking targets for the other.

Just like the logical file relationships, backtracking in button form should also be possible, although the main browsers remain silent on this option. Search engines can reach interesting conclusions regarding a project’s hypertext structure with backtracking relationships.

An example from file_1.htm:

<head>
<link rel= “alternate” href= “file_2.htm” title= “second reading method”>
</head>

An example from file_2.htm:

<head>
<link rev= “alternate” href= “file_1.htm” title= “first reading method”>
</head>

Explanation:

With <link rev you introduce a backwards relationship. Otherwise the functionality is identical with <link rel used for the logical relationships to other sources. The same attributes are also possible. In the example above you can see how two HTML files, whose supposed content concerns the same topic from different points of view, can logically be linked with one another through backtracking.