|
HTML or Hyper Text Markup Language, is used to format text for presentation on a
web page. This process of formatting, or marking up, is achieved by means of html
tags. Html tags are placed around the text to be formatted in order to display
that text according to the rules expressed in the tag. |
|
Html is written in a text editor such as Notepad. The file is saved with the
.html extension rather than the .txt extension and the file then becomes an html
file rather than the text file normally produced by a text editor. |
I recommend CoffeeCup html editor which is available free.
[ Get CoffeeCup - HTML Editor & FTP Software ]
This editor
is more powerful than
Notepad and provides color coding to your html
source as
well as many other features not provided
with Notepad. | | |
|
To begin the tutorial, open your text editor. Don't type anything yet, just save
the file as "tutorial.html" and close the file. Having saved the file with
the .html extension, the file on your computer should now have the icon of your
web browser. This shows that it is a html file and not a text file. Html files
are intended to be viewed in a web browser. |
To open a new browser window, type
Ctrl + N on your keyboard or choose
File | New | Window from the menu. |
|
Now open a new browser window, find the html file that you just created on your
computer and open it. The file should now open in one or other of the two browser
windows that you have open. Of course, since it is a blank html file, the web page
is blank. | |
|
HTML tags consist of a tag name enclosed in angular brackets. Text to be formatted
begins with an opening tag and ends with a closing tag. The closing tag is distinguished
from the opening tag by a forward slash after the first angular bracket. |
To open your html file for editing,
right-click on the web page and
choose View Source. If you are
using Textpad, right-click on the
file's
icon and choose Textpad. |
| |
|
The first tag that we will use is the HTML tag. The entire contents of an html file
begin with the opening HTML tag and end with the closing HTML tag. Although we do not yet have any content in our html file, type the opening and
closing tags in your html file as shown. |
| |
<HTML>
<HEAD>
</HEAD>
<BODY>
</BODY>
</HTML>
|
|
Within the HTML tags, an html file consists of a head section and a body section.
These sections are also surrounded by tags, namely the HEAD tag and the BODY tag
shown on the left. Add these to your html file between the HTML tags.
The head section contains any stylesheet or javascript data and also the title of
the web page. The title of a web page is displayed on the title bar of the
browser window. To include a title on our web page, we enclose the title in the
TITLE tag placed in the head section. Add a title to your html file as shown
below. | |
<HTML>
<HEAD>
<TITLE>Through the looking glass</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML> |
|
Now save your html file changes and go to the browser window containing your web
page. Press F5 on your keyboard to refresh the web page. You should now see the
web page title on the title bar of your browser.
The actual content of the web page is defined within the body section. |
|
