Creating a Basic Web Design Template

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 decision 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.

Just as important, templates are often not ready-to-go right out of the box. They almost always need modification, and often modifying a professionally prepared template is difficult because the designer will have used techniques you may not fully understand or are specific to the tools he or she used to create it.

So it is preferable not to think of a web template as the kind of thing you buy from an online template store. 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 contructing 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 "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.)

Once you have your basic home page with links, this then becomes your template. Just save it as "howitworks.html", "products.html", etc., and make the changes to the specific pages.

The result (once you upload it all to your host server) will be a basic, functional website containing a number of properly interlinked pages. It will also be search engine friendly because the design is not cluttered with scripts, and the most important elements are clearly laid out at the top of the page.

For more web design tips and techniques see the Linknet Marketing Resource Library.

Rick Hendershot is a marketing consultant, writer, and internet publisher who lives in Conestogo, Ontario, Canada. He publishes several websites and blogs, including The Linknet Network of Websites. This network provides an inexpensive way to advertise your website, and get as many as 100 low cost links.

MORE RESOURCES

People Locator find anyone in the USA

RELATED WEB SITE DESIGN ARTICLES: Design Matters in our Visual Culture FIRST IMPRESSION. First impression often leave lasting impression. Web Publishing Guide for the Beginning Entrepreneur (Part 1) The best things don't come easy. - QuotedThe finished web pages in your hands could be likened to a painting by Michelangelo without the Sistine Chapel. Website Sales: 10 Strategic Tips To Maximize Your Profits If you've a website but not making a lot of profit from it, cheer up because I have 10 website sales secrets that can help you maximize your sales and profits, starting now:1. Tell people the point or focus of your web site. Build It And Build It Cheap! Part II If you are familiar with my work, then you have probably taken a look at the first part of this article, and may well be on your way to having your website up and running. Congratulation!!! It's hard work, but having pride in the accomplishment is worth it! Now you have to find the people who want to see it, AKA--site traffic. Banner Enchancement - Designing Your Banner A well designed web site is great to have, but what if no one ever comes to it? Most web sites either rely on advertising, or have used advertising at some point in their existence, to get people to come to view the site. This means that your going to have to have not only a well designed web site but also well designed banners to attract your visitors. Offshore Web Design and Development - Use Great Opportunities Sooner or later every small or medium business owner realizes that he needs a web site for his business. And almost everybody wants to have great web site for affordable price because usually web site design budget is quite limited. Give Your Web Wite Visitors What They Really Want - Information! Surfing the internet is basically an information-fest! From intellectual discussion to the bizarre.. 5 Easy Ways to Improve Your Website When designing your website, remember to avoid useless and confusing features, however "cool" they may seem to be. Usually, keeping things simple and consistent are the best way to go. How To Choose A Website Designer Now that you have decided that it is time to create a website for your business there are many question you must answer. One of the most important question is "Who should create my website?"I like to use the analogy of playing music; in as little as a few hours, some people can strum a few chords on the guitar and play a song. Is A Picture Really Worth a Thousand Words? The great debate: how much copy you should have on your site, particularly on the home page?Do you subscribe to the idea that a picture is worth a thousand words--and therefore images, not a lot of text, should be the main thrust of your home page? Or do words have more power to capture a visitor's attention and compel them to buy--meaning you should aim for powerful copy?As a graphic designer, my natural inclination is to create graphically-rich, light text websites. Since I'm focused on what a site looks like visually, I like using impressive images, bold splashes of color all over the page, and not very much copy. A Website Checklist If you've just finished building your new website (or revamping your old one), how can you be sure it's "ready for prime time"? Or maybe your site's been around for awhile and you think it may be due for a makeover. Because Web technologies, techniques and standards change so rapidly, even a website that seems "cutting edge" when it's built can look obsolete a year later. Dos and Don'ts in Web Design - part 2 (content) Do know your audienceIt's important to know your audience. If you write for a site that sells toys you'll use other words, colors, images etc. Do You Really Need A Website? Nope. You certainly don't need a website. Appropriate Key Words Choice What do the key words represent?Key words - these are the words that the users enter in a given search engine to find services or products you offer. It is extremely important to know what key words they will use. Get Rid of Your Frames A few years ago a lot of websites utilized frame technology.A website that uses this frame technology is apparent when the left hand or top of the screen stays the same and the inner part changes when links are clicked on. Images: How To Make Them To Load Fast On Your Web Pages? 1. Use . Hiring a Graphic Designer You've come up with a great product. You've got the sales letter written for your website. The Golden Rule Of Website Building Copyright 2005 Robert Evans. Setting yourself up to earn a steady monthly income has to be a pre-requisite to your success online. There is no doubt that large sums of money can be made (and indeed are being made) from selling products or services online. Web Site Redirection - How to Implement a 301 Redirect You just created a new web site but want to pass on the search engine rankings of the old one to the new one. What is the most effective and spider/visitor friendly strategy to implement your web site redirection? You should use a 301 redirect. Give People What They Want And Watch Your Profits Soar! Do you know why the majority of people use the Internet?The majority of people use the Internet to do some type of research. In other words, to read.