The DIYMarketers Tell-It-Like-It-Is Guide:

Complete Guide to Small Business Website Design

Introduction to Small Business Website Design

This is a tell-it-like-it-is guide to creating a website for your business.

In this guide, you’ll get all the insider information demystify the whole website design process and go over a wide range of often-ignored details that no one seems to mention.

Such as:

  • How to design a good website
  • The best layout for a website
  • How much it costs to build a website
  • How much to budget to maintain your website
  • and more details no one ever seems to talk about until it’s too late.

Introduction

Small business website design is a complex topic. That’s why so many small businesses end up hiring a web designer to do it all for them.

Unfortunately, that can backfire.

Professional website design can be extremely expensive.

Just because you spend the money doesn’t automatically mean your new design will be effective.

The truth is, you don’t have to hire a professional website designer if you don’t want to. Predesigned templates are easy for anyone to use, and they are a great way to test your business idea to see what works. They are professionally designed to optimize your site and convert visitors—as long as you follow website design best practices.

Here is the business owner’s no-nonsense guide to all the stuff you need to know about website design that no one tells you.

Contents

Chapter 1:

The Basics

What is Website Design?

Most people think that website design is all about how a website looks. In reality, website design involves the planning, creation, and updating of websites.

Throughout the entire website design process, you should focus on satisfying your audience, Google, and yourself. Consider the problems you’re trying to solve for your target audience. Then create content that Google can easily identify, as well as creating a stunning design you are proud of.

    How to Plan Your Website Design

    Having been through this process several times, I can’t overstress the importance of taking the time to think, plan, and do a little dreaming about the design of your future website.

    You can go ahead and jump into the website design process anytime you want—just give yourself at least six months of space to think, plan, and dream. In that time, you will collect data, information, and develop important opinions and preferences that will drive your website design.

    First, if you have a current website, make sure to do a website audit to create a list of what you currently have and what you want to have on your new site.

    BONUS TIP: You will also want this current list of URLs to create your 301-redirects if the website URLs will be changing. (More on SEO in Chapter 3)

    What is a website audit and how does it work?

    A website audit is a review of what’s working, what’s not working, and what adjustments you need to make on your existing website to improve its performance.

    If you have an existing website, take the time to do a website audit.

    You can keep it simple by asking for advice from customers with whom you have a close relationship and who you know will give you valuable feedback. You can also consider asking a friend or family member to give you their honest opinion of the website.

    I recommend scheduling a face-to-face appointment so you can physically watch your customers go through your site.

    Watch your customers go through your website. Then ask them to talk about what they are looking for, what information would be useful, and what would make it easier for them to choose your product or service over another.

    You can also try one of my favorite tools called 5-second test by Usability Hub. It is an effective way to see what kind of first impression your website makes on visitors.

    How long does it take to design and build a website?

    It takes at least six months to build a “five-minute” website.

    Many website builders say that you can build a website in five minutes. What they mean is you can open an account, throw up a pre-designed template, click the publish button, and call it a day. I think we can all agree that this does not create an effective website.

    If you want to spend the least amount of money and the least amount of time designing a great small business website, you have to do all the work upfront.

    You have to know exactly what you want and why you want it.

    You have to know want your website to say, and exactly how you want it to look. You also have to choose which platform you want to use. With this heavy lifting done, the rest of the process is cheap and easy.

    BONUS TIP: The website does not have to be perfect to launch! It will be an ongoing iterative process over time, and instead of waiting until it’s perfect, you can boost your SEO rankings as you continuously improve the site. Win-win!

    How much does it cost to design a website?

    You’ll need at least a $5,000 slush fund to start, and an on-going budget of about $500 a month to keep your website keep going.

    Do yourself a favor and save at least $5,000 before your website design project even begins. If you have the money, you can start and finish your website in a reasonable amount of time. That could be anywhere from a week or two for a simple site to a month or so for a larger site.

    It will cost more than anyone says it will. And, you don’t want to run out of money.
    Designing a website is like flying a low-cost airline—it looks cheap upfront, but the fees, taxes, and ancillary charges soon add up. Don’t start without at least $5,000. Just don’t!

     Start the process of saving money, researching what you like and don’t like, and what you want and don’t want on your website right now. This takes more time than you think, giving you plenty of time to save up.

    Chapter 2:

    How to Plan Your Website Design

    If your website were a person, what “job” would you want it to do?

    First start with a potential reason someone might come to your website.

    Then dig further and ask yourself “WHY?”

      Let’s use our landscaping example:

      Reasons a customer would come to my landscaping website:

      They want landscaping.

      Why?

      1. Because they moved into a newly constructed house that has no landscaping
      2. Because they moved into a previously owned house and want new landscaping
      3. Because they need to replace overgrown landscaping

      Here’s a little “Jobs to be done” formula you can use:

      • When my customer is shopping for [Insert your product or service here]
      • My customer wants [insert what the customer wants]
      • So they can [insert an expected outcome]

      When you think about it that way, the purpose of your website will become much clearer and it will be much easier to organize your website to do exactly what you want it to do.

      Chapter 3:

      How to Get Found Online

      It’s never too early to start thinking about SEO (search engine optimization) and what keywords you would like to be found for.

      Here are some tips to help you choose your keywords:

        Put yourself in your ideal customer’s shoes.

        Think about what problems they might have that your business solves. Now brainstorm what they might search to solve that problem. Ask yourself “If I wanted to find the product or service I’m selling or want to be known for, what might I type into Google?”

        For example, “car repair” or “puppy training” or “cupcake bakery”

        Do these searches and see who your competition is

        Open up a spreadsheet and start typing in phrases and look to see who your competition is for each of those phrases that you brainstormed.

        Look to see which of your competitors (if any) appear in the search. Pay special attention to private businesses that rank compared to directories such as Angie’s List and Home Advisor.

        Clicking On the top ranking site — you can easily spot some good points and areas where you can do better compared to the “appliance repair” competition.

        One good thing this appliance repair website did is give me a phone number front and center.

        An area of improvement would have been to make those three boxes clickable resources. For example, a troubleshooting checklist or a buyers guide or a link to simple how-to repair videos. All would be valuable resources to someone looking to fix an appliance.

        Another valuable piece of missing information here are testimonials. It would be great to see what my friends and neighbors had to say about these people.

        Identify and choose longer, more specific keyword phrases

        The next step would be to identify longer, more specific keyword phrases. Those are called long-tail keywords.

        So if your simple keyword phrase is “appliance repair” a more specific long-tail phrase might be “appliance repair Medina, OH” and more specific still might be “Whirlpool washer repair Medina, OH”

        In this example, you can see that a little attention to some low hanging fruit can generate more customers.

        After you’ve done your keyword research, you want to utilize these keywords on your website pages.

        Please note, you want to have ONE primary keyword per page and some secondary keywords that are similar in topic.

        Yes, you’ll have potentially hundreds of keywords that end up ranking for those pages but you don’t want 10 pages on your site that focus on the same thing. This confuses Google and it may pick the worst page of them all or not even pick one because there are too many choices.

        Add those keywords to your URL, site navigation, title tags, meta descriptions, headlines, body content, and image alt tags in a conversational way. DO NO STUFF KEYWORDS into your pages.

        Chapter 4:

        How to Organize Your Website

        Website architecture is the overall organization of your site. It looks something like this example of a restaurant website:

        Think of website architecture like the rooms of your house. These rooms are clearly defined as a living room, dining room, bedroom, bathroom, etc. Every space has a clear function. Here’s an example:

        You wouldn’t want to go to the bathroom to have dinner! It is also the case that website visitors don’t want to visit the pages that aren’t relevant to their query.

        A website’s menu or navigation bar is where you’ll find the most basic architecture of a website.

        Website navigation screenshot from DIY Marketers.

        It seems simple, and for your business, it might be. But, getting the right architecture for your site can also be surprisingly confusing.

        Internet strategy consultant and website design expert, Deborah Norton, explains that the best way to set up your site architecture is to start with the products and services that are most important to your business. Organize them in an outline. Other pages and information can be added later.

        In other words, how you organize your website is another way to stand out from the competition. A simple search for “landscaping” in my town yielded several different companies. How they organized their site, tells me what they want to sell:

        This company is focused on “hard scapes” – meaning outdoor patios, retaining walls, etc.

        Meanwhile, this company is more focused on the yard itself and everything it takes to maintain it.

        And this last landscaping company is interested in building barns and sheds.

        The organization (or website architecture) of each site will determine which landscaper I see depending on what I search for.

        If I search for “landscape design patio” I’ll get the company that specializes in hardscapes. If I search for “landscape maintenance” I get the company that specializes in maintaining landscapes.

        If I search for “landscape design patio” I’ll get the company that specializes in hardscapes. If I search for “landscape maintenance” I get the company that specializes in maintaining landscapes.

        As you start to develop your website organization, start with the top categories of your business that you want to be known for. Then break down each category into the basic elements in that sub-category.

        Personally, I prefer to start with a simple outline in a document and customize from there.

        Sample Website Outline for product business

        • Home Page
        • Products List (products you want to be found for)
          • Product Categories
          • Products
          • Checkout pages (for online product sales)
        • Pricing (use pricing tables or specific prices)
        • Services
          • Shipping
          • Installation
          • Consulting
        • About Us
        • Testimonials
        • Contact
        • Terms of service and privacy policy

        Sample Website Outline for Service Services

        • Home Page
        • About Us
          • Expertise
        • Services
          • Consulting
          • Consulting
          • Consulting
        • Testimonials
        • Contact

        Here is a visual site map you can create using the free LucidChart tool.

        With these details ironed out, you are ready to move on to the implementation step.

        BONUS TIP: Remember, to use your keywords as your top level site navigation terms when you can!

        Branding and Voice

        After you’ve had a chance to thoroughly think through and complete the organization process, you have to start thinking about your branding and voice. Do you want to be friendly or serious? What colors do you want to use? How will you serve your customers?

        If you were working with a website designer, one of the first things they would do is ask for examples of what you like and don’t like. Give yourself plenty of time to search for these examples on the web. It is hard to find examples on-demand. It’s much easier to start a few months ahead of time and bookmark websites that spark your interest.

        Keep a list of sites you like and what you like about them. You can also collect sites and examples of things you dislike and why. A great tool for this is Evernote. Start a folder and catalogue images, screen captures, and notes as you come across websites of interest.

        When you visit sites, be your customer. Keep a list of the things that make a site easy to navigate, and how quick and easy it is to find what you’re looking for.

        When this process is done, you’ll have:

        • Layouts that you think will work best for your online business goals.
        • Color palette ideas.
        • A strong preference for whether you want illustrations or photos. Choose one or the other, but never both together.
        • Fonts for headlines and body text. Use Google Fonts so that everyone sees your text exactly the way you intend.

        Look and Feel

        When you’re designing a website, you actually have two customers; your potential customer and Google.

        Because your customers will probably search Google to find you, it’s important for your website design to look, feel and show them exactly what they are looking for. This is called “user intent”.

        If your customers are looking for an outdoor patio and search on outdoor patio, the website they find MUST show pictures of outdoor patios.

        Chapter 5:

        How to Implement Your Website Design

        With all the research and planning done, it’s time to put all of your work online. These are all the things you need to put in place to get your website design online.

        Choose a Domain Name

        Your domain name is the URL that people will type in to go directly to your website. It is also called a Top Level Domain or TLD. For example MyCompany.com is a domain name or a TLD.

         If you’ve been using the same domain name for years, then you should probably keep it. But if you are starting a new website or creating a microsite for a specific product or service, then make sure that you follow these important tips for choosing a domain name.

        Choosing a domain name is one of the most important decisions you will make. It’s the first impression someone gets of your company and your website. It’s one of the first things that will define and build your brand both online and offline.

        Young business partners sharing ideas and planning work at meeting in office

         Stick with a “.com “ extension

        These days there are thousands of “top level domain” extensions to choose from in addition to the common “.com” and “.net” for commercial names and “.org” for non-profits.

        Some of the most popular are:

        • .info
        • .name
        • .ly
        • .biz

        Do yourself a favor and avoid all of these extensions and focus on “.com”.

        Why? The answer is simple.

        When people type in a domain, they default to “.com” and if you’re using another domain, you are losing potential customers.

        You are better off brainstorming domain names and phrases with a simple “.com” at the end.

        Avoid hyphens and numbers

        You should also avoid hyphens and numbers in your domain name for the same reasons as you should stick with a “.com” top level domain.

        You want your domain name to be easy to type and adding hyphens and numbers confuses people and is difficult to spell and type – especially on a mobile device.

        Make them easy to spell and easy to pronounce

        While it’s become popular to use funny spellings of common words as domain names, it’s confusing to your audience.

        Unless your company or product name is widely known by its unusual spelling, you are likely to lose valuable traffic with an odd spelling for a domain name.

        Try this.

        Write your domain name on a piece of paper and ask a handful of people to pronounce it. You can do a twist on this and tell people your domain name and then ask them to write or spell it for you.

        I thought my domain was super easy DIYMarketers.com. I found out that I have to carefully spell my domain to people because the “D” can sound like a “B”.

        Choose a descriptive name

        Even though using keywords as domain names isn’t as important to search engines as it used to be — it certainly doesn’t hurt.

        Descriptive domain names are easy for potential customers to remember and if your content is well matched to the topic, then they will help more customers find you online.

        Don’t make them too long

        The ideal length for a domain name is about 12 characters. When you come up with your domain name, aim for 6-14 characters. The shorter the better.

        Think about the future of your business

        If you’re starting your website with a specific market niche in mind, it may be tempting to get a domain name just for that niche. For example, PopUpTents.com. But as your business grows, you may expand to other camping related products or topics. So consider creating a domain name that is one or two levels up from where you are today.

        Choose a Web Host

        Choosing a web host means choosing where you want your website to “live.” There are hundreds of hosted website platforms, but I’m going to share the most popular ones here.

        There are several options of where and how to host your small business website:

        Hosted website platforms

        Think of hosted websites as “apartments” for your website. These platforms are the owners and the landlord, and your website is a tenant.

        Just like any apartment, it’s convenient and the owner handles all of the particulars. However, you are extremely limited by what you can change and customize.

        These are the most popular “hosted website” platforms:

        • Wix
        • SquareSpace
        • Weebly
        • GoDaddy

        The advantages of using these hosted website platforms are:

        • Free options (great for setting up, but you want a paid plan when you go live)
        • Professionally pre-designed and optimized templates:
        • Little to no technical or coding skills required
        • Speed and security
        • All in one solution

        The disadvantages of using hosted website platforms are:

        • Not much customization
        • Not good for larger websites
        • Your brand doesn’t get the SEO juice you would get as a self-hosted website.

        Who should use hosted websites:

        Any small business where online marketing or content marketing is NOT a critical part of your strategy. For example. restaurants, hair salons, artists, photographers.

        Web hosting for self-hosted websites

        A step above hosted websites is having your website live on a web host. This would be the same as buying a condo. You share a space in a building but you have a lot more control over what happens inside of the unit that you own.

        These are the most popular small business website hosting services:

        • GoDaddy : You can do the basics of digital marketing. Everything from building a website, to email. Just the basics, but it’s all in one place.
        • WPEngine: I love the automatic WordPress and WordPress plugin updating, the CDN to speed up your website and the staging areas.
        • HostGator: Simple, affordable basic hosting for your business website.

        Some of the criteria you should look for in a website hosting provider:

        • Affordable
        • Great 24/7 customer support
        • Managed WordPress Hosting
        • CDN – Content delivery network to make your site as fast as possible
        • Security and automatic updating of your WordPress installation and plugins.

        Choose a Website Template

        When you get to the point of choosing a website template, it’s important to choose a design that is current AND that will continue look current for about three years.

        Here are the criteria to keep in mind as you choose your next website template:

        Think Fast

        The speed with which a website loads (meaning how long it takes for you to see the website after you click on a link) is probably the most important element of your website design.

        Google rewards speed — and so do your customers.

        A slow-loading website is not only costing you customers, but is putting your business at the top of the search engine results.

        47 percent of consumers expect a web page to load in two seconds or less. 40 percent of consumers will wait no more than three seconds for a web page to render before abandoning the site. 52 percent of online shoppers stated that quick page loading is important to their site loyalty. (Neil Patel)

        The website design tips below are all chosen with speed in mind.

        There is really only one simple rule — Keep it Simple.

        Look for a Simple Website Design

        Just because the technology is there – doesn’t mean you should do it. If it moves or bounces around the screen – it’s probably not a great idea for the long-term.

        Choose a design that matches your business model of how you make money – know where how, where and why you make money and then make sure that your website supports that.

        If you make money via advertising or affiliate marketing – your site should feature that content prominently- maybe as a magazine theme.

        If your business sells products, make sure that your product images are GORGEOUS and irresistible. Don’t forget to write keyword rich “alt” descriptions for SEO. And make sure that you feature your most profitable products prominently.

        If you are a thought leader, make sure that your content is featured and organized properly.

        Look for a website design has the following:

        Clear navigation at the top where you can display your key categories of products and services

        Top header space for a large image that also allows you to add keyword rich descriptive text.

        The ability to add boxes underneath for categories or content that you want to feature such as buyers guides.

        I can’t stress enough how critically important it is for your website design to be crisp, clean and easy to navigate.

        Your website is the most efficient and potentially highest revenue generating sales resource that you have.

        Have Access to a Website Designer and Developer

        If you’re choosing a “professionally designed website template” why would you need a website designer and a website developer?

        Simple. Because you are probably not a designer.

        The website templates that you see aren’t exactly what you get.

        Think of the professionally designed themes and templates the way you would pictures of a gourmet dinner. The picture in the book is gorgeous, but when you make it yourself, it never seems to look like the picture.

        Here is the demo of Divi’s Extra Theme

        And here is DIYMarketers application of Divi’s Extra Theme

        That’s because a designer designed the demo. Not only that, but all website templates use some type of custom coding in the demos and then when you try to create the same thing, you can’t. That’s what developers are for.

        So, it’s a good idea to find BOTH a web designer and a web developer. People might tell you that they do both, but they rarely do.

        The difference between a web designer and a web developer

        Web designers are artists and will help you with choosing images and fonts that create a consistent brand across your website.

        Web developers get “under the hood” of your website. They typically can code and create certain custom features that you might want.

        Go to 99designs to get great and affordable website designs. No, it’s not as cheap as the kid down the street, but it’s less expensive than an agency and the talent pool is outstanding.

        Go to Lorem to get access to on-demand web-development help.

        Tap into freelance Web developers with Ask Lorem for any size web project.

        Final thoughts on web designers and developers

        I’ve used freelancer sites for finding designers and developers and have had mixed results. If you’re investing your hard-earned money for web design and web development, you want to make sure that you’re going with a company that gives you some level of a quality guarantee. Both 99designs and Lorem offer that.

        Chapter 6:

        How to Maintain Your Website

        If you want your website to continue feeding your new customers, you’ll have to feed it. That means having a budget set aside for all sorts of maintenance.

        Here are my recommendations on where to invest your time and money when it comes to website maintenance.

          What’s included in website maintenance?

          Typically website maintenance includes:

          • Make sure you have the latest version of WordPress
          • Update all plugins
          • Backup your website regularly (weekly or monthly depending on how often it changes)
          • Optimized for mobile
          • Optimized for SEO
          • Compress images
          • Check the speed of your website
          • Check for dead links
          • Check for toxic backlinks (Use a tool like SEMRush to make sure that you don’t have spammy backlinks to your website)

          Web Design | planning session

          How much to budget for website maintenance?

          Plan on an average of $500 per month.

          Now, this is more than most small business owners spend on marketing. Think of your website as a 24/7 sales person feeding you new customers. So, it’s worth it.

          You might spend less, depending on your business, but this number includes all of the nickle and dime items that come up over time.
          It’s a good idea to have this in your website budget. Here’s how it breaks down.

          $250 per month will go to hosting, security, general updating and maintenance.

          If you’re hosting your website with a web host, they will offer some level of security, updating and maintenance. Some will charge extra, some will recommend a service. BUT I still recommend that you use a security tool like Sucuri to make sure your site doesn’t get hacked.

          Understand, stuff WILL happen, your website WILL go down and it will happen at the worst possible time. You want to make sure that your hosting company is available and that you have access to a web developer (like Lorem) to help with technical troubleshooting.

          $100-$200 per month for SEO (Search Engine Optimization)

          SEO is what feeds traffic to your website. There is constant updating of content, making sure that you are listed in appropriate directories such as Google My Business.

          $200 – $500 per month for SEO optimized content development

          80% of your website visitors will come from organic search. This means that someone will search on a question and you want your company or an article to come up at the top of the search engines.

          Even if you write your own content, there’s a lot that happens behind the scenes to make sure that your time and effort isn’t wasted. This is what content SEO is all about.

          There are SEO content experts who will review your content, make sure that it’s optimized for the correct keyword and everything is in place to get the most traffic that you can.

          Conclusion

          I hope you enjoyed this guide to website design.

          Now I’d like to hear from you.

          What are your questions and concerns about designing your website?

          If you’ve already been through the process of designing your website, what have you learned from your experience that you’d like to share with others?