 | Plan it!
|
| Tag it! |
| Test it!
|
Consider
how you want to present your information and say it clearly. As you plan
your page designs, it's always a good idea to keep your documents clean
and simple. HTML documents have two basic parts: the heading and the
body.
The heading should always include the title of the document. The body contains
everything you want to display in the document. Both the heading and body
sections of a Web document have special tags so your Web browser knows
where each section begins and ends. Once you draft your outline, you'll
want to create the heading and body of the document.
A
document's hypertext tags instruct your client's Web browser to format
and display text in a series of styles. Hypertext tags begin with the less-than
sign (<) followed by a directive, a style instruction, or some element
of information. Tags end with a greater-than sign (>). A Web browser
will interpret these tags and format the document it displays accordingly.
To
better explain the ways you can use tags, let's use the title and heading
"tags" as examples. The title at the top of the document reads
"Basic Web Page" To create a title for a Web page, you use the
<TITLE> and </TITLE> tags. In this instance, the actual markup
reads
<TITLE>Basic Web Page</TITLE>
You
can use the <TITLE> tag only once per document. However, you can
and should use a different title for each of your Web pages. To create
the first heading in the document, you use a similar set of tags. Although
the line we see reads
My first web page
The markup instruction your Web
browser uses looks like this:
<H1>My first web page</Hl>
The
tag <H1> tells a Web browser to turn on the Heading 1 style. Notice
the </Hl> tag at the end of the line. This denotes the end of the
Heading I style. There are six heading styles of decreasing size that HTML
supports.
Tags
can also change the style of characters and paragraphs. The <I> tag
initiates italic formatting, and the </I> tag ends the italics. You
can also format text to appear bold, underlined, or in typewriter-style
characters. Once you are familiar with the basics you might progress to
sub- and superscripts, small
and big tags, as well as colors
for specific characters.
In
addition to the paragraph formats, certain tags control where paragraphs
should end <P>, where lines should break <BR>, and even where
to add horizontal rules <HR> to your document. All these basic hypertext
tags add to the layout of your documents.
It's
easy to create HTML documents. In fact, you can use practically any word
processor to add the hypertext tags to your text and save the document
as a plain text file. HTML editors are software programs that automate
much of the "tagging" and design process. These can save considerable
time and speed you on your way to more sophisticated web pages.
HTML
also allows you to create point-and-click hotlinks to other places within
your document, to other documents on your server, or to other documents
or servers on the Internet. This is without question the real power of
the web. You can do all this through hypertext links, specifically the
HTML anchor links.
The
basic hypertext tag is the beginning anchor tag <A> and ending tag
</A>. Basic attributes added to this tag include HREF= for linking
to an external url and NAME= or # for linking to a "named" anchor
point within your document. Let's say you wanted a visitor to be able to
link to Bruce's Web Page Help! Home Page from within your document. First
you would have to know the correct url for the Home Page and then write
the proper HTML tags around it, using the HREF= attribute. The correct
code would look like this:
Let's go to <A HREF="..">Rick's
Web Page Help</A>!
Your visitor would see this: Let's
go to Rick's Web Page Help!
And by clicking on the link would
begin the journey to that location on the Internet.
To
see how the local anchor attribute is used you have an assignment. Use
the view source code part of your browser and study the code used to link
Plan it, Tag it, and Test it which appeared at the beginning of this section
to each of the appropriate sections within the document. To go back to
that point in the document, click here.
You'll
want to test your file to make sure that your hypertext tags and links
work. You can develop your files on your local hard drive if you wish.
After you create your documents in a word processor or text editor, you
can save them to your local hard drive. Then open your Web pages with your
Web browser.
For
example if you use Netscape Navigator, you'd simply select File/Open File and
select the document from the File Open dialog box. Since most browsers
will cache your home page in memory, any changes you make to a Web page
after you load it the first time won't appear until you reload your document.
Knowing this will save you untold hours of grief rewriting your page, viewing
it for changes, and never seeing them. Use the Reload or Clear Cache option
to view those changes.
