How Websites are Made: Fixed Templates vs. Components

How Websites are Made: Fixed Templates vs. Components

Every design/development team has a slightly different way of creating a website. It all depends on preferences, capabilities, ethics, imagination, and problem solving. Some ways are easier for the team, some are easier for the client (that’s you!).

This article is going to go through a very common way (Way #1, for our purposes), and then a way that we much prefer over at Wanderoak (Way #2). Stay tuned to the end for some helpful questions you can ask your designer/developer to determine how they make websites.

Read on!

Way #1 of Creating a Website: Fixed Templates

(limiting + frustrating for you, the client)

The first way of creating a website involves designing and developing a number of specific layouts. Perhaps a layout for the About page, one for the Homepage, one for the page you’re going to use to sell your Products, and a visual one where you showcase all the funny things your dog is doing.

Each of these layouts was made for a specific purpose and they are named accordingly. The layout you use for your About page is called “About Page”, and the one you use to showcase your dog is called “Dog Layout”.

This works completely fine until a year (or even just a month) down the road, when you’d like to add a new page to your website and are left with the following options when choosing a page template:

  • About Page
  • Homepage
  • Services
  • Dog Layout
  • Default

And the default layout? That one’s just a basic layout where the entire page is a text area, and you are constrained to the things you can do within it. On top of that, when you try and get fancy with the things inside the text area, responsiveness of the page to screen size just starts plummeting. So what’s a person to do?

Let’s say the page you’re adding is a newsletter page that describes your newsletter and also has a newsletter sign up area. You choose to use the Homepage template since that one most resembles what you’re trying to do, but intuitively this doesn’t quite make sense, and you’re forced to come up with content that fits directly into the template. Now two of your pages are using the Homepage template, and although it doesn’t negatively impact your website itself, it can get really confusing down the road.

When you imagine your Newsletter page, what’s going through your head is a layout with some pieces of the Homepage and some pieces of About page. Now (if you don’t know how to code), what you are forced to do if you want to make it happen is pay somebody else more money to make it happen.

Wouldn’t it be nice if you didn’t have to do that?

Well. You don’t. If your website gets made with custom components and a page builder.

Way #2 of Creating a Website: A Page Builder with Custom Components

(versatile + freeing for you, the client)

Component: A website building block. When made by Wanderoak, components can be used on any page, in any order, as many times as required.

This is how we do things at Wanderoak. Here’s how it works:

  1. We look at an undesigned, plain text version of the content you’d like to share on your website.
  2. We pull out the patterns and recurring portions. This could be a call to action, a plain text area, an image that always has a paragraph of text associated with it, or a grid of links, each with an icon, heading, sentence of text, and button. Each and every piece of content gets accounted for.
  3. These recurring pieces of content get turned into components that are accessible through a Page Builder layout.

Now, when you’re creating a page, you have so much more flexibility. The list of components used on your homepage might look like this:

  1. Full Width Image
  2. Text Area
  3. Column Links
  4. Call to Action
  5. Text Area
  6. Full Width Image
  7. Image + Text
  8. Grid-4

The list of components on your About page might look like this:

  1. Image + Text
  2. Text Area
  3. Full Width Video
  4. Call to Action

Essentially, you have a number of components to choose from in order to build your page. Think of it like LEGO; you have access to a number of different pieces, and you pick and choose which ones to use, and where, depending on if you’re building a castle with a moat and drawbridge or a pirate ship, plank and all.

It means when you’re creating that new page on your website, you aren’t trying to fit your content into a rigid template that was created for a different purpose entirely. Instead, you get to create the layout that works best for you. Given that you can use the components in any order, and however many times you’d like, there are usually hundreds of possible combinations.

Instead, you get to create the layout that works best for you. Click To Tweet

Now that is flexibility.

Of course, there will always be times when a fixed template is required (when it’s a very complex layout and the pieces cannot be made to fit well together in different order), however, in 90% of cases, creating components accessible through a Page Builder is possible and feasible.

Questions to ask your designer/developer before you sign the contract

Since there are so many ways websites can me made, here are a few questions you can ask your designer/developer to help you determine how they make websites and how well this will work for you long term. I’ve added a few that go beyond just components; pick and choose the ones you need. ?

  • How do you decide the layout and look of your designs?
  • When the designs are brought to life, do you create a layout for each specific page I’d like, or do you create reusable components that I’ll be able to put together myself? How do they work?
  • What happens when I want to create a new page, and what options will I have for layouts?
  • Do you limit the number of pages you include? Why, and what does this mean?
  • Who is responsible for adding in content? If it’s me, how to you ensure I know how to do it properly?
  • Will you be teaching me how to use my website?

Be involved, ask questions, and stay informed — you’ll be happier with the end result.

2 thoughts on “How Websites are Made: Fixed Templates vs. Components

Comments are closed.