|
HTML Basics - HTML Intro
<INTRO>
In this section you will learn how to begin writing
the HTML. You will see how to begin the document, how to create headers, title,
body and paragraphs.
Before You Start |
Starting Your Webpage | Creating a title |
Creating a Header
I. Before you start
To start off, you can write HTML code in Notepad
or Wordpad. Both of these programs are included with your windows operating
system. If you are using a non-windows system then any text editor will work.
After youre done writing the html code in your text editor all you have to do
to make it an *.html file is go to Save As and
in the File Name field type 'yourfilename.html'
You can substitute whatever you want for 'yourfilename'
but make sure you add the .html To
open up an existing html file you should use the procedure you use for opening
a regular text file but in the Open... window make sure that the drop down box
named File Of Type
is set to All Files (*.*)
Note: In most cases you should name your
primary page [front page] as index.html , index.htm , default.html , or default.htm
Place the index / default page in your main directory so that when people type out your URL that particular page will appear instead of a 404 Not Found or just a directory listing
II. Starting
your webpage.
Now you are ready to start writing your HTML code.
An important thing you should know is your html file starts with <HTML>
and ends with </HTML>.
Begin the top of your file by typing <HTML> then
skip a few lines to leave room for the rest of your document and then type</HTML>
After youre done with that, go back to the top and
on the second line after <HTML> type
in <HEAD> then
skip a few lines and type in </HEAD>
The HEAD section
is where you define the title of your page, include information for the search
engines, set location of your page, add formatting information and write scripts.
After the </HEAD> you
should place the following codes <BODY>
then skip some space and insert </BODY>.
The BODY tag encloses
the content of your webpage, the part your visitors will see, including text
and graphics. Ok, so now by this time your document should look something like
this:
Fig. 1 (Beginning HTML Document)
|
<HTML>
<HEAD>
</HEAD>
<BODY>
</BODY>
</HTML>
|
III. Creating a Title
Each HTML document must have a title.
A title should be short and descriptive. To create a title: In between the
opening and closing HEAD tags type <TITLE>
then go the the next line and type the title of your
webpage, now go to the next line and type </TITLE>
So now your document should look something like this.
Fig. 2 (Creating a Title)
<HTML>
<HEAD>
<TITLE>
Your Title Goes Here
</TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
|
IV. Organizing your page with Headers
and Paragraphs.
HTML provides for up to six levels
of headers in your webpage for dividing your page into managable chunks. To
set up a header: In the body of your document type <Hn>
where n
is a number from 1-6, depending on what type of
header you want to use. 1 creates the larger font and 6 the smallest. If desired
to align the header, type ALIGN=direction
after the n
in <Hn>,
where direction is
left, right or center. Now type your header title and end it by typing
</Hn> where
n is the number you used previously. So
by now your document would look something like this.
Fig. 3 (Creating Headers)
<HTML>
<HEAD>
<TITLE>
Your Title Goes Here
</TITLE>
</HEAD>
<BODY>
<H1>My First Page</H1>
</BODY>
</HTML>
|
Fig. 4 (Illustration of header sizes)
| <H1>My First Page</H1> |
My First Page |
| <H2>My First Page</H2> |
My First Page |
| <H3>My First Page</H3> |
My First Page |
| <H4>My First Page</H4> |
My First Page |
| <H5>My First Page</H5> |
My First Page |
| <H6>My First Page</H6> |
My First Page |
Important thing you should know is
that HTML does not recognize the returns that you enter in your text editor.
To start a new paragraph in you Web page, you use the <P>
tag. To begin a new paragraph: Type <P>
If desired to align the text in the paragraph, after
<P type ALIGN=direction ,
where direction is left, right, or center. So if you deside to use
alignment the finished code would be <P ALIGN=direction>
After you create your <P>
tag, type the contents of the new paragraph and end
it by typing </P> Here
is how your document should look now.
Fig. 5 (Designing Paragraphs)
<HTML>
<HEAD>
<TITLE>
Your Title Goes Here
</TITLE>
</HEAD>
<BODY>
<H1>My First Page</H1>
This is my first paragraph.
I didnt not put a "<P>" in front of it because it is
the first paragraph and therefore it is not necessary. However to create
another paragraph you must include "<P>" before your
text.
<P>Ok, now this
is my second paragraph. Note that this time I put a "<P>"
infront of it. Since this is my second paragraph that tag is necessary.
Now to end this paragraph I will insert a "</P>" at
the end.
</P>
</BODY>
</HTML>
|
My First Page
This is my first paragraph. I didnt not put
a " < p >" in front of it because it is the first paragraph and therefore
it is not necessary. However to create another paragraph you must include
" < p >" before your text.
Ok, now this is my second paragraph. Note
that this time I put a " < p >" infront of it. Since this is my second
paragraph that tag is necessary. Now to end this paragraph I will insert
a "< /p > " at the end.
|
|
» Home
