Saturday, 22 December 2012

2. Creating a Simple Web (HTML) Page

We create web pages using HTML (Hyper Text Markup Language) language. HTML is used to create static part of our web pages. Web sites which are dynamic, use many other languages (such as java, php, javaScript....) to become dynamic.
HTML file consists of some of the contents that display on browser and others are some commands in the form of tags. Through these tags, browser comes to know what are the contents and how to display those contents to the user. 

Though there are lots of tags but any web/HTML page must have these six essential tags: <HTML>, <HEAD>, </HEAD>, <BODY>, </BODY> and </HTML>.
tag with '/', indicates that the particular tag is ending here.

Here, I have shown how to create a very basic HTML page using some tags. This is how the page will appear:


To create this page, simply open a notepad file and save it with extension '.html'. Below is code for the page:

< HTML>
 < HEAD>
  < TITLE>My First Web Page< /TITLE>
 < /HEAD>
 
 < BODY>
  < H1>Sushant Sharma< /H1>
  < P>
   < B>B.TECH (CSE)< /B>< BR>
   < A HREF="http://sushantsharmaa.blogspot.in">My Home Page< /A>< BR>
   This is realted to java realted technologies.< BR>
   < A HREF="mailto:abc@gmail.com">contanct me< /A>< BR>
  < /P>
  < P>This page is about my personal information.< /P>
 < /BODY>
 
< /HTML>


  • Every html page starts with <HTML> tag and ends with </HTML> tag.
  • HTML pages can have two portions; head and body.
  • Head portion starts with <HEAD> tag and ends with </HEAD> tag.
  • Similarly, body portion starts with <BODY> tag and ends with <BODY> tag.
  • Inside head portion, we have used only one tag <TITLE>. Anything between <TITLE> & </TITLE> will appear at upper left corner of web page.
  • In body portion, there is <H1> tag which used for heading. There are some other tags as well like <BR> & <P>. <BR> (line break) tag is different from <P> (paragraph) tag as <BR> tag takes us to next line however <P> tag leaves a empty line and then takes us to further next line.
  • Another tag we used is <B> tag. anything between these tags will appear in bold in browser. We can also use <STRONG></STRONG> to display text in bold.
  • Another important tag is anchor tag (<A>). It has 2 parts, one is label & another is action. Label is what is visible to us and action is what actually happens when we click on that label.
  • If in a anchor tag <A>, HREF starts with http, browser will take us to that web page. However, if it starts with 'mailto' followed by mail address, then browser will search if there is any email client available in the computer and then launch that. So first hyperlink takes us to a new web page but second one takes us to a new application through which we can send an email.
  • We can also use a property called 'target' inside <A> tag. If we set 'taget=_blank', it will open the link in another window.








1 comment: