| Subtotal | $0.00 |
USD
U.S. DollarEuroBritish PoundCanadian DollarsAustralian DollarsIndian RupeesChina Yuan RMBMore Info →
| Subtotal | $0.00 |
Congratulations; you’ve done it. You’ve made those first vital steps toward starting a small business website. You’ve sorted out your domain name and hosting and you’re ready to tackle this project head-on. But what comes next? Whether you decide to hire a website designer or go down a more DIY route, quite possibly the most important factor you will need to take into consideration is website architecture.
The term “site architecture” covers the overall layout and design of your website, but also the nitty-gritty details; the components that many people who are starting their first website don’t think too much about, but absolutely should.
After all, if your website isn’t optimally designed for an intuitive and pleasant user experience, why would people buy what you’re selling or even bother coming back? Having this planned out now will save you stress, time, and money in the long run.
Every website do the following, and they should do it quickly and clearly:
Sounds pretty straightforward, right? However, planning the layout of your website is nearly impossible if you don’t have any idea of definite goals or how best to meet them.
So, before we discuss anything to do with content, navigation, card sorting, and all the other vital elements of website architecture, you need to sit down and really think about what you want to achieve with your small business website.
Read on for advice on just how best to do that.
Sometimes when you think about things in the abstract, this bit can seem a little overwhelming. Let’s say you run a florist and want to start advertising your wares online and provide a delivery service for your local area. It can be easy to get a little too ambitious when you start fantasizing about having the most successful florist delivery service with stores all over the country. But how can you achieve that with just this little website?
You can’t (just yet!). So focus on what’s doable in the here and now – building an empire can come later. Do this by:
What is the intent of this new website? Are you selling a product? Are you providing a service? Whatever the drivers of this website may be, keep them in mind throughout, so you don’t lose track of why you’re creating this website in the first place.
A good way of keeping on track is thinking about your ideal customer or user. What kind of person is most likely to purchase your particular range of fishing rods? Who can you imagine using a chauffeur service? You may have a good idea in your head, but it’s always good to conduct user research; you may just be pleasantly surprised by what you find. Research can be conducted through interviews and surveys (which we’ll talk more about later).
Don’t try to appeal to everyone; not everyone is going to come to your site. You don’t want to scare off anyone in your key demographic by alienating them.
Whoever your likely user may be, it’s a good idea to understand their potential behavior by looking into their needs and motivations. A good way of doing this is by creating a persona. After you’ve finished with conducting your research, use the data you’ve gathered to paint a picture, and write a story for the persona most likely to peruse and purchase what you have to offer.
This persona will serve as a touchstone for when you are creating your site architecture. When you’re not sure what your next step will be, look to “Steve” or “Alison” and ask yourself what he or she might best respond to.
What is a website without content? Content doesn’t just refer to long-form articles or blog posts (though it certainly can do), but also informational text, imagery, videos, or anything else you may need to include on your website. Think about the following:
Knowing exactly what it is you are structuring will save you time, and you’ll have to do less work in the long run, so try to pinpoint this before you begin the process.
Now that you have everything clear in your mind, what follows are the basic, key components every website needs. These are:
After that, we’ll delve into the do’s and don’ts of user experience.
The homepage is easily one of the most important components of your website. Essentially, it’s your site’s front door. Think about the front doors you’ve encountered in your days. If it’s not inviting, do you even bother knocking? Same with a homepage. If there’s nothing appealing, a visitor won’t bother clicking any further.
But what exactly goes on the homepage? How do you go about making yours appealing? This is going to vary depending on what this website is for, but first and foremost the homepage needs to make it immediately clear what it is you’re selling or promoting. You need to appeal to whoever has just landed on your website and entice them to convert.
Unlike a landing page (which we’ll talk more about later!) your homepage will want to serve several purposes and appeal to different audiences. Balance is key here. You need to get your point across without overwhelming the customer, while still showing everything you have to offer. Tips for doing this include:
Your homepage should include a variety of links, such as:
Also, consider what you want the first thing that someone who enters your URL to see. Think about what it is that makes your business different, what makes it stand out from the rest. Some examples of this could be:
And plenty more besides. Chances are, there are innumerable things that make your small business worth opting for. Pinpoint your specialty and display it front and center.
The kind of content you ultimately decide to include on your website will be highly dependent on your website’s intent. Here are some suggestions based on frequent components of the most common types of small business websites.
While site structure is important no matter what your website type, ease of use can be the difference between making a sale and not making a sale with an eCommerce site. You need to order things in a way that makes sense. Creating specific, targeted pages are key. As an added bonus, a well-organized website is more likely to rank better in search engines.
So, if your online clothing store has a page that’s ranking well for hats, you don’t want your customer to land on that page and find shoes and socks among them. That will add confusion to the mix and probably put them off.
On your eCommerce website’s homepage, your customer should be able to navigate to:
So, on this aforementioned clothing website, you might find something like:
Every product you sell should be in one umbrella category, then split off into more specific subcategories. When figuring out how to label categories, definitely bear in mind SEO and keyword research, which we will discuss in just a moment.
Key plugins for an eCommerce site include:
Product descriptions might seem like a no-brainer, but you’d be surprised at how many websites opt for a poorly written copy or just neglect it entirely. Try to aim for about 200 words here. Ensure that you adequately describe what you’re selling and try to use keywords, but don’t force them in there if they don’t work. This is helpful for not only your potential customer but SEO rankings, too.
If you have a professional service you want to offer, whether it is a dry-cleaning service, hairstylist, lawyer, doctor, takeout service, you name it, you need to think about what your customer is coming to your website for and what actions you want them to take once they’re there.
Possible categories you’ll need are:
Think about what you want to find when you visit a local takeout website. The main information you’ll want is the menu, information on delivery, pricing, opening hours, etc. If you’re looking to hire a make-up artist for a fancy event you’ve got lined up, first of all, you’ll probably want to see examples of their work, so this should definitely be easily found when they land on the site.
Key plugins you may need for a services site include:
If you’re starting a blog site, here are some key components to consider:
You can’t write a mammoth article about website architecture without touching a little bit on the importance of SEO. While this will be a very basic introduction, you can read more on the subject with our easy small business SEO guide.
Part of deciding what content you need and how to organize this content is to figure out what keywords your target audience use while searching for products similar to what you’re offering. This begins with..
By carrying out keyword research and assessing search data volume, you can determine quite easily what categories, subcategories, and even filters are necessary for your particular site. Be realistic here and only target relevant keywords. Use tools like Google Keyword Planner and SEMrush. These indicators can also be used to judge to determine whether or not a page should be created on its own or folded into another.
Now that you’ve figured out category and sub-category breakdown, your URLs need reflect that. Essentially, it should emulate your site structure’s navigation. There will be more site structure and navigation in a little bit, but here is an example of what a good URL should look like:
When it comes to an effective “About” page, striking a balance is key. You don’t want to overload your user with too much information, but you also want to leave them feeling informed and confident that your small business is the one for them.
By now you’ve hopefully established why you’re doing what you’re doing. If not, turn around and get yourself right back to the brainstorming stage, buddy.
Use this space to explain why you’re doing what you’re doing and how it all began. This can be in the form of short, snappy copy, but you could also try a video or even an infographic for a more visually impressive and memorable impression.
This is a good opportunity to establish your personality, so whether you want it to be more fun or serious, be sure to make it count.
If you already have some happy, returning customers, elevate your About page with a good word from them. You don’t have to have a huge customer base to be good at what you do, and having some ringing endorsements is an effective way to show that.
Even if your team at this stage is just you and your cat, show it! Put a face to your small business and instantly make it more personable and brings a human touch. If you have a small team, include a picture of each person with a short description of who they are and what they do beneath each image.
The next section will specifically discuss what you should include on your contact page (hint: it includes contact details), but it never hurts to sprinkle in how you can be contacted throughout your website so that your visitor is consistently reminded that getting in touch won’t be a hassle.
These contact details should at the very least include:
For many small business websites, the Contact Page is an afterthought, and it shows. After all, what’s all that exciting about contact details? Still, it would be a mistake not to take advantage of it as this is the part of the website that directly connects you and your customer.
Contact with a customer should not be an afterthought
A good rule of thumb for an effective contact page is to keep it simple, but, at the same time, make the most of it.
If you’re scratching your head wondering where to begin, answering “Why” is never a bad idea. Depending on what area your small business specializes in, there could be a multitude of reasons a customer wants to get in touch.
For example, if you are running an eCommerce site, then this could be a query about an order. It might also be a good idea to include a link to a Frequently Asked Questions or Support page that covers common questions from potential customers. Whatever the case may be, you should also include details on when they should expect to hear back from you as an indication of how your relationship is going to work.
While including a bricks-and-mortar address and phone number have always been no-brainers when it comes to contact details, now that you’ve decided to bring your small business online, there are more areas that need covering.
Having several touchpoints where your customer can find you is vital. So, in addition to including your email, you should sign up for social media sites like Facebook, Linkedin, and Twitter, if you haven’t already.
Save your customer the hassle of having to open up their email client or a social media app by including an easy-to-use form on your contact page. It isn’t difficult to do, in fact, WordPress has several handy plugins that will get one up and running in no time at all.
These forms are often customizable, so you include fields like “Name,” “Location”, “Subject,” a file attachment option, etc.; anything that will help your business to quickly understand why your customer is getting in touch and what they can do to help them as swiftly as possible.
A contact page doesn’t have to be all emails and social media handles, think about small ways you can use this space to reiterate your small business’ branding. The key thing again is to keep it simple. This could be something as simple as including customer testimonials, or an image of the CEO or company staff to add a more human element to the page, or even the overall look of the page.
We’ll talk more about the importance of branding and aesthetic toward the end of the article.
A landing page is essentially just what it sounds like – where potential customers “land” when they first find themselves on your website. While this could be the homepage, this generally isn’t the case. A typical homepage typically serves as more of an introduction to the brand as a whole and will have more than one CTA.
A landing page should offer something of value, whether it be answering a question or offering a specific deal. A landing page typically features a single Call-To-Action with a specific goal in mind.
The type of landing page you create will be dependent on what your specific goal is. The most typical landing pages are:
A landing page should offer something of value, whether it be answering a question or offering a specific deal. Since it is a targeted promotion, the objective of the page needs to match that of the ad the user clicked on. As we’re going to iterate time and time again in this article, internet users are impatient. So not only do they want this landing page to be worth their time, they want to see this straight away.
Landing pages generally aren’t found by way of organic search but through clicking on a PPC ad, social media ads, display banners, a marketing email, and more. So you should make sure the headline of the page matches the title of whatever your customer clicked on to land here.
Navigation is the component of your website that helps people find what they’re looking for as (hopefully!) easily as possible. Simple, right? Well… maybe not. Navigation often takes a backseat in the design of a site, because, well, it’s not very exciting, is it? While it’s true that navigation may not instill the kind of thrill that other aspects of web architecture might, the importance of good navigation cannot be stressed enough – if your navigation is clunky or complicated, it is highly likely to disrupt your user’s experience and is bound to cost you customers.
So, how to make sure your navigation works? There is no ultimate tried-and-true way of getting the perfect navigation for your site, but there are certainly a few things you can keep in mind:
Okay, so that’s what you need to do. But how exactly do you do it? One beloved method that can be used for all sorts of things (not just for website architecture!) is card sorting.
Card sorting is when you enlist the help of users (or potential users) to help build the information architecture of your website. In a session of card sorting, you can ask participants to help you with organizing categories and even labeling categories.
Even if you think you’ have decided the best ever layout for your website, it’s still a good idea to try card sorting, because you will inevitably be biased. Think about it: who better to inform you of how best to create the most intuitive and straightforward structure for users than users themselves? What makes sense to you won’t necessarily make sense to your user. And internet users are notoriously impatient; they will very easily find reasons to leave your site given half the chance.
Imagine a scenario where you walked into a department store looking for a shiny new pair of high heels. Common sense dictates that these should be in the women’s shoes section. How annoying would it be if you spent a ludicrous amount of time searching high and low, only to find the store had bafflingly placed them in the Furniture section? You would probably grumble at the store assistant who helped you find them, but you would most likely still peruse what they had to offer.
This generally isn’t the case online. Unlike customers in the physical world, internet users these days have short attention spans, Subjecting them to navigation that doesn’t make sense is a cardinal sin that will cost you customers and conversions.
This is why it is vital that website architecture is based not on the business structure, but on the user’s needs.
So, how exactly do you go about card sorting? There are two methods of card sorting: open card sorting and closed sorting. Whichever you choose is up to you, but is often dependent on how big your website will be.
In open card sorting sessions, the participants have full control over the organization and labeling of categories. They will sort topics and content into groups that they feel make sense and will suggest category names. You can also allow them to create new card topics.
In closed card sorting sessions, categories will have already been determined by you. It is up to the participants to organize topics into these categories.
Offline
Offline card sorting isn’t at all high-tech or complicated. The main thing you need is (you guessed it) cards, as well as a space in which to spread them out, whether it be a large table, or a wall or notice board to pin them on.
Use index cards. Label each one neatly and number the each one at the back to help with later analysis.
Online
There is a plethora of online software for card sorting. The handy thing about them is that you won’t need a physical space to gather participants, and the analysis will be done for you.
The downside is that this software can be a little bit expensive, so if your budget is already stretched, this might not be a viable option. You also won’t be able to take into account the body language and behavior of participants as they card sort.
If you used online software for your sort, this will analyze your results for you. If it was offline, you will need to think about what patterns emerged throughout the process. Look back on the pictures and notes you took and see if there was any particular ordering of the cards that happened time and time again. If you’re excel savvy, inputting your data into a spreadsheet can make things easier for you.
When you’re done, you should have a clear idea of your website’s main categories, their subcategories, and which pages correspond to each of these subcategories.
A sitemap is essentially how your user will get from point A to point B on your site. It’s a visual representation of how the site will be navigated. An effective sitemap will be straightforward, without any unnecessary detours. It will contain all the pages of your site and how your user will get to them. It will begin with your homepage and then branch out to your categories and subpages.
Write a list of the pages your site will be using and create a diagram. This shouldn’t be too difficult if you went through the card sorting process. When you do this, you’ll be able to point out any transitions that don’t make sense as well as gaps.
If you’re starting a takeout service for your pizza restaurant and creating a simple website, your list could look something like this:
As a diagram, it would look something like this:
Of course, if your website is going to be a little more content-heavy, it will more than likely be somewhat more complicated than the above. You could also include URLs and annotations and information on the timeline of pages that you won’t be created straight away.
Ultimately your sitemap will be a planning tool that will help you understand the layout of your site by giving you a clear visual perspective.
The structure of your menu will be the key to easily navigating your site. An effective menu:
Based on your sitemap, your menu should list all of your products and services so that customers can easily find what they need and see what is available. This will include your basic categories, products, and services, but it may also include segments and scenarios.
Segments
Segments are perfect for when a customer isn’t sure about a specific product but knows the segment they are looking to pursue. Examples can include hardware, homeowners, landscapers, construction, and companies. Think about how some specific customers may see their needs and cater to that.
Scenarios
A scenario can be situational or promotional. For example, this could include Valentine’s day promotions or season-specific offers like “Summer Barbecue Kit” or “Christmas Offers!”. Think about how what you’re offering can be molded into a scenario that would suit your user.
Some essential menu best practices are:
You should think about the design of the menu that would work best for your site. Ultimately, what kind of menu you opt for is down to personal preference, but some types do work better for certain kinds of websites.
Smaller websites tend to use horizontal menus while more corporate companies often use both.
A large panel that drops down from global navigation bar that displays many options at once. These are good for eCommerce sites with extensive category lists, or websites advertising a large number of services. These would look cluttered in a standard menu.
This type of menu stays in view even as you scroll through a website. The CTA is often in the primary bar.
At the bottom of a website, this kind of menu is often used for websites that contain more content. It tends to include privacy/email/legal links and contact details. For eCommerce sites, they also tend to include methods of payment.
This is a tried-and-true, common-sense convention that will only confused your users if you don’t do it too.
Your mantra before, during and after building your website should be test, test, then test again, which conveniently takes us to the next section.
User testing is essential. No matter how impartial you think you are, at the end of the day you have been far too immersed in your project from the get-go, so outside critique is the only way to get a true indication of what’s working and what isn’t.
Get in touch with people from your target audience. Prepare a list of questions to ask each person. This will be dependent on what your website is going to offer, but it can be anything from what they look for when shopping online, what puts them off, and more.
Asking a customer to do a survey after completing a transaction on your website is also a good method of gathering data. It may be less personal than a one-on-one interview; however, the transaction will be fresh in their mind, so they’ll be able to effectively discuss what worked and what didn’t, while an interviewee may find it difficult to think of specific examples.
Sometimes the most effective thing is to simply observe your customers as they browse your website, taking note of how easy it is to search or navigate, or purchase if it is an eCommerce site. You can witness firsthand whether or not they have a straightforward experience, or if they have trouble finding what they want, or if they don’t see important CTAs.
A/B testing your small business website involves comparing two different versions of the same webpage, and tests how users respond to both. One is the control and one is a variant, which should mostly be the same, but with one slight change. This can be anything from headlines to color combinations or substituting imagery. You can then collect data based on analytics and conversions that will show how much the change does or doesn’t impact.
When it comes to testing, it’s also important to remember that there is no one-size-fits-all category for how your users will be using your website. It will be important to test not only different versions of your site but also to test them across different devices and even browsers. Your analytics will show how effectively each works across all of these.
Testing is an ongoing process. While it would be convenient to assume that once you’re finished, but people and their habits are continually changing, and what used to work for your site might not work as well several months later. So it’s best that user testing becomes habitual for you, rather than an occasional inconvenience.
In this day and age, mobile optimization should not be an afterthought. With more and more internet users browsing the web using a variety of devices, you need to ensure that your website is accessible beyond the classic desktop. These days, mobile accounts for more web users than desktop and that number is constantly growing.
Still not convinced? Consider this statistic:
According to Experience Dynamics, 52% of users are less likely to engage with a company if they have a bad mobile experience.
Now that I’ve got your attention, let’s talk about the best ways to go about mobile optimization.
If you’re still unsure about things, Google Search Console has a mobile-friendly test that can tell you whether or not your site is mobile-optimized and makes suggestions about what you can do better.
An attractive website is a credible website. It may be shallow, it may not be fair, but that’s how it is. How your website looks is an intrinsic part of the user experience. More than anything, people using the web want to use a site that:
While we’ve mostly been stressing the importance of a sensible layout and intuitive architecture, you also need to think about things like color contrast, graphics, imagery, font, and what the combination of your choice in all these elements says about your brand.
These elements then need to be consistent throughout the site. Using dramatically different fonts or color schemes as you navigate from page to page will be both confusing and ultimately off-putting.
If you already have a bricks-and-mortar business, you probably already have a logo. If you’re just starting out, creating one might seem a little daunting. Think about some well-established businesses you know. With brands like Google, Apple, and Twitter, their logos are simple but memorable.
If you have enough creative chops and a small bit of know-how, resources like Photoshop or Canva may prove to be invaluable for creating the perfect picture. If the thought of doing that breaks you out in a cold sweat, outsource it to a graphic designer for peace of mind.
We so rarely think about the color scheme of websites we visit, but it’s more important than you may think.
According to a 2006 study on the use of color in marketing, for 62-90% of customers, their assessment of a particular product is based on colors alone.
Think about Facebook and other social media sites. The color blue tends to feature heavily. Why is that? According to color psychology, blue tends to instill a feeling of trust and calm. It is a color that is associated with communication, intellect, and dependability. It makes sense that you would want to associate these feelings with something as potentially personal as social media.
Think about the kind of mood and message you’d like to give when your users visit your site. While you should bear in mind that people’s perceptions of color will ultimately be cultural and oftentimes come down to personal preference, here are some popular colors and their general associations:
When it comes to choosing colors, it’s a good idea to pick a dominant brand color, a couple of complimentary accent colors, and a background color. Try to stick with this color palette throughout the site for consistency and clarity.
Generalizing these kinds of things is hard though, and what may work for one site may not work for another. So, as we said before, A/B testing is never a bad idea to really figure out what works for you.
One significant example of one color working more effectively than another is an A/B test conducted by HubSpot, where they experimented with the color of a CTA button on a homepage. The page was cloned — the only difference between the pages being the buttons; one was red, and one was green.
Conversions for the page with the red button outperformed the green button page by 21%.
Again, it all comes back to the mantra: Test, test, then test again!
And there we have it. In this article, we’ve touched on the key aspects of website architecture. Whether you want to design your website architecture yourself or leave it to the professionals will depend on the intended size and scope of your project and how tech-oriented you are.
If you’re a little bit tech-savvy, you can try to do at least some of it yourself. There are also several website builders on the market that will get your site off the ground and online quickly. The drawback of these builders is that there is less scope for customization, but if you’re starting small this could be just what you need.
WordPress is a great option if you aren’t a complete tech whizz. There are a plethora of plugins and widgets that will help make your website’s UX the best it can be. Read more about WordPress here.
If you do want more control over the site’s architecture, consider hiring a professional. While it might seem like an unnecessary expense, if this isn’t your area of expertise, you may end up investing far too much of your time than it’s worth, especially if other areas of your new small business website end up falling by the wayside.
From website layouts to graphics, here’s how to make a site customers will love.
guideRead now
12 minsguideRead now11 minsguideRead now11 minsguideRead now10 minsguideRead now9 minsguideRead now11 minsguideRead now13 mins
guideRead now12 minsguideRead now12 minsguideRead now11 mins
guideRead now10 mins
guideRead now8 mins
Need help? We're always here for you.