| Designing
a web site in html
lf you prefer to pen htm language
rather than using editors you have to use note
pad in windows and simple text in Macintosh.Remember
that each tag you type must be enclosed in the
angle brackets and they operate in two parts:
an opening tag and a closing tag.
You would have to start with an HTML command showing
the start of an <HTML> document and </HTML>
to indicate the end.Every components of the page
comes between the two tags.If you decide to use
Capital letters for the first tag, then all your
tags should be in capital letters!Remember to
give your document a name and save it as HTML
or HTM constantly at every stage
To give a web page a title you have got to pin
the following code where as "Learn HTML on
Zimbabweonline" is our title.
<HTML>
<HEAD>
<TITLE>Learn HTML on Zimbabweonline</TITLE>
</HEAD>
</HTML>
Anything else such as body will come under the
</HEAD> tag but within </HTML> tag.For
example:
<HTML>
<HEAD>
<TITLE>Learn HTML on Zimbabweonline</TITLE>
</HEAD>
<BODY>Enjoy this free HTML lecture from
Zimbabweonline! </BODY>
</HTML>
If you are to view the above code in a browser;the
page will only display the text, "Enjoy this
Free HTML lecture From Zimbabweonline!"Right
on the Title bar will be the the title, "Learn
HTML on Zimbabweonline".You can then add
anything between the BODY tags (<BODY> and
</BODY>)For example:
<HTML>
<HEAD>
<TITLE>Learn HTML on Zimbabweonline</TITLE>
</HEAD>
<BODY>Enjoy this free HTML lecture from
Zimbabweonline! Tell Friends About This Site!</BODY>
</HTML>
"Tell Friends About This Site" ,is our
additional body text!Don't bother trying to control
text layout!lt is controlled by tags.
For page breaks you need to use <P> to space
paragraphs.
For line breaks you need to pin <BR>(for
break).The <HR>(horizontal rule)tag adds
a line break by default.
If you need to control font size you need to use
the following heading tags <H1>,<H2>
or <H3>.Remember to close the headings.(i.e
<H1> for </H1>
Using bold or italic; you will need to use <B>
for bold and <I> for italic and <SMALL>
or <BIG> to change the relative size of
the text.
To use justification since it is a paragraph attribute
and therefore a part of the <P> tag.Its
penned as <P ALIGN = "right">
, <P ALIGN = "centre"> or <P
ALIGN = "left">
To control back ground colour you need to place
BGCOLOR = "yellow" in the <BODY >
tag.Use any colour to replace yellow in our example.
Text Colour is controlled by placing an entry
in the <BODY >tag.The tag <BODY BGCOLOR
= "black"TEXT = "White" will
produce white text on a black background.
To use an image as background
you need to place the name of the image in the
<BODY> tag such as,<BODY BACKGROUND =
"ZIMLOGO.GIF">. "ZIMLOGO.GIF",is
our example of a selected image.The only drawback
is that the image will be repeated on the page
several times.
To add an image you would need
to place the image in the same folder as your
page then,insert the following tag : <IMG SRC
= "zimlogo.gif">Our image "zimlogo.gif"
in this case!It would be advisable to add labels
to images,still continuing with our example above:
<IMG SRC = "zimlogo.gif"ALT = "Zimbabweonline .Logo"> The label "Zimbabweonline Logo" loads before the image.
Linking to other pages.Text between
<A> and </A> tags will become links
to other pages.Add the page location to the first
<A> teg:< HREF = "linked file"
which could be even an internet address.lf its
an email address add "mailto:address"
after HREF.
To use Password protection on
a page pin the following code
<HTML>
<HEAD>
<TITLE>Authorised Personal Only</TITLE>
</HEAD>
<BODY ONLOAD = " VAR PASS,PASS = PROMPT
('Enter Password');WINDOW,LOCATION=PASS + '/secret.html';">
<P>You Need To Have Permission to View This
Page!
</BODY>
</HTML>
This code displays a dialogue box in which a visitor
inputs a word.This word is then added to '/secret.html'.lf
a password is entered the browser jumps to 'password/secret.html'.All
you have to do is create a sub folder called 'whatever
the password name is(your choice)and put secret.html
in it.
|
