Format Menu then select
Page Colors and Properties. The Title entry is located under
the General tag. Make your page title as brief and descriptive
as possible. This is the formal title of the individual web page.
Hyperlinks have two parts:
the URL of the page to open, and the link text, which is the
text people will click on to open the page. You want to link text to
accurately describe the page you are linking. Avoid link text that is
meaningless such as "click here".
In this example the link text will be "Fulton County web site" and the
Visit the Fulton County web site
to learn more about the school system.
Decide on the wording of the link text.
Write a sentence that will gracefully incorporate the link text. You
to massage the text a bit to make this happen.
Use your mouse to highlight the link text
Click on the Link button on the toolbar.
When you click on the Link button a Character Properties
will pop up. There are three tabs in this window: "Character", "link" and
The Link (for setting your hyperlink) command is under the Link
Don't see the Link
button on the toolbar? You can also open the Format Menu and choose
Character Properties option.
Figure 1: Entering a hyperlink
In the Link tab of the window, (see above image) enter the URL
page you want to link (item 2). Notice item 1 in the above figure, it
reminder of the text you've highlighted to be the link text.
B. Email Links
It's always a good idea to
make the link text for an email link the actual email address. Not
people care to use a browser's built-in email program for their email, and
all browsers support email. In these cases, by supplying the address
the link text, the reader can copy the address and paste it into her email
Type the email address and
use your mouse to highlight the text, and enter the copy command (Edit
the copy option).
Click on the Link button
on the Composer Toolbar. This opens the Character properties
In the field labeled Link
to a page location or local file, type in the command mailto:
forget the colon at the end).
Immediately following that
colon (no blank space) paste in the copied email address, or just type it
You want to see the entry look like this:
You will, of course, enter the relevant email address in place of mine!
Close the window.
In the Composer window you will
see the email address as a hyperlink!
III. About Images and Color
A. The Page Properties
Check out the
Graphics Toolkit for more
discussions of images and color issues,
and for links to archives of images, backgrounds and color pickers.
Figure 2. The Page Properties
From the Composer Format
menu select Page Colors and Properties , then click on the
and background tab (1.). Some of the information in this window is
Please make careful note of the following properties options.
B. Setting a Background Image
Click on the Format Menu
then select Page Colors and Properties. This opens the Page Properties window. Click on the tab labeled Colors and
You can use the Choose button to browse your hard drive to find the
You might find these sites useful for finding a background for your page.
It's always important to enter a setting for the background color. If you are
using a background image, be sure to choose a color that is similar in darkness to
the background image. Consider, for example, a case in which one might use a very
dark background, starry night is an example. This is a black color with tiny
twinkling dots of white. People generally use white text against this dark
background image. I visited a site like that once. The author of the site did not
set a background color for the page at all. This means the browser defaults to my
own personal color setting. Since I was working with images turned off in my
browser, when I viewed the page it was with my own individual browser setting of a
white background! So I was receiving white text against a white background. Not very
D. Link and Text Colors
The settings to consider for
these colors are
The color of the regular text onscreen.
The color of UNvisited links.Most browsers default to blue.
The color of visited links. Most browsers default to magenta.
The fast flash of color that appears when the link is selected. Most browsers default to red.
You might consider keeping your color choices similar in tone to the
default colors. When people become accustomed to seeing one color used in
certain concept, it can be confusing to see it used in a different way. An
exception I've noticed is the use of a dark color for unvisited links and
paler hue of that color for visited links. This can create a striking and
Read more about choosing colors and how to work with them in Netscape
Composer on the Color Picker
page. This page also links a terrific resouce that displays hundreds
of colors for your picking pleasure!
IV. Adding Images to a Page
Composer isn't very helpful
when it comes to placing an image on the web page! Recall in the last
created a subdirectory under your fulton directory to contain
the directory named images you'll also place the pictures for the
you create in Composer. Once you've downloaded the image you want to use,
saved it in the directory with your web page file(s) you're ready to place
the image on the page in
In Composer click the cursor
in the page where you want to place the image. Click on the Insert
and select Image. The Image Properties window will appear.
Considering the Alt Attribute in the
What if a person is not able to view images or chooses not to (to
the session)? The image tag contains (among others) an attribute, or sub
to allow you to enter text that people will see displayed if they are not
images: the alt (for "alternative") attribute. Be careful how you handle
setting. Try to think about form vs function. Leave the alt empty if the
doesn't add anything of substance to the page. In today's tutorial it
appropriate to make the alt setting empty. But on the
other hand, if an image is particularly significant, such as a photograph
workplace, you might include the alt statement that describes the image:
of our workplace"
Please read more about the use of the alt
as you have time.
Figure 3. The Image Properties window
Selected Items on the Image Properties Window
1. Image Location
Enter the directory and file
2. Leave image at the original
Be sure this is checked.
This makes sure Composer knows to look in the directory with your web
page for the image.
3. and 4. Alt Text/Low Res
The alt text statement is what appears to
people who can't see the image, because they have image display turned
off in their graphical browser or because they have a disability that
prevents them from seeing the page (they may be using a screen reader).
alt text statement also provides you with an opportunity to enter extra
information about the image for everyone!
Only enter an alt text statement if the image is significant to the
discussion on the page. If the image is simply "eye candy" and has no
significant purpose then enter null alternative text.
Entering Descriptive Alternative Text
Click on the button labeled Alt. Text/LowRes
(Item 3, Figure 3). This will open the Alternate Image Properties
window (Item 4, Figure 3). Enter a brief description of the image.
Entering Null Alternative Text
It's fine to display images on a webpage that have no direct bearing on
content but it's generally better to "hide" these images from text only
To enter a null statement for an image, click on the
Extra HTML button (Item 3a, Figure 3) and enter the following
Notice that this statement contains two double quote marks in a row, with
not even a blank space, between them. The double quote key is usually
located just left of
the Enter key, above the single quote mark so you'll have to hold down the
key to type it.
B. Image Width and Height
It's important to include
the width and height of an image in the image tag code. By including these
you make it possible for the browser to "book that space" while it's
page. This means the text before and after the image can be displayed
image is loading. When people can read before the page has completed the
they have the illusion of receiving the page faster! ;-)
How to include these numbers?
Open the image, just the image, in the browser.
You can open the image
right off your hard drive OR on a web page.
From your hard drive
In Netscape, click on the
Select Open Page
Click on the button
Choose file (in MSIE, Browse)
Use the Open window
that appears to locate the image on your hard drive.
On a web page
Place the mouse arrow
anywhere on the image.
Click the right,
OR opposite mouse button. A menu will pop up.
From that menu select
View Image. This will open the image in the window. The size of the
image will appear in the title bar of the window.
Click the right, OR opposite mouse button. A menu will pop up.
From that menu select Properties. This will display
the Properties Window. The size of the image is listed
as the Dimensions.
This is telling you the
image is 196 pixels wide and 230 pixels tall. The width is always given
first. If you forget which is listed first, just look at the image and see
if it appears taller than it is wide, or vice versa and go with
corresponding larger and smaller numbers. In the case of this image of
you can see the image is taller than it is wide, so the small number, 196,
to the width, and the larger number, 230, refers to the height. Both
Netscape and MSIE present the width before the height.
The alt text statement is of special importance in building websites that
compliant (Americans with Disabilities Act). You can read more about ADA
at the W3 organization's
Web Accessibility Initiative project.
V. Selected Composer Tutorials
These are some of the better Composer
tutorials I've found. If you find a tutorial you feel is useful please let
me know. I'd be delighted to include it here!