Have you ever thought of linking different parts of a single image to different web pages or documents or such other things. Sounds crazy! You can actually do this using Microsoft Front Page or such other html developing tools. In this article, I have listed down the steps that will help you achieve the same using Microsoft FrontPage.

Step 1: Inserting Image

1. From the Insert menu, go to Picture and select File.
2. A Picture dialog appears. In this dialog, browse to the destination of the image, select the image and click the Insert button, the image gets inserted.

1. If you notice, the image displays multiple things; a laptop, a mouse, a mobile, and an internet accessing tool connected to one of the USB port of the laptop. You can hyperlink these parts of the image to different websites or html web pages.

Step 2: Hyperlinking different parts of an Image

1. From the Drawing toolbar, select the Rectangle box.

1. Place the cursor on the part of the image that you want to link and stretch it. On stretching, the selected part is covered by a rectangular structure as shown below.

1. Right click on the rectangular structure and select Format AutoShape from the drop-down menu, a Format AutoShape dialog appears as shown below.

1. Now adjust the transparency to 100% and select No Line for Color and click OK. The rectangular drawing becomes transparent with no lines. But if you want to distinguish this part of the image with the rest, then you can make the lines of the rectangular structure appear in distinct color as shown below.

1. Click to highlight the rectangular structure then right-click. From the drop-down menu, select Hyperlink. You can also access the hyperlink option using CTRL K.
2. To link the image to a website, in the address filed of the Insert Hyperlink dialog, insert the path of the website and click OK. You can also link it to a different image or a document as per your requirement.

In this way, you can link the different parts of a single image to a different websites or documents or web pages and it is better you highlight that area with a distinct color as show above which in one way will help to attract the attention of the user.

The template should include heading and exterior coding and should look something like this:

Coding in Hypertext Markup Language

"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd"

Computer programming is done by using number combinations. All computer functions are writing using binary which uses "00" and "01" to ask the computer "no" or "yes" about each bit of information. That was tedious, so programmers developed a system called machine language to make telling computers what to do easier. That was still pretty hard for people who do not like numbers. There needed to be an easier way for ordinary people to tell computers how to do easy things--like make web pages.

Hypertext Markup Language is a code using letters that lets a computer turn our commands into binary and back into something we humans can easily read. HTML is one of the easiest kinds of computer coding to learn. It has many uses, but the way it is used most often is to create personal web pages. There are software packages such as "Dreamweaver" that let people do this without even knowing HTML code. There are books and websites that give directions for people who want to write their own code.

Today we are going to look at three simple code commands: "bgcolor" , "Paragraph", and "un-numbered list". With these three commands, you can create a very simple web-page. If you like doing this, the attached list has a book and two webpages that tell more about how to make a webpage.

• Sams Teach Yourself Web Publishing with HTML 4 in 21 Days
• HTML Goodies
• Bare Bone

At first glance, this seems like a lot of information. But presented to the student on portable medium (floppies, when I first started teaching this, more recently, on flash drives or down loadable from a central file on a server), this provides a basic framework into which students can place their own paragraphs. It also provides information (once they have saved it as a web page rather than a text document) about resources for finding additional coding.

Try it out for yourself. Copy the coding, paste it into a simple text editor such as notepad (word processing programs add too much extra coding to be efficient), and save the results as an html document. To save a text document as a webpage, in the save bar type “name.html”. When you save the document, it will acquire the icon of your favorite browser. Click on it, and it will come up as a webpage. Pretty cool, huh?

The kids love it! The AHA moment when their coding turns into a bonifide webpage is my favorite part of teaching web design. The next part is even better-this is when they start to substitute their words for mine, change the page color, work with different backgrounds. Some students approach the whole process as a teacher-imposed nonsense, but most take off and run with it. Providing web-pages with added lessons and alternative coding allows the ambitious ones to take off on their own.

For those students who are having more difficulty with the process, my next official additions to their abilities are tables, adding a picture, and adding links to existing webpages and finally, links between three pages of their own. If the school provides email for students, being able to post their email address becomes part of the assignment.

Since middle-school students usually range from ages 11 through 14, security is certainly an issue. Therefore, the students' pages are not published on the internet as such, but rather on the school intranet. If this is not an option, their work is saved to portable medium so that they can take it home with them.