In the above webpage example you study the html code in the left part and to test yourself you write the same code in a notepad in your system and save it as myfirstwebpage.html in mydocuments or in some othe folder of your system and go to that folder and you will find the webpage icon with name myfirstwebpage You open it by clicking and your internet explorer or firforx browser will display that webpage which will be same as shown on the rightside of the above chart.
And
now reverse the step for a better understanding of how a web page
works. Open the source of your first web page and see the code which is same
as you have earlier written in a note pad and saved.!
Now you might have understood how the webpages are written and what
is the html code and how it is saved and how it becomes a
webpage. Now you must know how is the html written. Here is the basic
html document structure.
<html>
<head>
<title> title </title>
</head>
<body >
<p> this is paragraph in the body </p>
</body>
</html>
<html> </html>
These are the starting and ending tags of any webpage (html document)
The matter and the content of the webpage is inserted in between these two tags and the document will be saved with a
name (a name of your choice) with the extention of .htm or .html .
<head> </head>
These are the starting and ending tags of the head part of
any webpage (html document) The nature and appearance and the title of the page will be expressed here. The text matter typed in between the head tags will be displayed only when the matter is typed directly inside these two tags and the matter inside other tags which are inside head tags will be or will not be displayed(this depends on the nature of other tags (example the matter typed inside title tags will not be displayed in the webpage content but will be displayed only on the title bar of the
webpage.) and the matter typed inside script tags will not be displayed in the
webpage.
<title></title>
These are used to display the title of the webpage. The title of
the webpage written between these two tags will not be displayed inside the
webpage the title will be displayed only on the title bar.
<body> </body>
These are the starting and ending tags of the main part of
any webpage (html document) The main content of the webpage is displayed here. Inside the body many other tags can be used as per the requirement of content to be displayed in the
webpage. these are <p> tags <table> tags <script> tags and <h1> tags and <li> tags <form> tags and many other tags are used.
<p> </p>
These are the starting and ending tags of a text paragraph.Every paragraph is expressed in two paragraph tags.
<table> </table>
These are the starting and ending tags of a table in a
webpage. Almost all webdeveloppers use tables to display data in webpages. Every table in the webpage is prepared with two main table tags and inside these two tags the rows and cells are expressed with <tr> and <td> tags.
In a conventional language we use various types of instructions to do certain jobs(ex:-prepare a table, paint the wall, go to market, etc...) If we treat html as a language the tags are instructions (just like the examples given above)to the browser. The browser (internet explorer or firefox or opera or something else) grasps only html instructions and gives output as a webpage. So you must first decide what should be the content of the web page and how it is to be displayed. For example You are with a data which is to be shown in tables. Then you must give instructions to the browser to display the data in a table format for this purpose you must use
table tags which are part of html.
The content of the webpage is generally text , pictures and
graphics, hyperlinks(either images or text linking other webpages). These
three types of content is arranged in paragraphs, headings, tables, lists,
forms, frames and for this purpose different html tags are used.
For each type of layouts a seperate type of tags are used. The text matter
is expressed as paragraphs and headings with the tags <p>
</p> tags and <h1></h1> and tables are expressed within
<table></table> tags and Lists are prepared with <li></li>
tags and forms are prepared within <from></form> tags. The
appearance of webcontent changes by inserting various
attributes.(examples for attributes are size, font color, background,
width, etc).
| 
