1. 18 drag and drop website builder Discussion Suggestions
Sixteen drag and drop website builder Dialogue How to Find the Best Free Website Builder
for Your Small Business
A "template" is simply a design format which you can apply to all (or most) of the pages in
your web site. The first advantage of using a "template" system is that it allows you to make
your most important design decisions at the beginning, and then just focus on content. The
second advantage is that it allows you to quickly create new pages based on your standard
design.
The disadvantage is that many template-based websites look homogenized and seem to lack
a unique character. Designers who sell templates tend to use the same formats over and
over again, insert the same generic images, and use the same techniques.
Rather just think of it as a basic page format that can be used over and over again. The best
template is therefore one that uses "standard" techniques that can be modified without the
use of specialized tools or programs (like Front Page or Dreamweaver).
Creating a Basic Template
If you are not familiar with web design, try working with a "bare bones" template to begin
with. There are two ways you can go. You can work with basic html and tables, or you can
create your basic template with CSS. Since CSS is rapidly becoming the new standard, it is
probably better to begin with CSS -- especially if you have not yet become used to
constructing web pages with tables.
CSS stands for "Cascading Style Sheets", but at the beginning it is not important to
understand what that means. What is important is to understand that CSS allows you to
create a set of formatting parameters in a "style sheet" (a seperate file) which you then can
very easily apply to your individual pages. In other words, you seperate the "style" from the
"content".
A simple style sheet can contain just three or four design elements. Here is an example
which you are free to copy (right click and "Save target as" to a location on your hard drive,
then change its name to "sample-1.css".)
Style Sheet Sample (be sure to change its name to "sample-1.css").
This template contains a definition for the body text, a header component (with a background
image), a "navbar", and a definition for two headline styles, h1 and h2.
Now that you have a style sheet you can begin building your web site by creating a basic
home page. Here is an example which embeds the style sheet referred to in the previous
paragraph. You can get the html code by just opening the page in a browser window, looking
at the "Source" code, and saving the resulting file on your hard drive as, for instance,
"sample-1.html".
Now you should have two files in the same location on your hard drive -- "sample-1.css" and

2. "sample-1.html". You can get the image file by just right clicking on the image in the sample
page and saving it to the same location on your hard drive.
Your second step will be to create the pages referenced in the "navbar", so make sure you
think of names for these pages before proceeding (e.g., howitworks.html, products.html,
about.html, sitemap.html, contact.html). Then build your hyperlinks into the navbar. (Look at
the code of the sample file to see how it is done.)