Most websites feature white backgrounds. Or they sit on a navy
or gray background -- but most of the screen is still white,
like a page of paper set against the darker background.
Occasionally, you might run across more interesting colors -
reds and purples and greens and rust ' often looking more gaudy
than professional.
But every now and then, there is a website with a photo or a
drawing or a pattern background. This tutorial will show you not
just how to place a background on your website, but five clever
ticks to spice up the background without resorting to gaudiness.
The basic html code to place a background on your web page is
very simple:
To place a background in a table, perhaps set against a solid
color page background, here is the basic html code:
The image file called image.jpg now
becomes your background. A typical image would show up "tiled".
In other words, it repeats itself horizontally and vertically to
fill the screen. This usually does not look very professional,
so here are five tricks to clean it up and spice it up.
1. Use "strip" graphics. Strip graphics are simply very long
images that stretch across the screen. When they repeat, they
repeat one below the other. To see this in action, view my page
at http://www.thehappyguy.com/SEO.html . The yellow strip along
the right side looks like it is part of the top banner image.
But it is a 650 by 20 strip image, mostly white, with a touch of
yellow along the left side. This works well with patterns that
vary only from left to right
2. Hold the background in place. When a visitor scrolls down,
the text rolls over the image. I used this trick at my personal
website: http://www.leonhardtonline.com (Please forgive the mess
' I never seem to find the time to clean it up.) The html code
to do this is:
This works for patterns, but it works best for photos or
drawings, such as a faded image of your company logo or a faded
scenery shot or a faded photo of people interacting. (Remember
that the background should not stand out at the expense of the
foreground text and images, which is why you want faded images.)
3. Another great background trick is to place a smaller picture
in the background, such as your company logo or some other image
that you do not want to take up the entire screen. This works
best against a white background. Here is the html code:
If you want the image to show up just in a table:
I used this function in just one cell of a table by inserting it
in my
tag for my navigation menu at
http://www.vitamin-supplements-store.net . Notice how the faded
bottle is in the background behind the navigation links, but it
does not repeat down the page.
4. You can further control the position of the background image.
Consider the following code:
We now have a background that fills the top right corner of the
page. Depending how big it is, it might cover most of the screen
or just the corner.
5. Another way to use background images are as navigation
buttons. While search engines can easily follow image links,
they don't carry the same relevancy as keyword-rich text links.
A background button image can make a text link look like a
button. Each navigation link would have to be placed within its
own table or cell, then apply the code used in the previous
example.
Used properly, background images can greatly enhance the appeal
of your website. If you are looking for a way to spice up your
website, these four tricks can help.
About the author:
David Leonhardt is a freelance writer and SEO specialist.
Contact him at Info@TheHappyGuy.com or visit his website at
http://www.thehappyguy.com. Read more webmastering and online
marketing articles at
http://www.thehappyguy.com/marketing-articles.html or pick up a
free motivation ebook at
http://www.thehappyguy.com/l/daily-motivation-inspiration.php Author: David Leonhardt
Feedback / Report a Post
Being a webmaster is a much more important job than most companies would dare admit. Webmasters are responsible for the company web presence on every level, from the website copy to the web and email server administration. Additionally, webmasters are often tasked even more duties that should be considered unrelated responsibilities for the position of webmaster. These extra duties often will include online as well as offline promotion and marketing, search optimization, advertising, application programming, graphic design and/or brand management. The role of the webmaster has grown over the years and webmasters need to grow with the company's expectations or the website will not succeed. For instance, it is easy to get banned from the search engines for not knowing the correct methods to use to optimize a website for a better results ranking from the search engines for any particular search phrase.
This is why Webmastery is here, not just to offer direction and assist webmasters, but to do so masterfully, as you expect of yourself, or as your company expects out of you.
Since I am an American and know only American English and SEO methods, I specialize in American Webmastery. Hence the domain name, Webmastery.US.
However, please note that often both sides of the coin are presented here. Some webmasters swear by Linux and we offer articles by such authors to give insight to their creativity. Others are die-hard Microsoft software fans and use Windows based servers. Despite the bias, each system has its own advantages, and such articles are reprinted here for their positive contribution to those platforms, not to enforce their bias. It is we that have to make the final analysis.
This difference is even more apparent when I am showcasing and promoting white hat SEO (search engine optimization) and a black hat SEO article is published here, which method if followed could get a website banned from the search engines. The reason I allow it a small platform is to showcase its apparent and obvious idiocy in contrast to white hat SEO techniques. And as I cannot edit these articles in order to correct them, I let their illogicality and stupidity stand on their own for a time without any edits. But in case their spaminess is not apparent, I often do not let such articles stand long.
Related Webmaster Information & Resource Sites:
Domain Buffs
Parking PPC
PPC Ad Income: Website Monetization
Apache Website Hosting
Design: CSS Websites
foo site: Website Coding
php Web Development
Target: Page 1 Search Result Rankings
Ad Working
Yahooter?
|
