Having a good website is key to developing a web presence, but it can be hard to know where to start. In this blog series, I’m giving you a sneak peek into Practical Promotion’s and Livestock HUB’s step-by-step website building process, beginning with Step One: Planning.
Today we’re moving on to Step Two: Organization. Remember how I said you’ll never regret the time spent devoted to an initial planning session because the information gained would be really helpful later on? Now is the “later on”. It’s time to take all the information gathered and begin to sort it into a website tree, a very useful tool for organizing information that helps form the framework and structure of the website.
Outline the Information
The first stage of organization is to outline the information gathered in the planning session in step one. We’ll use my client website example as an illustration. In our planning session, my client and I pinpointed the purpose, target audience, and goals of the website, then I made an outline:
Purpose:To create an easy-to-use website for our customers/future customers to gain information needed to consider us for future work. The website should highlight our history, quality demonstrated through case studies, technology, and upcoming events.
Target Audience: 1) new private sector customers, 2) existing private sector customers, and 3) government and government prime contractors.
- To demonstrate the capabilities of our plant to new and existing customers.
- To give our customers insight into our reputation and history through demonstrated case studies.
- To give our customers information about the technology that makes us unique when compared to other suppliers within our industry.
- To inform our customers of upcoming events and opportunities in the industry.
Making an outline really simplifies the information and helps the important information rise to the top.
Build a Website Tree
The next stage of organization is building a website tree. A website tree is a simple tool to help organize the information that will be contained in the website and structure it into a framework that’s clear and easy for the target audience to navigate. Important questions to consider when beginning a website tree include:
- How would the client order the information from most to least important?
- What does the client think visitors of the website (their target audience) will be looking for when they visit the website?
- What does the client want their target audience to see FIRST when visiting their website?
In our example, my client’s clear purpose and goals made building a website tree a snap. Check out the samples of my client’s website tree. I’ve included step-by-step illustrations because I built the tree in stages, starting with the most important information and working my way down through the supporting information and minor details. The most important information became the main pages of the website and the headings featured in the navigation bar (Fig. 1).
After main pages have been determined, I begin filling in the supporting information for each (Fig.2). My client from our website example was very clear about what information he wanted, how he wanted it prioritized, and where the supporting information should go. The majority of my clients need more help with this stage of the website building process, so I ask a lot of questions, such as:
- Is there information for a main page that could be structured into a drop down page? Keeping pages from becoming cluttered with too much information is really important. Create a child, or drop down, page to help keep the information clear and organized in a way that makes sense to the website visitor.
- What information do you want to be really quick and easy for people to find on your website? This information needs to be front and center as a navigation bar, or main page, item.
In our example, my client wants “Our Work” as one of the main page navigation bar items, but he has two distinct subjects he wants featured within that category of information: case studies and a parts gallery. We could try fitting all the information on the “Our Work” page, but that means the website visitor will be doing a lot of scrolling up and down the page to access all the information. By splitting the information into two drop down pages, we’re instantly creating clarity and ease of access for the target audience.
The website now has a basic organizational framework in place. Once I begin designing the physical website, it looks something like this:
The navigation bar items are all lined up at the top of the page. Hovering on a navigation bar item shows the drop down pages that are built in underneath. This example shows what happens when you hover over “Our Work” – you can see there are two child pages in the drop down, “Case Studies” and “Parts Gallery”.
Now that the basic organizational layout of the site has been determined, my client and I will move on to content, which is the third step in building a website and the final brick in the base of our website building process. I’ll be discussing content in the next blog post, so stay tuned.
Keep on friends!