The Background-Table Combo

---

Ever wondered how some websites seem to have ...
of ... some use frames and other design ...
... this look, I'm going to show you a ...
to create the lo Ever wondered how some websites seem to have multiple"layers" of designs?Although some use frames and other design techniquesto accomplish this look, I'm going to show you a simpleway to create the look without the "headaches" ofcomplicated design techniques.You'll be glad to hear that you can create a dimensionallook for your website using only two simple tools.1. Background Images2.
TablesGo here to view a sample web page before we begin:http://www.webmastercourse.com/web-design-weekly/background-table-combo.htmHow to Insert a Background Image:When you open up a blank page in Composer, html,or any other design program, it's wise to insertyour background image first - before beginning yourdesign work.This allows you to lay the foundation for the webpage from the start, and eliminates confusion as well.A background image can be inserted the same as anyother graphic image.In Netscape Composer, you would open a "blank" web page,click on "Insert" and then "Image".On your image screen, you'll see a section near thetop labeled "Choose File". Here you'll select thebackground image from your hard drive that you wouldlike to use.
It will probably be a ".gif" file suchas bg001.gif or bg002.gif. Whatever you named thebackground image on your hard drive, you'll find it,and insert it here.Next, check the box where it says "Use as Background".This will cause the image you have selected to becomethe background for your entire web page.
Click"Apply" or "Okay", and your page's background should nowbe the image you've selected.Where Can You Get Background Images?The background image on my sample page was freefrom http://www.free-backgrounds.com/You can visit their website for a huge selectionof free backgrounds available that you can useon your website.You will save the background image to your harddrive the same as you would any normal graphic imageor clip art. Simply hold your mouse over thebackground image you would like to use, right-clickyour mouse, and click on "Save Background As".A screen will pop up for you to save the imageto your hard drive.
You can name the imagewhatever you would like with .gif being thesuffix.Such as: mybackgroundimage.gifInserting TablesOnce your background image is in place, youmay begin designing with tables.On the sample web page you viewed earlier, Iinserted one table that was 730 Pixels in widthfirst. I chose a color for my table that wascomplimentary to the background, and then begantyping.Next, I created a second table within the first table,and gave it two columns or "cells".
I resized thecolumn or "cell" on the right to be only 20% ofthe entire table width. This creates a sidebarnavigation section on the right.
I also coloredthis table white to distinguish it from the restof the web page.Please remember to insert your background imagebefore beginning your design with tables. Somedesigners place a background image, and thenbegin their writing without tables.
But, Irecommend using tables for the simple factthat it helps you to organize your web pagesand keeps everything in it's rightful placeon your page when others are viewing it.I hope you'll be able to accomplish manynew looks with these simple little tips. Article Tags: Background Image, Thebackground Image, Hard Drive Source: Free Articles from ArticlesFactory.com .