HomeFAQSearchMemberlistRegisterLog in

Share | 
 

 HTML TUTORIAL PART 2 : CREATING YOUR FIRST WEBPAGE

View previous topic View next topic Go down 
AuthorMessage
Arvind
Administrator
Administrator
avatar

Posts : 132
Points : 266
Join date : 2009-06-16
Location : Still exploring where i am.....

PostSubject: HTML TUTORIAL PART 2 : CREATING YOUR FIRST WEBPAGE   Tue Jun 23, 2009 12:18 pm

Welcome to iNFiNiTUDE PROGRAMMING SCHOOL!!


HTML TUTORIAL PART 2 : CREATING YOUR FIRST WEBPAGE



In this tutorial we will create your first web page, hope you have gone through the basics in HTML TUTORIAL PART 1

Once your done here with the basics it is time to create your first web page, here is a brief step by step instructions to do that:

First open your Text Editor (it can be a notepad, word pad or text editor etc..)

Then it's time to recollect the Basic Template for HTML code as explained in the HTML TUTORIAL PART 1, it is as shown below for your reference:

Code:

<html>
<head>
</head>
<body>
</body>
</html>


Ok so this is the template we are going to use through out the tutorial(Remember this template will be available in all HTML web pages) its time to edit the template as shown below:

Code:

<html>
<head> Welcome to iNFiNiTUDE PROGRAMMING SCHOOL</head>
<body><br>This is my First web page</body>
</html>

once you have typed the above content in a notepad or text editor, just save the file with an extension of .html for example: first.html

Now just open the first.html (by double clicking the file), you will see the content as shown below in the browser:
Code:

Welcome to iNFiNiTUDE PROGRAMMING SCHOOL
This is my First web page

Congrats!!! Very Happy you have created your first web page....partydance

ok lets explore the above code,

<html> indicates the starting of the html and </html> indicates the ending of html document
<head> indicates the heading of your web page, the text appears on the first line on your web page (it is not necessary to give any content in head tag) and </head> indicates the ending of the head tag
<body> indicates the starting of body tag, this is where the contents of your web page is going to be placed(we will discuss further about the formatting of body tag in detail as we proceed) </body> indicates the ending of body tag
<br> indicates the line break (this tag is used for formatting the output), when you use this tag the output following the tag is going to be printed in the new line or next line

Exclamation Note: Certain tags does not need an ending tag ex: <br>


Exclamation Note: To view or edit the source of a already created web page, just right click on the web page and select "view page source" or just hit "ctrl+u" which is a shortcut key to view the page source or go to view menu in the browser and select "view source" from the drop down menu.


Title Tag:

The title tags encapsulate the title of your page. The title is what shows in the top of your browser window when the page is loaded. Let us now insert the title tag into the above code and lets see what happens, think

Exclamation Note: To view or edit the source of a already created web page, just right click on the web page and select "view page source" or just hit "ctrl+u" which is a shortcut key to view the page source or go to view menu in the browser and select "view source" from the drop down menu.

Code:

<html>
<head> Welcome to iNFiNiTUDE PROGRAMMING SCHOOL</head>
<title>iNFiNiTUDE</title>
<body><br>This is my First web page</body>
</html>

Can you spot the difference between the first page and the new page generated by the above code? confused

yes, in the first page the browser title is as "MOZILLA FIREFOX" (Assuming that your using Mozilla Firefox bowser) and in the new web page generated using the above code has the browser title as "iNFiNiTUDE - MOZILLA FIREFOX"

So the purpose of title tag is to give the browser a user defined text (which gives a short description of the content of web page)

A title tag should have a closing tag like your html, head and body tag's which is indicated by </title>



Hope the tutorial is easy to follow, just play around with the today's learned tags and create new or edit the above code's to make your own web page and stay connected for the next tutorial for HTML as we go through all the tags in HTML.....



-Arvind
Back to top Go down
View user profile http://infinitude.nsguru.com
 
HTML TUTORIAL PART 2 : CREATING YOUR FIRST WEBPAGE
View previous topic View next topic Back to top 
Page 1 of 1
 Similar topics
-
» Creating the account (URL) globally and using that variable where ever it needed
» HTML Alone
» How to create a test suite in Selenium?
» Need a custom html page?
» How to store a HTML comment in selenium

Permissions in this forum:You cannot reply to topics in this forum
 :: ALL ABOUT COMPUTER SCIENCE :: INFINITUDE PROGRAMMING SCHOOL :: HTML COMPLETE TUTORIAL-
Jump to: