HTML
Links
The
World Wide Web offers immediate access to information anywhere on the Internet.
In order to find this information, files
and documents must have their own unique address known as URLs (Uniform
Resource Locator). Once you know an URL, you can link to that location.
*
Note: An URL is composed of the following parts:
Internet Service Provider://Host Name/path/filename
Using
Links
By
default, Netscape Gold 3.0 displays links as underlined blue text. When
you click on a link, the browser will take you to that location. An HTML
author can link a number of pages and can link various elements within
a single page together by the use of anchored spots. Likewise, an author
can link to other sites on the WWW. After visiting a site, that link changes
color to remind you where you've been. As an author, include enough links
to make your page interesting but do not get carried away--more is not
always better!
Creating
a Link
Let's
create a link to a Disney site designed by a friend of mine. The URL is
http://www.sover.net/~dizne. Click the Make Link icon on the toolbar. Key
the words Have a Disney Year!
in the Link Source box. Then, key the URL address in the Link To box. Click
Apply and OK. The underlined text appears on your page indicating your
first linked site. To test your link, select Browse Document from the File
menu. Save the file with an html extension. For example, Lesson1.html ;
then click on the link to visit Have a Disney Year!
On
the WWW, there are two popular graphic file formats: GIF (Graphical Image
Format) and JPEG (Joint Photographic Expert Group). Just as you linked
text, you can also link a graphic image. The graphic image below comes
from a very popular web site which offers lots of "cool graphics" for web
page designers. To save an image, just right click with your mouse and
choose Save Image As. Make sure when you save images to be used on your
HTML page(s) that you save the graphic in the same directory as your HTML
page.
Next,
move your cursor to the place on your page where you would like the image
to go; then click on the Insert Image icon on the toolbar. Click the Browse
button to locate the image file you saved; open it, then click Apply and
OK.
Click
on the newly placed image; then click the Make Link icon. Type the URL
in the Link To box. Click Apply and OK. Browse the document as in the previous
exercise to check this link. This is a link you will not want to lose!
Here's
another supurb link for background designs. Apply the steps given above
to insert the graphic and its link into your page.
In
creating web pages, many web designers use bars, lines, animated gifs,
and other icons to enhance the appearance of their page. The following
links contain graphics which should provide you with all you need to create
a series of well-designed, attractive web pages.
Image
Alignment and Borders
Netscape
Gold 3.0 offers unique extensions to HTML that allow text and images to
be placed aesthetically on web pages. The toolbar contains five buttons
on the bottom row that make this possible. They are: Decrease Indent, Increase
Indent, Align Left, Align Center, Align Right. To see how each of these
features works, place the cursor just to the left of the text or image.
Then, click on the various buttons to see the resulting horizontal movement.
Although
the World Wide Web was not originally designed with page layout in mind,
Netscape provides a variety of ways to position images in respect to text
elements and graphics. For example, look at the heading above. You'll notice
that the text is centered vertically in relation to the graphic image.
To
practice this feature, key some sample text and insert a graphic image
on the same line. Click on the image and then on the Insert Image icon
on the toolbar. Then select one of the five alignment buttons on the left
side of the Alignment row. Choose Apply and OK. Experiment with each of
the other four positions.
You
will also notice two buttons on the Alignment row that show text wrapped
around a graphic file. The same process you followed earlier is used to
wrap text either around the left or right side of an image. In addition,
you can determine how much space to leave around the image and whether
or not you want a border to frame your image. As you can see from the image
below, placing a border around an image creates a different effect. While
they enhance certain images such as photographs, they do not particularly
add to the appearance of other images as in the case below.
A
three pixel border
Conclusion
Once
you know an URL, you can easily link to that location on the Internet.
By linking text and graphic images, you add a dynamic element to your Web
presentation. It is important to realize that material you "borrow" from
the Web and publish on your own pages may be protected by copyright restrictions.
You will note that many Web page designers, however, make their materials
available to others as long as the URL is not a commercial site.
In
our next lesson, we will explore other types of HTML links. Until then,
continue to explore the wide range of resources available to you as an
HTML designer.
View my previous guestbook, 1 2


 |