website design company
call now
+91 808 017 2388
+91 902 911 3088
Web Design Blog

Build Basic Webpage Templates

by Mukesh | Jul 06, 2014 | Category: HTML
0

Commercial websites are built from templates. You or your designer will create a template that constructs each part of a typical webpage, with a "hole" in the center for the unique page content. This takes many hours to build from scratch, but it's worth it. Now you can create page after page from the template. For each webpage you'll insert a page title, meta tag content (see Point #7 below), a headline, and the text content, each in its appropriate spot. Have fun!

But let me take this a step further. Take a look at the sample webpage from my site. I've simplified it here, but the article content is surrounded by four sections, each of which is shown when a web browser comes to the webpage:

  • top.ssi -- inserts the masthead graphic, a banner ad, and some of the "tabs" navigation system at the top of the page. This is a separate file, called "top.ssi" that is inserted at the top.
  • menu.ssi -- inserts the complex left-side menu plus a database search feature.
  • bottom.ssi -- inserts a subscription form for my newsletter, plus more navigation links, copyright and trademark information.
  • right.ssi -- inserts cover shots of my books, plus links to purchase my e-books and affiliate links to products and services in the field of web marketing and e-commerce.

Each of these files is called a Server Side Include (SSI) file. On the webpage a single line of code calls one of these files and places it where it belongs on the page. Here's what it the code looks like:

The beauty of this kind of modular system is that a site built with SSIs can be modified or completely altered by just changing one of the SSI files and uploading it to the server. Now all the webpages in the entire system reflect the change. When I discovered how to do this it cut my maintenance time dramatically. Yes, it takes a learning curve to make it work, but it's well worth the time you spend! For more information see my article "Server Side Includes (SSIs) and Navigation Systems," Web Marketing Today, 8/1/1998 (www.wilsonweb.com/articles/ssi.htm).

It is possible, of course, to use a template for your pages that doesn't employ SSIs. But if you anticipate a site that could grow to more that 8 to 10 pages, you're much better off building your site with SSIs. If your designer doesn't know how to use SSIs, find another designer.

Modern websites control the font sizes and colors using Cascading Style Sheets (CSS). When you change the font size on a single master CSS file, it changes the fonts and colors in all your webpages. Cool! Make sure your website designer builds webpages using a single CSS file, since it saves maintenance costs in the long run.

The design decisions that you need to consider here are many, since they involve every detail of the look and feel of your basic template. Hopefully, you'll decide to employ both Server Side Includes (SSIs) and Cascading Style Sheets (CSS) that make your entire site easy to modify and maintain. Also consider features available with XHTML.

Leave a Comment
Request a FREE QUOTE
Our Clients: our clients