Web Design Templates: The Good, the Bad, and the Copyright-infringed

In a recent post, I wrote about the pros and cons of using the free website building tools that come bundled with a web hosting account. Another way for someone with no web design or development skills to build a website is by using a web design template. Like the free tools, web design templates can be a good solution for some, but you should be aware of the limitations.

How web design templates work

A web design template consists of a set of html files for your home page and (usually) at least one other page of your website, plus all of the supporting graphics and style sheets (CSS). You can find hundreds of websites offering web design templates by doing a Google search on “web design templates”.

As mentioned in the review of website building tools, one of the risks of using a template is having a website that is nearly identical to the website of anyone else who has used the same template. Not the best idea if you are trying to brand your business uniquely.

The advantage of a web design template is that you can get up and running quickly with a nice looking website based on standards-compliant code. Depending on your budget, level of expertise, and need for a uniquely branded look and feel, a web design template may be a good choice. But beware: web design templates may not be as easy and cheap as they first appear.

Easy and cheap, or frustrating and expensive?

Many “free” templates are restricted to non-commercial use only, which makes them unsuitable for any business. Pay-to-play sites usually sell templates for commercial use for under $100. Some template websites also offer limited customization of a template, which can add anywhere from $50 to hundreds of dollars to the price tag, depending on the level of customization. Some also offer the option to pay a premium price and buy that template outright. It’s then removed from sale, so you don’t run the risk that your website will look identical to hundreds of others. A lower buyout price is offered if the template has already been downloaded by others. The buyout doesn’t change that, but prevents anyone new from purchasing the template. The cost for a unique or buyout template is usually in the $2,500-$3,500 range (although I’ve seen them for as low as $400 and as much as $8,000). In this price range you may be better off hiring someone with whom you can work directly to customize the site to your needs.

You can also customize the template yourself if you know a bit about HTML and CSS, or you can hire a designer to do the customization for you. I would recommend that you bring the designer in before you purchase the template though, as what appears like a nice-looking site may actually be a mess of bloated and deprecated code under the hood. At the very least, make sure that the website offering the template makes some guarantees about the quality of the underlying code.

A web design template is not a content management system. If you want to customize it yourself, you need to be comfortable editing copy and changing graphics within the HTML file. That’s generally not too difficult once you learn what to avoid, but be forewarned that accidentally deleting so much as one “>” character in the file can break your entire page. So you need to be careful, and save backups of your files as you go along. You may also be able to make changes using a WYSIWYG editor, but they often add a lot of unnecessary code to pages, which you can avoid if you edit the HTML directly.

You can make pretty substantial changes to the look and feel, and even the layout, of a template using Cascading Style Sheets (CSS). In theory, it’s not too difficult to learn to make basic changes in CSS such as font size and color; in practice, how the “cascade” of styles is structured, relative size values using ems, !important tags, collapsing margins and browser inconsistencies can turn “I’ll just make this one simple change” into hours of head-scratching as you wonder why your changes don’t look the way you intend.

A decent web design template will come bundled with the layered Photoshop files needed to modify any of the graphics used in the template. So in addition to being conversant in HTML and CSS, you may also need to know how to use Photoshop in order to do much in terms of modifying the template. As of this writing, a new copy of Adobe Photoshop, not bundled with CS5, lists at adobe.com for $699.

Realize that a web design template has nothing whatsoever to do with web hosting. You will still need to sign up for a web hosting account so that you have someplace for your files to live. You’ll also need a way to FTP the files onto your web hosting account, either by using tools that are including with your hosting account (such as the File Manager that is part of cPanel), or by downloading and installing FTP software. Some template websites offer an option of installing the template for you, usually for another $40-$60.

Support and documentation

Little, if any, support is offered with free templates. If you run into problems, you’re on your own.

Some templates are documented. Documentation can be a good starting point, but may not be that useful. I worked with one client who was very excited about the template he’d purchased because it was so thoroughly documented. But the documentation was not much more than a guide to what sections of the Photoshop mockups related to what sections of the code. I use the Firebug extension to Firefox, which gave me the same information, and more, in a more usable format.  The documentation didn’t save me any time, or the client any money.

You may purchase a template assuming there is support, because you can see a tab labeled “Support” on the menu. Be sure to investigate how deep and useful the support is before you buy. The support “tutorials” about CSS on one template site consisted of a definition of CSS, a pointer to where to find the style sheet, and instructions on how to do three random style changes. If you were counting on it to help you style your website, you would not get very far. If you want a more thorough tutorial on CSS, check out w3schools CSS tutorial. They also have a CSS reference guide that is useful to keep bookmarked.

Beware the wrath of Getty

Getty Images is a major publisher of stock photos. They have a number of different licensing agreements with photographers who supply them with photos. Photos are generally licensed to a single user, and may have additional restrictions on where, how, and for how long a photo can be published.

Some completely innocent, unwitting, well-intentioned people have found themselves to be recipients of the dreaded “Getty Images Settlement Demand Letter” as a result of having used images that were part of a web design template. This letter may demand thousands of dollars (or pounds or euros) for copyright infringement. They will not care that you got the photo through a template. If it is on your website, you are the one in violation. In their eyes it’s the equivalent of stolen goods. Telling them you downloaded a free template is about as effective as telling them you bought that photo off some guy who said it fell off the back of a truck. Be absolutely sure that you have proper licensing or permission for any photos on your website. When in doubt, don’t use it.

Templates vs. template frameworks

From a design point of view, I make a distinction between a template and a template framework. Most templates are designed to be used as is with minor customization; a framework is intended as a starting point for a custom design. I commonly use the Thesis theme framework for WordPress websites. The distinction is that Thesis, like other frameworks, offers a structurally sound, standards-compliant platform that is close to a blank slate, visually. The documentation is actually helpful, and provides capabilities that an ordinary WordPress theme does not include. There is also a support forum in which questions are answered by identifiable experts, not by random people who happen to pop into the discussion that day. As a designer, I can dive in to customizing the look and feel of a website without worrying if the basic structure is going to break in Internet Explorer, or choke on the next WordPress upgrade. Websites I’ve designed using Thesis include this website, as well as sites for Natural Healthcare and Diagnostics and Excellence in Performance (and a couple currently in progress). If you are looking for an instant look-and-feel, a template that begins as a clean and spare starting point may not be appealing. But if you are looking for a stable starting point for your own customizations, go with a quality framework.

So should I use a template, or not?

Web design templates are a big step up from free website building tools. In summary, here are the issues you should be aware of if you’re considering a web design template:

  • Free templates are not usually free to commercial businesses
  • If you are not technically adept, you may find it frustrating and/or limiting
  • If you are technically adept, a well-supported template framework may be a better option
  • What appears cheap may cost a lot more if you want installation, customization, or exclusivity
  • Be careful that you get good, solid code and support
  • Be sure any images are licensed for you to use