HTML TEMPLATES FOR PAGE LAYOUTS
Quick Copy & Paste Designs
We have created several
common web page HTML layout designs Templates for Webpage Designers using the
Tables Design
Technique described on another one of our Design Series pages.
If you have not read that page, please take a moment and do it, it
will simplify your understanding of these codes...
Now all you need to
do is activate your curser within the text box below the Template
Example of your choice, and Copy All the HTML code, then goto your
Page Editor and Paste the code into
the Editor Box, then SAVE... then you can
REMOVE Our Comment Text and Add Your Particular Page Content (text,
images, more table codes or whatever) where you
want!
CAUTION: Using unbroken text strings OR images that are too wide
for any of the table cell widths, will cause browsers to PUSH the
cells open wider than you want... control text strings with the
<BR> tag and control image sizes with the img tag attributes
"width" and "height"...
NOTE:
You can change the value for "cellpadding" (try 5, or 7) to add
some space between your cell content and the cell
walls...
You
can also change the values for cell background COLORS (bgcolor="?")
and the values for cell content HORIZONTAL ALIGNMENT (align="?")
and VERTICAL ALIGNMENT (valign="?")...
A Few Words On Using Pre-Made Downloadable Design Templates (available from various web sites): Unless you have a Good Working Knowledge of HTML and CSS along with Experience in using Files and Folders and Images... you should refrain from using Pre-Made Downloadable Design Templates for creating your web pages! Stick with straight forward HTML Templates, as we have provided here on this page! If on the other hand you have sufficient knowledge about Web Design, then Pre-Made Downloadable Design Templates can be a nice way to build pages! What you will get when you Download a Template is the HTML Code (for the complete page), plus all the Images that you will need for the page... It will be up to you then, to delete their content text and links, and replace them with your own, as well as set-up the paths to the Images!
There are many, many sites that will offer you templates, both Pay and Free... here is one recommended for you to try for starters:
Free Website Templates
TEMPLATE #1
| Put
Your Left Page Info Here |
Put
Your Main Page Info Here |
NOTE: We have set
Border="1" to show you the Template but for your page you should
set Border="0"
TEMPLATE #2
We used this template for this page that you are
currently viewing and many more of our pages!
| Put Your Top Page Info Here |
| Put
Your Left Page Info Here |
Put
Your Main Page Info Here |
NOTE: We have set
Border="1" to show you the Template but for your page you should
set Border="0"
TEMPLATE #3
| Put Your Top Page Info Here |
| Put
Your Left Page Info Here |
Put
Your Main Page Info Here |
| Put Your Bottom Page Info Here |
NOTE: We have set
Border="1" to show you the Template but for your page you should
set Border="0"
TEMPLATE #4
| Put Your Top Page Info Here |
| Put
Your Left Page Info Here |
Put
Your Center Page Info Here |
Put
Your Right Page Info Here |
NOTE: We have set
Border="1" to show you the Template but for your page you should
set Border="0"
TEMPLATE #5
| Put Your Top Page Info Here |
| Put
Your Left Page Info Here |
Put
Your Center Page Info Here |
Put
Your Right Page Info Here |
| Put Your Bottom Page Info Here |
NOTE: We have set
Border="1" to show you the Template but for your page you should
set Border="0"
CAUTION: Using unbroken text strings OR
images that are too wide for any of the table cell widths, will
cause browsers to PUSH the cells open wider than you want...
control text strings with the <BR> tag and control image
sizes with the img tag attributes "width" and
"height"...
Tables 2---Page Critiques 
|