HTML
HYPERTEXT MARKUP
LANGUAGE
PART I
WHAT IS HTML?
HTML stands for HyperText Markup Language
HTML is not a programming language, but a
markup language
markup language is used to describe the contents
of a page.
A markup language uses a set of markup tags.
WEB BROWSERS
A web browser is a software application used to
read HTML documents and display them as web
pages
The browser does not display the HTML tags, but
uses the tags to interpret the contents of the page.
Browsers automatically add some empty space (a
margin) before and after each heading.
They also add an empty line before and after a
paragraph
Examples:
Internet
Explorer
Google Chrome
Mozilla Firefox
HTML TAGS
HTML markup tags are usually called HTML
tags.
They are keywords (tag names) surrounded by
angled brackets , e.g., <html>
The majority of these tags come in pairs
An
start tag or opening tag, e.g., <html>
An end tag or closing tag, e.g., </html>. The end tag
must have a forward slash before the tag name.
There are some tags that do not have an end tag,
e.g., <br>
The syntax for HTML tags is
<tagname>content</tagname>
HTML tags are not case-sensitive
HTML TAGS (CONTINUED)
The first tag is the <html> and </html> tags
Text
The next tag that is used in the <body> and
</body> tags
Text
between these tags describes the web page.
between these tags is the visible page content
Another tag is the <h> and </h> tags
Text
between these tags displays a heading
There are different headings that denotes different
sizes
h1, h2, h3, h4, h5, h6
Another tag is the <p> and </p> tags
Text
between these tags displays a paragraph
HTML DOCUMENT
An HTML document is also called a web page.
HTML documents contain HTML tags and plain
text
A website is made up of multiple web pages.
HTML text document
HTML DOCUMENT
The image below shows how the HTML text
document is converted into a webpage
HTML ELEMENTS
HTML documents are defined by HTML elements
An HTML element is everything between the start
and end tags, including the tags. The text between
the tags is known as the element content.
Example:
The <p> element
<p>This is my first paragraph.</p>
The element has a start tag <p> and an end tag
</p>
The element content is: This is my first paragraph
HTML ELEMENTS
An HTML element with no content is called an
empty HTML element
One such HTML element is the line break.
This
element has an opening tag but no closing tag,
e.g.,<br>
The HTML document is as follows:
HTML ELEMENTS
The first diagram shows the webpage without the
<br> tag
The second diagram shows the webpage with the
<br> tag
HTML ELEMENTS
Another empty HTML element is the <br/> tag
This is used when you want to have a line break
(new line) without starting a new paragraph.
The diagrams below is used without the <br/> tag
HTML ELEMENTS
The diagrams below is used with the <br/> tag
HTML ELEMENTS
Another empty HTML element is <hr /> tag
This
tag creates a horizontal line in an HTML page
It can be used to separate content
HTML HEADINGS
HTML headings are defined with the <h1> to
<h6> tags
The HTML document and corresponding web page
are as follows:
HTML HEADINGS
You must use the HTML headings tags only for
headings.
DO NOT use the heading tags to make text big or
bold.
H1 headings should be used as the major
headings, followed by h2, then h3, etc
SAVING AN HTML DOCUMENT
USING NOTEPAD
After typing the HTML, you must save your file as
an HTML file.
Go to File, then select Save As
When the window appears, select the folder in
which you want to save your file
In the File Name box, you must type in the name
of the file, followed by .htm or .html
E.g.,
index.htm
In the Save as type box, select the option All
Files from the drop down menu.
Then click on Save
