Using Backgrounds to Enhance Your Website
What is a Background?
A background is an image that is placed on
a web page to add color or design to the page.
The image is normally a .gif image and takes
up the entire page. Then tables, graphics
and text are placed on top of the background
image to complete the web page.
The background can have several purposes:
1. Create areas of navigation for the website
Some websites use a background to create a
distinction between the sales text area and the
navigational menus. The menu may be located in
a right or left hand colored "bar" which is
actually just a portion of a background. What
I mean by a portion is that the background is
an image that covers the entire screen. So
the "white" areas are also part of the
background. You can view the example at the
link below to see how this works....
http://www.webmastercourse.com/creating-backgrounds/sample1.htm
2. Form patterns in the site background
Patterns can be attractive for certain types of
sites. However, I do not recommend placing any
text directly over a pattern because it would be
very difficult to read. Patterns can be used
with "tables" layered over them which contain
your text, and this can be effective in creating
a certain theme of a website. Go to the links
below to see examples of pattern backgrounds......
http://www.webmastercourse.com/creating-backgrounds/sample2.htm
http://www.webmastercourse.com/creating-backgrounds/sample3.htm
3. Create an artistic design that compliments
your theme
There are no limits to how a background can
be used on a site. To show the theme of a
site drawings, graphics, photos, etc. can be
turned into a background to accomplish this
purpose. For example, a photographer may use
some of his photos to create a "collage" type
background showing his work. A web designer
may include a few "site" examples in a background.
A flower shop may include photos of their
flower arrangements - or clip art of flowers
to enhance the site. The possibilities are
endless.
Important things to Remember about Backgrounds:
* It is an image, so it may take longer to load
than your text. It's good to have your text
separate from your background (or layered over
inside a table) so the text will load first.
The visitor can then begin reading something
while waiting for your page to load. Otherwise,
they may click out if it takes too long.
* The background is only a foundation for a
website - it cannot be your entire page because
you cannot create links "within" a background.
Links, other graphics, and text for your page
will be layered over the background image.
* If you want a solid color for your web page
background, don't use an image unless absolutely
necessary. You can check your design program
or locate a web page color background in HTML
that will work normally. In other words, you
can make your entire page "pink" without using
an image. This will cause your page to load
faster than selecting an image as the background.
** In Netscape Composer, you can do this by
selecting, "Format" and then "Page Colors and
Backgrounds" in the design program. Then, you
can choose which color to make the entire page.
This section in Composer is also where you
would insert your background image if using
one.
Inserting a Background into your Web Page
There are two ways to insert a background:
1. Use your design program to insert it for
you. Instead of inserting it as a regular
image, your design program should have a
section for "Page Colors" and/or "Backgrounds"
(or a similar section).
** If you're familiar with Netscape Composer,
you can use the method mentioned above.
2. You can insert your image using the HTML
code below. Insert it right after the
</HEAD> tag in the beginning of your page
where the <body> tag would normally go:
<body background="heart-bgd.gif">
Of course, you would change the image name
from heart-bgd.gif to whatever your
background image is named.
I hope you'll now have a better understanding
of how backgrounds work and how to use them
to enhance your website.