HTML
formatting, images and links
By
now you should understand how to write any text to a web
page. This lesson will teach you how to format text, add
images, create links between other web pages you create,
and links with other people's web pages. Once you learn
the basics of formatting, image placement, and linking,
it will be up to you to view the souce code (HTML) of
other pages to learn new specific HTML code that you prefer
on your site. Let's take the example from lesson 1:
FORMATTING
<html>
<head>
<title>Your web page title
goes here</title>
</head>
<body
bgcolor="#FFFFFF" text="#000000">
<center>Your web
page content: Hello thank you for visiting my website!</center><p>
I like swimming, running, and
hiking.
</body>
</html>
Notice
the new command HTML code/tag in bold. Again, also notice
the closing command. This tells the web page to center
the stuff between the commands: <center>The
stuff here is centered.</center> so the
page should look something like this:
Your
web page content: Hello thank you for visiting my website!
I
like swimming, running, and hiking.
If
you forgot to close the center command, or if you purposely
place it after the word hiking, then your page would look
something like this. Notice that the web page does not
know when to stop centering without the ending center
command (</center>).
Your
web page content: Hello thank you for visiting my website!
I
like swimming, running, and hiking.
The
<p> command/tag is a hard "carriage" return.
Again, it is good practice to be specific about your HTML
tags even though HTML will assume things for you and will
even create hard/soft returns for you.
IMAGES
Now
lets add an image:
....
<body bgcolor="#FFFFFF" text="#000000">
<center>Your
web page content: Hello thank you for visiting my website!</center><p>
I like swimming, running, and
hiking.<p>
<img src="images/yourpicture.gif"
alt="This is a picture
of me!">
</body>
.....
The
above bold command/tag tells the page to add a picture
after the word hiking. Type in the bold command, and then
in quotes, type in the name of the picture file (GIF or
JPG only, PNG is not supported on all browsers yet.).
You can type "images/yourpicture.gif"(Relative
pathing-you choose files relative to where this htm
file is.) if you made a folder in your web folder
called images. The page looks into the images folder
and then looks for the gif or jpg. If you
just made one web folder and put your htm files and your
picture files in the same web folder, then you would type
<img src="yourpicture.gif">. You do not
need to specify the folder that you are in. The alt command
is a description of the picture. If you rollover an image
and leave it there for a few second, the description of
the picture will appear. This is especially important
in complying with Section
508 (site accessability). Blind people can still understand
the importance of the picture by using a special web reader
that looks for alt tags associated with pictures.
