Links are one of the most powerful
aspects of the Web. If it weren't for the ability to create links, the Web
wouldn't be a "Web" -- it would just be a bunch of disconnected pages.
Links: [ Linking text | Relative
vs. absolute links | Email links
Audio links | Anchors |
Linking images | Image maps
]
Linking text
The text you link should give your
readers a good idea of what they will see when they click the link. Try to
link words that describe the content of the page you are linking to.
-
Highlight the word "PrimeHost" in the paragraph to the right.
-
Choose
ElementLink.
-
In the Link to Page field, type http://www.primehost.com
-
Click OK. The text you selected will be linked to the location you
typed. You can click the link to visit the PrimeHost Web site. Then, use
the toolbar
button to return to this page.
-
If you were linking to one of your own pages, you could use the
"Browse" button in the Link window to find the page you want.
Another way to create links with AOLpress is to cut and paste URLs:
-
Choose FileNew
Page to open another window. In the Location field below the toolbar,
type the address of a site you like to visit and press the Enter key. For
example, you might type http://www.aolpress.com.
-
In the window you opened, choose
EditCopy URL
of Page. This stores the page's location in your "clipboard".
-
Move back to this page. Type the name of the site you visited in the space
to the right.
-
Highlight the text. Choose
EditPaste URL
to link this text to the page you visited.
Try it here:
AOL PrimeHost is a great place to host
your Web site. If you are a PrimeHost customer, you can use AOLpress to publish
your pages directly to your Web site.
If you want to remove a link,
just highlight the linked text and choose
ElementUnlink.
Relative and absolute links
When you create a link, the location
you link to is called a URL. The syntax of
URLs is very powerful. You can link to other pages on your own site or any
other part of the Web.
When you create a link, notice the button that says either Rel or
Abs. This button lets you change the type of link.
A "relative" link skips some information at the beginning of the address
about where the page is located. It lets your browser add this information
based on your current location. For example:
"forms.htm" and
"../refer/link.htm" are relative links.
An "absolute" link contains all the information about where the page is.
For example,
"http://www.aolpress.com/press/documentation.html" is an absolute
link.
Here's some advice about choosing between relative and absolute links.
-
If you're linking two pages in the same directory, it's best to use a relative
link. That way, you can move the pages together without breaking links between
them.
-
If you're linking two pages stored in directories that will always be in
the same relative position to each other, you can use a relative link.
-
If you're linking to a page on another Web site, you have to use an absolute
link.
-
If you think you may need to move the page you are editing to another location
someday, it's best to use an absolute link.
Links to send Email
You can create links to let your
readers send email. Just choose
ElementE-Mail
Link and type the email address to which you want to let people send
email. For example, this link lets you send email to
@spam@info-Remove- at TakeThisOuTprimehost.com.
Links to sound or video files
You can even create links to sound
and video files with AOLpress.
-
First, you'll need sound or video files to link to and software to play the
files.
-
You'll also need to find the MIME type for the file's extension in the
ToolsPreferencesExtensions/MIME
window. (For example, .wav files have a MIME type of "audio/x-wav".)
-
Then, choose an application to play sounds for that MIME type in the and
ToolsPreferencesMIME/Viewer window.
-
Highlight the words you want to link to a sound.
-
Choose
ElementLink.
-
In the Link window, click the Browse button.
-
In the List Files of Type field, choose "Sound" or "Video".
-
Select the file you want to link to and click OK.
-
Finally, click OK in the Link window.
See the HTML tricks page for ways to add "background"
sounds to pages.
Creating anchors for links
Sometimes you'll want to link to
some information that isn't at the beginning of the page. Or, you might want
to create a short Table of Contents that lets people move to the headings
in your page quickly. To do this, you first
create "anchors" at the points
you want to be able to jump to.
-
Highlight the words "Creating links" at the top of this page and choose
ElementAnchor.
You'll see the Anchor window.
-
Type top as the anchor name for jumps to the top of the page.
(It's good to use anchor names you can remember.)
-
Then, click OK. The text will turn magenta.
This is just to help you find anchors in your pages. Other browsers will
show anchors as normal text.
-
Now, highlight the word "top" in the space to the right.
-
Choose
ElementLink
and type top in the Append Anchor Name field.
Then click OK.
-
You can click on the link to move to the top of this page.
Try it here:
Jump to the top.
Linking images
Linking an image is just as easy
as linking text.
-
Highlight the image to the right and choose
ElementLink.
-
In the Link to Page field, type images.htm (the filename
for the previous lesson on creating images).
-
Click OK. You'll see a border around the image that tells you this is a link.
Sometimes you don't want a border to show around a linked image. To hide
the border:
-
Highlight the image again. Hold down the Ctrl key (Command key on a Macintosh)
while you are selecting a link to keep AOLpress from following the link.
-
Choose
ElementImage.
-
Uncheck the Show Link Border field and click OK. The border
around the linked image will disappear.
Try it here:
Creating image maps
Image maps are images that link
to different places depending on where you click. AOLpress lets you create
two kinds of image maps:
-
Server-side image maps rely on the server to decide which link to
use when someone clicks on the map. AOLpress creates a server-side map in
the format that AOLservers use.
-
Client-side image maps let the browser decide which link to use. This
makes them faster. Since client-side image maps are newer, not all browsers
support them. This image at the top of the page uses a client-side image
map. When you move the mouse over the image, you see the outlines of the
linked areas (most browsers don't do this) and the link location is shown
in the lower-left corner of the window.
Usually, it's best to let AOLpress create both types of maps. Newer browser
software will use the client-side map, and older browser software will use
the server-side map.
-
Highlight the drawing of Yosemite Falls to the right and choose
ElementImage
Map to open the image map editor.
-
Select the rectangle tool to the left of the image and draw a rectangle on
the image.
-
In the field at the bottom, type the Location you want this shape
to link to. For example, type glossary.htm#waterfall to link to
the glossary page. (Later, you can add an anchor called "waterfall"
to the glossary for this link.)
-
Try creating circles or other shapes with the drawing tools. For example,
try using http://www.aolpress.com/ as the location for one of your
shapes.
-
Click the arrow tool in the upper-left. This tool allows you to select shapes
and resize them or move them.
-
As you move your cursor over the image, you see labels that tell you what
location each shape is linked to. You can select a shape and change it's
Location.
-
When you've finished playing with the Image Map editor, click Close.
-
You'll see a window that asks how you want to save the map. Accept the default
names and click Save. When you put your cursor over the image, you'll
see the outlines of the shapes you created. If you click on the links they
take you to the location you specified.
Try it here:
The other icons in the Image
Map editor are also useful.
-
The trash can icon removes the currently selected shape.
-
The larger graph zooms in so it is easier to work with small images.
-
The smaller graph zooms out so you can see more of the image. (You can also
resize the window to see more of the image.)
-
The triangle icon lets you control which shape is on top when shapes overlap.
For more information, see the chapter on
links in the AOLpress
User's Guide.
In the next
lesson you'll learn how to create forms so that you can get information
back from your readers. Don't forget to choose
FileSave
to save your changes to this page.
HomeTOCNextGlossaryIndex
[
Home |
Contents |
Previous |
Up a Level |
Next |
Glossary |
Index ]
Copyright © 1997 America Online, Inc.
©2025 These pages are served without commercial sponsorship. (No popup ads, etc...).Bandwidth abuse increases hosting cost forcing sponsorship or shutdown. This server aggressively defends against automated copying for any reason including offline viewing, duplication, etc... Please respect this requirement and DO NOT RIP THIS SITE.
Questions?<A HREF="http://techref.massmind.org/techref/language/html/HELP/tutorial/links.htm"> AOLpress: Creating links</A>
.