by Larisa Thomason,
Senior Web Analyst,
Imagine coding every new page in your Web site from scratch. It wouldn’t be much of a problem on a 10-page site, but a 100-page site would be a huge project – both in initial coding and debugging. Fortunately, there’s an alternative: a Web page template. Templates make creating new pages a snap.
But first you must decide whether to create your own template or use a ready-made one. Choose carefully. Your decision can affect both page download time and site promotion.
Templates Are Timesavers
The template concept is simple. Most pages in a Web site have the same basic components: navigation system, copyright, contact information, and company logo. Generally, the main difference between pages is the actual text content and images associated with each. A template allows you to leave these common elements in place and quickly enter the unique page content.
Think of the benefits:
Less work for you! It’s a lot easier to open a file named Template.html, enter the content for your new Web page, and then save the page under its new name. Your logo, navigation, etc. are already in place.
Fewer HTML errors. Every extra keystroke is an opportunity to make a mistake. A template reduces – but doesn’t eliminate – your chances to make a simple error that breaks the page.
Consistent look and feel. Your visitors rely on visual cues for reassurance that they’re still at your Web site. With a template, the colors and layout remain the same from page to page.
Keep visitors at the site longer. A template helps you keep your site navigation structure consistent and predictable. Visitors probe more deeply into your site without getting lost. The more comfortable visitors are, the longer they’re likely to stay.
Templates are such helpful tools that almost every site on the Web uses one in some form or another.
Finding A Web Template
Web page templates aren’t hard to find or create. Webmasters usually get a template in one of four ways:
Create their own template
Use a template provided with their HTML editor
Download a free Web template
Purchase a template or set of templates
Many webmasters create their own template after they’ve designed the home page. Because a great home page is so important, it’s usually the first page finished in a Web site. Once that’s done, it’s easy to use the home page layout as a guide for the rest of the site. Just replace the home page content with the “About Us” or “Products” pages’ content.
Other webmasters may not have the time or expertise to start a site from scratch or the money to hire a professional designer. They prefer to purchase a ready-made template to compensate for their lack of time or design skills.
Templates are easy to find. Some HTML editors have standard templates bundled with the software. Many others are available for free online: just enter “free Web templates” into a search engine and you’ll get thousands of results. Some companies offer sets of templates where you have access to between several hundred and several thousand templates for one price. Other services let you to purchase a single template for a small fee ranging from $5 to $25.
Shop around because prices and quality vary widely!
Ready-made Templates: Buyer Beware
There’s nothing wrong with using a ready-made template. You aren’t cheating and you aren’t stealing someone else’s work (as long as you’re using it with permission). However, there are some other issues with templates that affect the usability and profitability of your completed site.
Let’s look at some of the most important considerations.
Too many images: Because a template is a design tool, you’re likely to find it contains a lot of images: everything from navigation buttons to tiny curves and other embellishments.
These designs can be quite eye-catching but remember that every extra image has to be requested and downloaded from the server. Look at the images critically and make sure that they.re really needed. You can often get the same effect by adding background colors on table cells or to DIVs.
After you’ve selected the important images, use GIFBot to optimize them.
Incorrect or confusing HTML code: Many template designers are graphic designers first and programmers second. Test the template in as many browsers and browser versions as you can. What looks great in Explorer may be broken in Netscape or Opera. Even simple errors may hide your content from search engine spiders.
Also, be prepared for the difficulty of reading someone else’s code – particularly if they didn’t take the time to add comments for readability.
Editing the code may be particularly difficult if the template designer used a WYSIWYG editor. Use HTML Toolbox to scan the template for coding errors and browser-specific code.
Layout tables or nested tables: Many ready-made templates use tables for layout – and use them badly. We’ve seen some that have tables nested five levels deep. That’s a table within a table within a table within a table all contained in a great big table! You have to be an experienced coder just to figure out where to place the content.
Many levels make it harder for a search engine spider to index your page because it buries the content inside a bunch of extra HTML code. They can also slow page download time if the designer didn’t build the tables for speed.
That’s another good use for HTML Toolbox. It gives you the approximate download time for the HTML file. If the template takes 30 seconds to load before you add content, you know there’s a problem.
No CSS Formatting: Template designers rarely incorporate CSS formatting into their designs so templates are often full of FONT tags and other deprecated HTML elements. The designer may not care about the underlying code or may just assume that a webmaster using a template won.t understand how to apply the styles.
Templates As Idea Tools
After that list, you’d probably want to run screaming into the night if anyone offered you a template. But stay put because ready-made templates really are good tools – even for experienced designers.
It’s hard to sit down in front of a blank computer screen and think: “I have to design a Web page.” That page seems big, white, and very, very empty. Templates help jump-start your imagination. The instant you look at any design – even a bad one – you’re already thinking about how you could make it better.
That’s the key: use ready-made templates as idea tools instead of design tools. Viewed that way, a set of 500 (or more) Web templates is a great investment. As you browse through the catalog, you’re collecting ideas and learning:
Which color combinations look best.
New ways to use icons and place navigation bars.
Which page layouts are easy to read.
Even if you’re a professional Web designer, a set of templates can greatly speed the design process with clients. Clients can look at templates and give you valuable feedback about their likes and dislikes before you ever write a line of code.
Once you’ve found a template that works for you or pasted together parts of several templates, consider writing your own code to duplicate the design. It’s likely to be more compact, have fewer errors, and be much easier for you to maintain later.
That approach gives you the best of both worlds: a great design that attracts human visitors and Web pages that download quickly and earn high search engine rankings!