The Hypertext Markup Language Structure
HTML is a very powerful scripting language which is simple to learn
but powerful enough to tackle complex tasks. The following topics
should be enough to start you on the webmastering path:
Building blocks: the Tags
HTML is like any other text file, except for one thing, you can
use HTML tags to modify the contents of the text file. How do you
recognize HTML tags? They are enclosed within less-than and greater-than
signs, and are usually found in pairs.
For example: <TAG>This is some sample text.</TAG>
Notice that similar tags are at either end of the sample text?
They are similar but not identical. The first tag in the pair, turns
on that particular html tag. The end-tag, containing a slash "/"
character, marks the end of the tags' area of effect, turning it
effectively off.
This basic syntax covers all HTML code, as illustrated by the following
example:
<HTML>
<HEAD>
<TITLE>My Webpage</TITLE>
</HEAD>
<BODY>Welcome to my webpage</BODY>
</HTML>
Font tags
One of the most common things that you will do when you are creating
webpages will most likely be altering text in some way. The FONT
tag lets you do just that. The tag is applied in the following fashion:
<FONT attributes>Text to be affected</FONT>
The attributes that are the most common are the following:
- color = value : You can either specify a color using
plain words (like "red") or using an RGB(Red Green Blue)
hexadecimal value (like "#CC0000").
- size = value : You can specify relative size(like "+2"
or "-1") or absolute size (like "1" or "5").
- face = value : You can also change the font that is displayed
using this attribute (Like "Arial, Helvetica"). Stringing
more than one font between quotation mark give alternate typefaces
if the previous ones in the list are unavailable.
As an example the following code:
<FONT color="magenta" size=5 face="Times New
Roman, Times, serif">
This text is affected by the font tag
</FONT>
would create: This
text is affected by the font tag
Image Tags
Another very common tag, one that you will use constantly when
creating websites, is the IMG tag. This tag is what makes websites
pretty, and not just page after page of plain text. Unlike other
HTML tags, this one doesn't appear in pairs. It is instead used
as a place-holder for the images it represents. This is how you
would call up your images:
<IMG src=imagename.jpg attributes>
The most common attributes for images are:
- height = value : You can specify the height of an image
in pixels. (Like height = 54) This is usually used to reserve
space on your webpage for your image, preventing the text from
shifting with each image loaded.
- width = value : The width attribute functions the same
way as the height attribute. It is used for the same reasons.
- Alt = value : With this attribute you can make a text
label that will be used on your webpage before an image loads.
(Like alt = "Main Menu Button"). It is usually used
to explain what kind of image it is, or its function.
- Border = value : Sometimes you want to have a border
around your image, with this attribute you can specify the width,
in pixels, of the border. (Like border = 2)
Linking to other pages
This is the true power of the World Wide Web. Any documents can
be linked to any other, wherever they may be. This is done through
the A HREF tag. It's usage is with a standard tag pair like so:
<A HREF=yourpage.html>Text that will appear as a link</A>
As you can see, the link tag is very simple, not requiring attributes
to function. You can also use this tag on images. This is how people
create buttons on their webpages.
<A HREF=yourpage.html>
<IMG src=menubutton.jpg height=10 width=10 border=0 alt="Menu
Button 1">
</A>
'Net Resources
With the above tags, you should be well on your way to creating
webpages with amazing visuals and exciting content. But if you wish
to learn more about HTML and webdesign, you may wish to visit the
following sites:
|