Using
Backgrounds and Color Codes to Enhance your
Website
How to use HTML
easy Web background design color codes in your
Internet pages
What is a Web
Background?
Ever noticed those cool
backgrounds on websites you've visited and wonder
how they did it? This web design tutorial will
explain how to use color codes to enhance your back
ground designs.
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.
How to Add a Background Image to an HTML 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.
2. Form
patterns in the web site background
Patterns can be attractive
for certain types of web 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 text, and
this can be effective with the theme of a
website.
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 included photos of their flower
arrangements - or clip art of flowers to enhance
the site. The possibilities are endless.
Important things to Remember
about Website Backgrounds:
Truthfully, the only
difference between you and the web background
experts is time. If you'll invest a little more
time in reading, you'll be that much nearer to
expert status when it comes to web backgrounds.
*It
is an image, so it may take longer to load than you
text. It's good to have your text separate from
your background (or layered over) so the text will
load first. The visitor can then begin reading
something while waiting. Otherwise they may click
out if it takes to long.
*
The background is only a foundation for a website -
it cannot be your entire page because you are not
able to 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.
Inserting a Background
into your Web Page
There are
two ways to insert a background:
1. Use your Internet
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).
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
image is named. Those who
only know one or two facts about web backgrounds
can be confused by misleading information. The best
way to help those who are misled is to gently
correct them with the truths you're
learning
about website designing
here.
This concludes the background
and color code section of the web
design tutorial. I
hope you'll now have a better understanding of how
backgrounds work and how to use them to enhance
your web site designs.
Related:
