Web Page Backgrounds

From LoveToKnow Web-Design

Today's web design tools allow you to create both simple and elaborate web page backgrounds with just a few keystrokes. And if that isn't easy enough, there are many websites that offer backgrounds where all you have to do is cut and paste some basic HTML codes into your own site.

[edit]

About Web Page Backgrounds

Backgrounds can brighten up even the dullest of web pages. They can be images, graphics, words or colors. The backgrounds could be stationary or can scroll along with the rest of the page. They can be seamless or textured. The possibilities really are endless.

[edit]

Solid Color Backgrounds

Web page backgrounds are created in several ways. If you are HTML proficient, you can write your own code. For example, a simple background code (inserted into your body tag) for a solid blue background would be:

<BODY BGCOLOR=#000077>

And if you want to add complimentary black text and gray hyperlink colors, you would do so at this time:

<BODY BGCOLOR=#000077 TEXT=#000000 LINK=#EEEEEE VLINK=#EEEEEE>

You can choose either the hexidecimal code for the colors or you can write the name of the color into your tags. Be sure to make sure the colors you choose are web safe and can be viewed in a variety of browsers.

[edit]

Seamless Textured and Tiled Backgrounds

Textured backgrounds can give your page a "rough" appearance. The style can simulate stucco, wood, concrete or even sand. You can also use images, words, mosaics or other graphics to create a tiled background. With a photo editing program, such as Paint Shop Pro, you can alter the image so it appears seamless when tiled on your page's background. Keep your image to a workable size of about 250x250 pixels. This will allow you to create an appropriately sized border margin.

If you aren't able to create your own seamless textured background, check out these sites for simple instructions:

[edit]

Using Cascading Style Sheets for Backgrounds

To ensure the same background on all of your web pages, the easiest code to write would be a Cascading Style Sheet. Once you create your background's style, all you need to do is copy and paste a certain CSS code on each of your pages. Examples of CSS for web page backgrounds, including those with images and graphics, can be found at:

[edit]

Tips for Creating Backgrounds

A background can make or break a web page. When deciding on one, keep a few things in mind:

If choosing a solid color background, make sure the color is within the scheme of your page. You don't want to overpower those viewing the site.
Decide ahead of time if you want a tiled background or one that is seamless. Tiled backgrounds work best with images.
If using images for your background, keep them simple and small (no bigger than 100x100 pixels). If used wrong, they can tend to distract you from what the page is really about. Larger images may also cause your page to load slower and, in come cases, make the page unreadable.
Always double check and preview your code before publishing.

[edit]

Adding Backgrounds to your Web Pages

There are several ways to add backgrounds to your web page. For those with a lot of web design experience and want a customized background, writing your own HTML code would be easiest. The following is a list of websites that show you how to do that:

Homepage Made Easy offers several tutorials on adding solid color backgrounds, as well as those with images.
HTML Tutorial has a simple code that is used when adding an image to a background.
Sample Texture Backgrounds offers a great collection of background textures for you to download and use on your pages.

Retrieved from "http://web-design.lovetoknow.com/Web_Page_Backgrounds"