|
Hypertext Links
Hypertext links are what bind web pages to one another. They allow for navigation
from web page to web page and are a key component to web design. The tag for
a link
is <A> (Anchor), but to get it to link anything, you always
need the HREF (Hypertext REFerence) argument
automatically. The tag should always be closed with a </A> tag
as well. What's put inside of the HREF attribute is the most important
part of the tag. You can put in full web addresses or you can have it send
e-mails. To make a link to Eastview's web page (www.district196.org/evhs/),
the href attribute should be "http://public.district196.org/evhs/".
If you wanted to e-mail someone, with the e-mail address Tyler.Krebs@district196.org,
the
href attribute should be "mailto:Tyler.Krebs@district196.org". Notice
the "mailto:"
added on to the beginning. It should also be noted that anything put between
the <a> and </a> tags will be what is linked (text or images).
Here are some examples of hypertext links with text:
Code Example: |
<p><a href="http://public.district196.org/evhs/">Eastview's Web Page</a></p>
<p><a href="mailto:Tyler.Krebs@district196.org">E-Mail Mr. Krebs</a></p> |
Placing Images
The image placement tag in HTML is <img>. The image placement tag is
one one of the rare instances that does not require a closing tag. The
<img> tag has a required attribute of src (source).
The source tells where to find the image on the internet. If the image is in
the same directory as the web page is, you only need to enter the filename.
Common attributes to define are the image's width and height. Say you take
an image
that is regularly 400x100 pixels. If you set the width tag to be 200, and you
didn't set a height tag, the image would be scaled to 200x50 pixels automatically.
If you specify both width and height tags, it's important to make sure they
are scaled properly, otherwise your image will distort. Also note, it's not
a good idea to always scale down big images in the HTML code. This will still
load the original full-size image. It's a good idea to thumbnail (make smaller
versions) of the images ahead of time in Photoshop. The align attribute
can also be used in placing images the same way it was used with paragraphs,
but issues with spacing may result. I suggest using tags like <center> and
</center> to align them instead. On the next page are some examples of
the image placement tag and some of it's attributes:
Back to Page 1 | On to Page 3
|
|