Templated Websites

 

What is template driven design?

Template driven design is the process of making a website using a collection of templates, known as a theme.

The word template is often used to describe a theme and the two words are used interchangeably although there is a technical difference.

A template is a premade layout.

Website themes (or templates) are pre-designed and pre-built websites that you can simply add your content to.

A lot of online services like Wix, Squarespace and Shopify have them.

WordPress also has them.

A premium template costs around 60 dollars. There are plenty to choose from and most of them have lots of design layout options.

Systems that use templates

For the most part this article is based around WordPress templates, which has the largest collection of templates.

However a lot of what is said, can be applied to online platforms like Shopify, Squarespace and Wix as well as other open source like Drupal and Magento.

Types of web themes

There are thousands of templates to choose from but there are four main types.

Flexible Template Systems (aka page builders)

These are templates like Divi, Avada, Visual Composer, WP Bakery and Elementor. You need WordPress to run them.

They come with page builders, which makes them very easy to edit, although getting to grips with each system takes time.

Each template system comes with a library of starter themes that you can modify using the page builder so that your theme and content fit together snugly.

There are also 3^rd party created templates that work for specific page builders – so there is plenty of choice.

 

Theme based themes

Themes were not always as flexible and today there still exists a wide range of themes that are more focused on helping a particular business segment.

There are themes for churches, schools, digital agencies, coffee shops and so on. They usually come with many design options and features too.

A lot are written in HTML and CSS, so they can work with many platforms. The good thing about using HTML templates is that they are much faster than templates on page builders.

Most people want to work with page builders and so more and more “theme based themes” are being created to work with them.

Specialist functionality templates

There are templates out there that come with a whole bunch of functionality that would be hard / costly to develop on your own. For example, if you’re trying to make a property listing website, or a jobs listing website, these templates can really accelerate your project. They are worth considering if your project is heavy on functionality but doesn’t require a unique / custom way of doing things – in which case you would need custom design and development.

Ecommerce templates

Ecommerce website projects have many moving parts, so using a template can reduce the inherent cost and complexity. Having said that, there are many examples of ugly ecommerce websites that look that way because they chose an ill-fitting template. Likewise, there are many ugly custom made website that could have worked out better had they used a template.

The thing to bear in mind is that most e-commerce websites have more or less the same layout because of design convention and because the design works. What makes a great looking website nowadays, especially ecommerce website is the photography, so unless you’re after something really special and you have the time to go through an extensive design process, go with an ecommerce template.

What are the benefits of using a template?

There are three potentially big benefits: Quality of design, time saved and cost-saving.

Designs can look good if your template and content match.

You can save time if you’re not constantly tweaking your design and you can reduce your costs because you’re not hiring a developer to code each and every element of the page.

Web design and development projects can take 1 to 2 months and you’ll want to spend a good chunk of that time planning the site out with us through user experience design.

By the time you get to the design and development phases, you’re looking to cut time and finding the right template may be just the ticket.

What are the disadvantages of using templates

Template and content mismatch

Templates always look great out of the box, but unless you’ve got the content to match, your design may end up looking very amateur.

Even if you can make your content match your template, it can be a difficult exercise and one that doesn’t come naturally to many. In other words, for more people, it’s easier to make the box fit the text, rather than the text fit the box.

Changing templates to match your content can take more time than building from scratch and you might not succeed. A lot of rushed websites end up looking bad, running slowly and costing more than expected due to templates.

Cumbersome responsive web development

Templates usually look great out of the box and with some effort look great with your content. However, making them look good across multiple devices can be tricky, although not impossible.

Except for the simplest of design layouts, websites need to be tweaked to look “well adjusted” in various sized screens.

This is fiddly work at the best of times but when you have to do the work via a set of menus to adjust widths, heights and spacing, it can be downright frustrating, especially to a trained developer.

Slow websites

This is a particular problem with WordPress websites and may not apply to SAAS systems like Squarespace.

Templates are by nature bloated. They are systems that hide away some of the complexity of design and development. In doing so, they create a whole bunch of extra code “under the hood”. This code can be hard to debug since you’re not meant to look at it but worse than that, it means that the machine running the website has a lot more work to do when compared to a custom coded website.

If you’re planning on having high traffic, stay away from templates – at least the super flexible ones.

How do you make a website using a template?

If you want to use a template, then we’ll have to use a template driven design process. This essentially means choosing the right template, working out the right template sections to use and then fitting the design and content onto it.

It’s a fairly simple process – unless you’ve chosen a template that doesn’t suit the content you have available.

This is why we try to leave the template choice decision until we’ve carried out extensive content planning.

When should I use a template?

Templates are great for a wide variety of projects, particularly now that they come with page builders which lets you modify them easily.

Here are some good reasons situations when templates are ideal when:

Client wants to be visually led

Some clients want to work with templates because they are visual and need to see the structure to be able to collaborate effectively.

Templates are good when there isn’t much content

Templates are useful for projects where client don’t have much content or structure to their content. This situation applies to new or small business websites and local business websites

When there is excellent photography

Templates are good to use when/if you are able to choose good stock photography that brings the whole site together. If you want to stick to a simpler site, with less photos and more authenticity, then try a more custom approach.

You need a stylish website

Templates are good for projects where style is more important than message. For instance, wedding websites, personal websites, band websites and consumer websites in general.

There is no need to go custom

It’s not always easy to tell at the start of a project whether a suitable template will be found.

Templates can also be a good choice for certain businesses but you will only know their suitability, once you’ve worked out what you want to say on your site.

In other words, after extensive planning.

 

Working with templated websites

If you have a template, like Divi, or Elementor or Avada. You’ve probably realized it’s not as easy to use and create a website as it looks.

We recommend not limiting the design process by trying to fit your ideas onto a design. It’s not a cost effective way of working.

Having said that, we’ve worked with all sort of templates and if you’re set on using a particular template then we’ll simply use a Templated Web Design process

How to fix a slow templated website

WordPress sites built on templates are slower than custom coded websites sites.

Most of the time, it’s not visibly slow but there are cases when websites become painfully slow from all that bloated template software.

For the sake of SEO, you need to make sure your website is running as fast as it can.

After launching the site you will need to speed optimize your website. With some effort, you can make your website appear as fast a custom-coded website

 

Developing with templates vs Custom coding

Professionally trained developers prefer to custom code. They find it faster and less frustrating. If you don’t know how to code, then using a modern flexible template (page builder) like Divi or Elementor can help you build a website but it does come with some heavy drawbacks.

Developing with templates means working your way through a series of menus, changing values here and there. The more flexible the system, the more complex the options and it can be slow to navigate around and remember where you did what and how you did it.

Wrap Up

Given the right circumstances, templates are the perfect choice.

They bring down the cost of development and they look fantastic.