HTML is a markup language with the help of which we can create well-structured web pages. Web pages may contain plain text, images, hyper links and multimedia components like audio and video in them. The content of the web page is formatted using the tags (called HTML tags) that surrounds them in the html document at the time of display on the web browser.
Structure of an HTML Document:
Basically, all HTML documents are formed using two sections: head and body. The head section consists of control information used by the browser and server, where as the body contains the actual content of the web page that will be displayed on the client area of the browser.
Here is an example of a sample html document:
<html>
<head>
<title>A Minimal HTML Document</title>
</head>
<body>
<h1>The Largest Heading</h1>
<p>A sample paragraph showing formatting and followed by a line across the screen.</p>
<hr>
</body>
</html>
The entire html document is surrounded by <html> ... </html> tags, which tell the browser that the content of the file enclosed with in these two tags are html content that must be parsed by the browser to display the content. If the enclosing <html> tag is not used in a html document, the content of the web page might be displayed as plain text with both content and formatting information on display.
HTML TAGS
In HTML, formatting is specified by using tags. A tag is a format name surrounded by angle brackets. Each formatting is specified using a set of tags - a beginning tag and an ending tag. Beginning tag starts applying the format to the content of the web page included after it. End tag, which is marked using / as part of the tag name switch the formatting off from applying to the remaining part of the web page.
For instance, the following example sets the text to the style H1 and switches that style off before processing any more of the document:
<h1>Text in an H1 style</h1>
HTML tags has the following characteristics:
- HTML tags are delimited by angled brackets: <h1>
- HTML tags are not case sensitive: <HEAD>, <head>, and <Head> are equivalents
- HTML tags apply the style specified by the tag to the content of the web page which are provided after the beginning tag and switches off the style to the content provided after the ending tag.
- HTML tags that are not used properly will be ignored by the browser for formatting
White spaces, tabs and newlines are ignored by the browser; they can be used to make the HTML source more readable without affecting the way that the page is displayed. While parsing, multiple white spaces are replaced by a single space, where as newlines and tabs area treated as spaces.
HTML Comments:
Comments are used to document the script written for creating a web page. Comment tags start with <! and end with >. Each comment can contain as many lines of text as you like. If the comment runs over a number of lines, each must start and end with -- and must not contain -- within its body. Here is an example:
<! this is a comment --
-- which is continued --
-- here -->
Comments can be placed in either the head of body of the html document, although it seems sensible to use them as near to the feature we are describing as possible. Comments are generally used to document any one of the following information as a part of the script:
- the name of the application
- purpose of the code that describes what the code does
- the name of the author
- the original creation date
- a version number
- copyright information
Head and Body of a Web Page:
The head section normally contains the control information to be used by browsers and servers. One of the tags that can be used in head section is <title> using which the title of the web page can be displayed on the title bar of the web page.
All HTML documents have just one title which is displayed at the top of the browser window. The title is also used as the name in the bookmark files and on search engines.
The body of the web page is structured as blocks of text, each of which can be formatted independently. The two major blocks of text in HTML documents are the paragraph and the heading. Almost all text and images in a web page will be part of either a heading or a paragraph.
Most text is part of a paragraph of information. Each paragraph can be aligned on the screen either to the left (the default option which does not need specifying), the right or centered. Here is the format for aligning the text of a paragraph:
<p [align="left" | "center" | [right]> ... </p>
HTML elements often have attributes. These are items which affect the way that the element operates. In the para tag given above, align is an attribute that determines how the content of the paragraph has to be aligned on the screen - to the left, to the right or in the center.
<hr> tag is a tag which is used to draw a horizontal line across the screen. These lines are used to break up the page and give it a little structure. Here is the syntax of the <hr> tag along with its parameters:
<hr [align="left" | "center" | "right"] [size="n"] [noshade] [width="nn%"]>
Headings in a Web Page:
There are three different levels of heading that are commonly used in a web page. In fact HTML has six levels of headings; but these three should be enough for most purposes. As with paragraphs they can, optionally, be moved horizontally across the screen. Here is the syntax of using them in a web page:
<h1 [align="left" | "center" | "right"]> ... </h1>
<h2 [align="left" | "center" | "right"]> ... </h2>
<h3 [align="left" | "center" | "right"]> ... </h3>
The largest heading is <h1> which should be used for main titles. Often these will be the same as the tile of the document as given in the <head> section of the page. Use <h2> and <h3> for sub sections of the document.