HTML 5
HTML is a very simple markup Language which you can use to create your own webpage simply and quickly. It has tags, easily understandable & can manage with a simple knowledge of web developing. One thing you have to take concern on it is placing the opening tag & its closing tag appropriately in between the text you are going to display in your webpage.
First, lets go through with the basic tags used for creating a simple webpage.
Basic HTML Tags.
- <HTML> </HTML> : Indicates the start & the end of the HTML Document.
: For giving the title of the webpage. - <HEAD> </HEAD> : Meta information of the document is given.
- <BODY> </BODY> : Content to be displayed in the web page is given.
- <P> </P> : Indicates a paragraph.
- <BR/> : For giving a single line break.
<H1> </H1> : This defines the headers.
<HR/> : For giving a horizontal line.
- <PRE> : This defines the preformatted text.
- <B> </B> : Defines bold text.
- <I> </I> : Defines Italic text.
- <U> </U> : Defines Underlined text.
- <SUB> </SUB> : Defines subscripted text.
- <SUP> </SUP> : Defines superscripted text.
- <OL> </OL> : Defines ordered list.
- <UL> </UL> : Defines unordered list.
- <UL TYPE="SQUARE"> </UL> : To give a different bullet shape.
- <LI> </LI> : When giving the items in the list one by one.
<UL TYPE="square">
<LI> One </LI>
<LI> Two </LI>
<UL TYPE="circle">
<LI> Three </LI>
<LI> Four </LI>
<UL TYPE="square">
<LI> Five </LI>
<LI> Six </LI>
</UL>
</UL>
</UL>
- Giving hyper links :
<a href="/name/"> Home </a>
- Giving an image :
Make sure that the image is kept in the same folder where the document is saved.
If not the path to the image should be given instead of the image name.
- Adding a video :
<source src="videoplayback (27).mp4"> </source>
</video>
Make sure that your video is supported with your browser.
And it is kept in the same folder where the document is saved.
If not the path to the video should be given instead of the video name.
- Inserting a table :
<TR> </TR> : Creating a row.
<TD> </TD> : Creating a column.
</TABLE>
Now you must have a basic idea on how to create a simple webpage. I give you a sample webpage and the tags used in it underneath it. Hope it would be understandable to try out your first webpage following it.
SAMPLE WEBPAGE.
Home Page About Us Our Articles Contact Us Sitemap
Categories
Categories
Fresh News
- Augest 01, 2014
- July 12, 2014
- June 23, 2014
Mid Semester examintion will be commenced from 11th Augest 2014
A project will be assigned as a group work of maximum 6 members for a group
Lectures, tutorial & practical sessions will be starting from the first week itelf
Professional Online Education
Recent Article
About Site
Connecting People
The site will be maintained to convey messages to students regarding Internet Technology & applictions(ITA)which is provided to 1st year 2ndsemester IT/IS/CSN students
This is to connect students with each other as well as lecturers & students. This will allow students to actively communicate with themselves & share knowledge.
Students will be given 2 hours of lectures, 2 hours of practical sessions & 1 hour of tutorial hours per week for the Internet Technology & applications(ITA) courses.
Page source code in HTML :
| <html> | |
| <head><title>Home Page</title></head> | |
| <body> | |
| <nav> | |
| <a href="/Home Page/">Home Page</a> | |
| <a href="/About Us/">About Us</a> | |
| <a href="/Our Articles/">Our Articles</a> | |
| <a href="/Contact us/">Contact Us</a> | |
| <a href="/Siteap/">Sitemap</a> | |
| </nav> | |
| <br> | |
| <B>Categories</B> | |
| <ul > | |
| <nav> | |
| <li><a href="/Programs/">Programs</a></li> | |
| <li><a href="/Student Info/">Student Info</a></li> | |
| <li><a href="/Teachers/">Teachers</a></li> | |
| <li><a href="/Descriptions/">Descriptions</a></li> | |
| <li><a href="/Administrators/">Administrators</a></li> | |
| <li><a href="/Basic Information/">Basic Information</a></li> | |
| <li><a href="/Vacancies/">Vacancies</a></li> | |
| <li><a href="/Calendar/">Calendar</a></li> | |
| </nav> | |
| </ul> | |
| <br> | |
| <h2><B>Fresh News</h2></B> | |
| <ul><B><li>Augest 01, 2014</li></B><br> | |
| <B><nav> | |
| <a/ href="/Mid Semester Exam/">Mid Semester Exam</a> | |
| </nav></B><br> | |
| <p>Mid Semester examintion will be commenced from 11th Augest 2014</p> | |
| <B><li>July 12, 2014</li></B><br> | |
| <B><nav> | |
| <a/ href="/ITA Course Assesments/">ITA Course Assesments</a> | |
| </nav></B><br> | |
| <p>A project will be assigned as a group work of maximum 6 members for a group</p> | |
| <B><li>June 23, 2014</li></B><br> | |
| <B><nav> | |
| <a/ href="/Start of new Semester/">Start of new Semester</a> | |
| </nav></B><br> | |
| <p>Lectures, tutorial & practical sessions will be starting from the first week itelf</p> | |
| </ul> | |
| <B><h2>Professional Online Education</h2><br> | |
| <h3> Recent Articles</h3></B> | |
| <ul> | |
| <li><img src="icon1.png"><width="62" height="62"></li> | |
| <p><B>About Site</p></B> | |
| <p>The site will be maintained to convey messages to students regarding Internet Technology & applictions(ITA)which is provided to 1<sup>st</sup> year 2<sup>nd</sup>semester IT/IS/CSN students</p><br> | |
| <li><img src="icon2.png"><width"62" height="62"></li> | |
| <p><B>Connecting People</B></p> | |
| <p>This is to connect students with each other as well as lecturers & students. This will allow students to actively communicate with themselves & share knowledge.</p><br> | |
| <li><img src="icon3.png"><width="62" height="62"></li> | |
| <p><B>Student's Time</B></p> | |
| <p>Students will be given 2 hours of lectures, 2 hours of practical sessions & 1 hour of tutorial hours per week for the Internet Technology & applications(ITA) courses.</p><br> | |
| </ul> | |
| </body> | |
| </html> | |
Hope It was useful to you.
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)
.jpg)