Why should you have a Website ?

How can TechKnow help you ?

What you do not need for using TechKnow ?

What you need for using TechKnow ?

Module 1

1. A website is a collection of webpages. A number of individually designed webpages but linked together forms a website.

 
2. There are two aspects of a webpage. One is the actual appearance of the webpage as is browsed by the end-user (Webpage Viewing) while the other is the source code page which controls the appearance of the webpage (Webpage Designing).

 
3. For Webpage Designing, TechKnow makes use of simple word editor Word Pad (which comes installed in all computers with Windows software) or any other word editor which can save the files with the extension name as "txt", such as Test.txt, KnowNet.txt etc.

 
4. For Webpage Viewing, TechKnow makes use of either Internet Explorer or Netscape Navigator.

 
5. TechKnow will teach you to write source codes for Webpage Designing in a language called HTML or Hyper Text Mark-Up Language. So better get used to hearing this word more often as we proceed ahead!

The first web page we will be designing using HTML will display the following text when viewed with a website browser package.

All web pages have a remarkable similarity with human beings in a sense that both have a HEAD and a BODY. Head is where the key information regarding a webpage is stored- such as the TITLE of the page, a DESCRIPTION of what it contains, and the commonly appearing KEYWORDS in that page. The Body contains the actual information that is to be displayed on the webpage.

We will learn more about them as we go along. Now it is time for some simple rules.

The time has now come to switch on your computers and open up the word editor say Word Pad. From the File Menu, open up a NEW file for designing your very first web page.

Type in < HTML> in the file to mark the beginning of the HTML codes. Using Rule 2 we know that this code will now have an end - < /HTML>. The end code will be written towards the end of the file marking the end of all HTML codes. Now all other codes that need to be written would be between these two codes everything needs to be written in between these two codes. i.e. < HTML> and < /HTML>.
 

Your file will now read like:
 
 

< HTML> ------------ marking the beginning of HTML codes < /HTML> ----------- marking the end of the HTML codes


 
 

We will now develop the HEAD of the web page.

Type < HEAD> to mark the beginning of the HEAD of the web page. Again using Rule 2, we write < /HEAD> to display the end of the HEAD.
 

Your file will now read like:
 
 

< HTML>  < HEAD> ------------ marking the beginning of the HEAD < /HEAD> ------------ marking the end of HEAD < /HTML>


 
 

There are three main components of the HEAD of a webpage. These are :

TITLE of the web page.

DESCRIPTION of the web page.

KEYWORDS used in the web page.







We use the HTML codes < TITLE> and < /TITLE> to write the title of the webpage. Since TITLE is a component of the HEAD, we will have to write the TITLE codes in between the codes of the HEAD. Let us give the title of the homepage as "My First Web Page".
 

Your file will now read like:
 
 

< HTML>  < HEAD> < TITLE>My First Web Page < /TITLE> ------------ marking the TITLE of the webpage  < /HEAD>  < /HTML>


 
 

For writing the description and keywords of the web page we use the following HTML codes:

< META name="description" content="...........">

< META NAME="keywords" content="............" >

As an exception to Rule 2, there are no end codes for these two HTML codes. These two codes along with the Title code play an important role in appropriately classifying and retrieving your web pages on the internet.

Now try to think of some appropriate description and keywords for your webpage and fill in them in spaces denoted by "..........."
 

Your file will now read like:
 
 

< HTML> < HEAD> < TITLE>My First Web Page < /TITLE>  < META name="description" content ="Designing of webpage"> < META name="keywords" content ="first, web page, TechKnow, Training, Manual">  < /HEAD>  < /HTML>

Stand back, the designing of HEAD of the webpage stands completed! It will be a good idea to save the new file you have created. Go to the File Menu and select "Save the File as" option. Then save the file, then save the file with a name of your choice but with the extension name as htm or html. Let us say we save it as test.html.

Alternatively, you may also save it as test.txt and later rename it to test.html

We will now proceed to develop the BODY of the webpage.
 

The Body portion of the webpage comes below the head. Type in < BODY> after the end of the HEAD portion. Using Rule 2, we may write < /BODY> to mark the end of the BODY
 

Your file test.html will now read like:
 
 

< HTML> < HEAD> < TITLE>My First Web Page < /TITLE>  < META name="description" content ="Designing of webpage"> < META name="keywords" content ="first, web page, TechKnow, Training, Course">  < /HEAD>  < BODY> ------------- marking the beginning of the BODY < /BODY> ------------- marking the end the BODY < /HTML>


 
 

The body contains the actual information we want to be displayed which in our case is the text- "This is the first web page I have designed using TechKnow"

So type in this text between < BODY> and < /BODY>
 

Your file test.html will now read like:
 
 

< HTML> < HEAD> < TITLE>My First Web Page < /TITLE>  < META name="description" content ="Designing of webpage"> < META name="keywords" content ="first, web page, TechKnow, Training, Course">  < /HEAD>  < BODY> This is the first web page I have designed using TechKnow < /BODY> < /HTML>

Now save the file test.html once again and guess what ???
 
 

ANY PROBLEMS, MAIL US knownet@knownetweaver.org

The time has now come to view the webpage what you have designed using HTML codes. To do this open up any website viewer package, let us say- Netscape Navigator. Go to File menu of the package and open the file test.html which you have saved on your computer.

On opening the file, this is what that should be displayed on your screen.

---

End of Module 1

Go to Module 2
Go to Module 3
Go to Module 4

Do let us know of your feedback at knownet@knownetweaver.org

TechKnow is designed by Vikas Nath with grateful inputs provided by Pankaj Acharya. TechKnow is a part of the series of resources being developed under the KnowNet Initiative.