To produce or create anything in this world we first need to understand the thing itself and its structure. Understanding the structure of an object we can not only create it but also improve it. A webpage is a hypertext document and like every other thing a webpage also has a structure and consists of different parts such head and body. Each of these parts of the webpage is explained in the following paragraphs:
can be written in any of the available versions of HTML
. That’s why, first of all the type (version) of the webpage
is checked whenever a webpage
is rendered in a web browser.
Then the webpage
is displayed according to the type of the HTML
. To specify the type of the webpage
we use the tag. This is the very first tag in a webpage
. It tells a browser what version of HTML
should be used to
render the webpage.
We can use any version of the HTML
(it depends upon available technology
in a particular region). Different versions and there is given in the following table:
If you wanna write, sketch or draw something you need to have a page whether it would be a hard page (a page having physical existence like a printed page) or soft page (a page white blank working area shown in word processors as a page). Same thing implements here in web development. You need to declare a (logical) page where you’ll display your text and objects on it. To declare a (logical) page we use tags. This is the second starting tag of our webpage and ends in the end. All other tags are put in between tags. This page can further be divided in different sections and blocks i.e. head and body.
Now we have declared a page for displaying our data on a web browser. The next step is to divide this page in different portions to put our data for the user and for the server and Search Engine. All the tags and data (like version of HTML, title of the webpage, language, author etc) in head element is used either by the server, search engine or web browser. Nothing is pur here for user in this element.
When we are developing a website, it is possible that the site may consist of tens, hundreds or even thousands of webpages. It is necessary to entitle each and every webpage with a suitable title to distinguish it from the others (This is helpful for the Search Engines. You’ll learn about it later in this tutorial). That’s why, HTML provides us a tag to entitle a webpage. This title is shown on the title bar (in old web browsers) or on the tab (in advanced web browsers) of the web browser. This tag is put in between the tags.
is the second portion of our webpage.
All the elements mentioned above are very important for the servers, search engines
and web browsers
but are not displayed in a browser window for the users except the title tag. But data in between
tags is the actual data which is displayed in browser window for the users (if not hidden deliberately) i.e headings, text, tables, lists, images, etc.
Example of a Webpage
Follow the following steps to check the example for better understanding.
- Copy the following code.
- Open Notepad.
- Paste the code in Notepad. (Open the Edit menu –> Paste)
- Save the file with .html extension. (Open File menu –> Save As –> Name the file as “Example.html” including double quotes)
- Open the file in any web browser and Match the result in the given picture.
This is the body of the webpage!
Every thing, in this portion of the webpage, will be displayed in the browsers window