As well, this method provides a direction as to what content you need to develop next, once the site is laid out. I’ll show you how to go from a few categories into building out an entire website design.
This post is aimed at DIY website builders who already have a base level of knowledge about building websites. It can be used by anyone, though.
The overall goal of your website should be to organize the information you wish to present to the world and make it easily accessible.
This sounds simple, but it can be hard to do well in practice. Here I will give an overview of how you can do this quickly.
Information Organization Basics
Go back to your school days and think about how you were taught to lay out a research paper. Think of the categories you had to use to fully discuss a topic.
- LITERATURE REVIEW/BACKGROUND
- FUTURE WORK
For the sake of clarity, I will combine a few of these categories.
- LITERATURE REVIEW/BACKGROUND
- CONCLUSION/FUTURE WORK
The questions you have to answer when you write a research paper are: who, what, when, where, and how.
Now, let’s map the sections of a research paper — the categories — to the who-what-when-where-how. This is one version.
- ABSTRACT (who-what-when-where-how)
- INTRODUCTION (what and who)
- LITERATURE REVIEW/BACKGROUND (who, what, when, and how)
- METHOD (how)
- RESULTS/DISCUSSION (what)
- CONCLUSION/FUTURE WORK (what, when)
As you can see, each category drives the keywords associated with it, and defines what you must discuss within each section. The layout allows the reader to clearly see what is presented and to navigate the different sections easily.
Website Design Basics
Let’s apply these categories and concepts to website design. Every website you build should answer the who-what-when-where-how. If you are building an eCommerce site, then you’ll need to include how much. You must always include a where.
You must describe:
- Who you are
- What you do
- Why you do it
- How you do it
- When you do or did it (now, in the past, or upcoming?)
- Where you do it
- How much it costs so the customer/user can do it, too
If we take the who-what-when-where-how and find common categories for them, then we will have something like this.
- Who you are ==> HOME, ABOUT (YOU or the COMPANY)
- What you do ==> HOME, ABOUT (PRODUCTS)
- Why you do it ==> HOME, ABOUT (YOU or the COMPANY)
- How you do it ==> ABOUT (PROCESS)
- When you do or did it (now, in the past, or upcoming?) (Contextual, often implied in the content.)
- Where you do it ==> CONTACT information
- [if eCommerce] How much it costs ==> PRICES
As you step through this process of answering the who-what-when-where-how and applying it to your website design, you can see that this creates categories, and that in turn will create subcategories and keywords.
Know These Things Before You Layout Your Site
- What is the purpose of your website?
- What is your “why”?
Are you a blog, a billboard or business card, eCommerce, or informational and educational?
You must be able to answer the “so what?” factor. How are you different from other websites with a similar theme?
Why should someone come to your site, buy your products, read your blog, or buy your services? What do you do for THEM? What problem are you solving?
This includes creating your mission and your vision. Your vision describes the why or the so what? factor. Your mission describes the what and how. Another advantage to doing this is that it can help you define your target audience or market.
One great aid to figuring out your why is to watch Simon Sinek’s great TED Talk on this subject.
Determining your “why” and “so what?” are one of the hardest tasks to do before building a website. Like many things in life, it only appears simple.
Basic Site Layout By Categories and Tags
Below, I’ve taken some of the common navigation categories and mapped the who-what-when-where-how to them.
- HOME (who, what, why, how, when, where, how much)
- SHOP/BLOG/PORTFOLIO, etc. (what, how, how much)
- ABOUT (who, why, how)
- CONTACT (where)
Now, you can see what types if information you need to put on the site, and where. This will drive the website design, including the choice of a theme.
Never, never, never pick a theme merely because you think it is pretty. Always pick a theme based on whether or not the functionality suits your content requirements.
Write out a paragraph and answer the who-what-why-when-where questions. In this example, I’ll pretend I am a photographer and I want to build a website for myself.
This doesn’t go on your website, it is a starting point. (You could use it in your ABOUT. However, the purpose of this is to think freely and brainstorm.)
My name is Jane Smith. I am a photographer and I want people to hire me to take portraits of their pets. I photograph landscapes and I want to sell the prints. As a photographer, I have a gift for capturing pets being themselves. This makes the owners happy and gives them memories of their pets.
My landscape photos capture the beauty of the wild and inspire awe and gratitude for this earth. I want people to know a bit about me, about my company, and what makes us both tick. So, I will write about these. People need to know how to contact me. They need to know my social media sites. This allows me to be hired and sell my prints.
If you step through the previous paragraph, you’ll see that Jane Smith answered her who-what-why-when-where. As your business, blog, target audience, and the market evolves, so too will this paragraph.
However, it is a starting point to give you direction. Next, let’s take Jane Smith’s paragraph and outline her website based on what she needs.
Example Website Design Sections
If she wants to sell, she needs a SHOP. Next, if she wants to be hired to take photos, then she will need a PORTFOLIO. If she wants to write, she needs a BLOG.
Since she needs to mention a bit about her business and her why, then she’ll need an ABOUT section. You should always provide a method, preferably more than one, with which a website visitor may CONTACT you.
Thus, Jane should outline her website as follows.
The order of a site must follow an F-Pattern. People look at websites from left to right, then down, then left to right again, then down, and so on. Thus, you want the most important things on the left.
Since the purpose of the website is to sell prints and be hired to take photographs, then SHOP comes before PORTFOLIO. There is some discretion here, however.
Jane may decide being hired to take photographs is more important then selling prints, and re-order her navigation as follows.
It is up to each of you to decide which category is the first purpose of your website. HOME always goes first, and I do recommend having a way for users to navigate back to your index page easily.
However, that is often done with a logo, so having an explicit HOME button on your major navigation is optional if you provide that ability to your users with the logo.
Keep in mind age differences of users, though. If some part of your audience is middle-aged or older, then the more explicit you can make your major navigation, the better.
In that case, you will want to leave HOME in the major navigation bar. Your navigation should be on display constantly, and not hidden.
If your users are a bit more tech-savvy, then go for a less tried-and-true navigation. For example, use a peek-a-boo navigation bar.
Example Website Design Categories
Next, we will create subcategories for most of these sections of Jane Smith’s website. This is where keywords/tags come into play. Each one of these subcategories can be a page on their own or combined.
For example, pets and landscapes should probably be separate pages. The subcategories under ABOUT can be combined on one page or on separate pages, depending on the amount of content.
- (no subcategory)
- photography tips
- client spotlight
- behind the scenes
- company history
- (online contact form)
- physical address
- phone number
- social media
As you can see, once you create the major categories based on the who-what-why-when-where questions, it then becomes easier to determine what types of information to put into each sub-category.
Then, you can determine what keywords to focus on based on the subcategories and major categories.
Generally speaking, contact information should be in the footer of every page and again on the online form contact page. Do not have only a form.
Give users multiple ways to contact you, depending on their preference. Some people do not like forms, as they do not know if the form actually sent the information.
Today you learned how to create categories and then use sub-categories and keywords to build out the pages and sections of a website.
You should do this before you create any content, do the website design (graphics) or build the site.
If you already have your content ready, then take the time to think through the layout of the site before you design it or throw the content online.
A well-laid out site will not only help you keep and retain users, it will help your organic search results rankings with Bing and Google.
Good luck, and please leave any questions in the comments below or contact me via the online form or email.
If you would like to get found online, work with me on your small business SEO.