By Colin Polonowski
|
Images Last issue we covered most of the text related HTML tags. Of course most HTML pages these days also make use of pictures to get their point across. It is infact relatively simple to incorporate graphics into your designs. Virtually all browsers support both GIF and JPG so it is up to you which format to use. JPG files are usually much better for photographs as they allow your pictures to contain millions of colours and are also relatively small. However, GIF images have a number of advantages...
Unfortunately, Compuserve - the owners of the GIF format - have introduced a licencing fee to any software making use of it. Once you have your graphics your ready to start spicing up your pages. Images are added with the <img src=".."> tag. Various attributes can be assigned to graphics ranging from their horizontal and vertical dimensions to the position on the page they occupy. The following examples demonstrate a few of these attributes:
Text wraps around images depending on where they are on the page. Other important attributes for images are:
Anchors The whole point of Hyper Text systems is their ability to 'link' to other sections of the overall document. HTML is no different and it enables you to link to other pages or to different parts of the same page. This is achieved by making use of the 'Anchor' tag. This tag takes the form <a> ... </a> and requires the use of a number of attributes. For example, the following code is used to link to another HTML file:
<a href="glossary.htm">Click here for Glossary</a> This is the most common form of the anchor tag. The href attribute contains the URL of the page you wish to link to. You can link to pages anywhere on the internet by specifying their full address in the URL:
Images can also be used as links, in fact anything between the start and end anchor tags is treated as a link. The other main use of the anchor is to jump to certain areas in the page you are already viewing. You must first decide on the points where anchors will be added and then they must be given names:
Now to jump to this area via a standard href link, a second anchor is added. The URL is the same as that defined in the name tag but it is preceeded with the # sign:
In fact, both of these examples can be combined. Say you have a contents page which is separate from the rest of the document. You define the name tags in the main document and then link to them from the contents page as in the following example:
Anchors do not have to link to HTML pages. You can link to a picture which the browser will display, binary files such as ZIP or LZH can be linked to and the browser will ask the user to save them to disk. You can also add links for email as in the following example:
This creates the link below. When you click on it, the your browser will allow you to send an email to the address in the URL.
Other possible links are:
Finally, there is one more important attribute which wil become very useful in later issues when we cover Frames. This is the target="frame" attribute. This allows you to specify which frame to open the page in. If you wish to override the frames then you would use the target="_top" attribute which opens the page into the whole window. Next Time Next issue we will cover the use of imagemaps and tables in your documents.
|
