Preparing to Build Your Website: Create Your Site Plan

Throughout my years of building websites with clients, I’ve found that the single most helpful step in preparing to build a website is creating a site plan. A lot of people working on their own seem to skip this step, which is a huge mistake. Nothing can speed up the creation of your site more than a well-thought-out site plan.

This is the third of four posts that will prepare you to build your website.

Write it all down

Photo by Jacob Bøtter

In architecture, a site plan is a birds-eye view of how a blank piece of land will be transformed by a new construction project. It is a detailed graphical representation of all the new sidewalks, parking lots, and buildings that will be added to the lot. This plan will be indispensable to the construction crew when they break ground, because it means that they don’t have to make any decisions in the field—everything was already decided during the planning phase.

The same site plan concept works great for websites as well. Figure out and document exactly what you want and then when you are ready to build your site, all the difficult decisions are already behind you. The most basic site plan would be nothing more than a simple outline. Notes, fully written text, images, and more can be added to make it more robust. I usually recommend adding as much information as possible into the document which can result in your site plan ending up as an offline version of what will become your website.

The final document will be invaluable whether you plan on creating the website yourself or if you plan on having someone build the website for you. When you pay someone to make your site, they will often be working on an hourly basis, so having a complete site plan can save you a ton of money and dramatically speed up the project.

There is some flexibility in how you create your site plan, but I’m going to share the steps I follow when working with clients. The process starts by brainstorming all the different pieces of content that you would like to place on your entire website. Then you will identify patterns and groupings identified during the brainstorming. Next, you can convert these clusters into the future pages of your site and create an outline based upon those pages. Finally, you will add more substance to the outline by documenting exactly what should appear on each of the pages of your website.

 

Step 1: Brainstorm ideas

Since you have already identified your audience and message, you should have a decent idea about the high-level scope of your site. During this section you will begin to consider the details—exactly what kind of content your website needs to contain.

post it notes

Photo by Nina Matthews.
Planning a large website can result in a lot of potential content.

Start by looking at the websites of your top competitors and noting what specific pages and types of content they are using. Can you figure out the purpose of each site you visit? Can you see how a visitor is expected to move from one page to another? Do you feel compelled to follow through on the site’s call to action?

Now it is time to brainstorm.

This is best done with a small group of people who are all involved with your website. Start by sharing your notes about your audience, message, and anything you learned when analyzing the other websites. Then begin discussing different ideas about what everyone wants on the website. These can be large or small ideas—throw everything into the pile whether it is easy or difficult to accomplish.

Write out each idea on an index card or post it note and spread them out on the floor or wall so you can see them all at once. We’ll arrange the ideas in the next step.

 

Step 2: Cluster into themes

With all your notes spread out in front of you, start to group the concepts and ideas into different clusters. Once you see a pattern begin to emerge, the clusters can become the pages of your site.

For example, product descriptions, product photos, customer testimonials, and a YouTube video of the product in action can be grouped together to form a product page. Your primary call to action, your latest news, and a simple contact form might be grouped together into the home page of your site.

You may even see that some pages should be grouped together and you can make them subpages of a broader topic. This could be the case if you have several products or services that you offer, or if there are variations of a particular topic, like a photo gallery, map, and written rules for one rental property.

Some ideas might not fit with any others. Are these actually necessary? Do they deserve a standalone page on your website? Set them aside and revisit them during the next step when we make an outline of your website navigation.

 

Step 3: Create an outline of pages

outline example

A simple outline for a small business website.

As your clustered content ideas become pages of your site, it is time to find a method to display this information in an easily-readable format. Personally, I tend to gravitate towards outlines or bulleted lists as I find these formats quick and easy to reference.

When organizing your pages, limit yourself to five to seven primary ones for your site. This is the optimal number that people can easily digest at one time. If you need more pages than that, group some pages together into subpages of your primary ones.

A good rule of thumb is to make sure that your visitors can find anything they might be seeking without having to click more than three links. Each additional click can risk that user abandoning their search and moving on. It is also possible that a visitor will arrive at your website other than your homepage so you will want to make sure that they can still easily find their way around no matter where they begin.

 

Step 4: Flesh out the document

With an outline now in place, continue to add to this site plan by making notes under each page to remind yourself of particular assets or information that you would like to place there. This can be in the form of text, images, links, or even videos.

I recommend jotting down three different versions of the title for each page. The first is the shortest possible label for the page which you can use in the site’s navigational menu that visitors will use to move from one page of your site to another.

Headings are very important to demonstrate hierarchy within a website and every page of your site should start with a h1 tag to let visitors know exactly where they are within your website. This is where you will use the second title that you create.

The third version of the title will be a longer one that should be a bit more descriptive and will be used for improving where your website appears within search engines like Google. The actual title will not appear within the visible area of your website, but will instead be used in the title tag of each page. The title tag is one of the most basic html tags and is what also appears in the tab of your browser when you are on a particular page of a website. It may sound a bit complicated, but most website building systems provide an easy way to enter this text without having to use any code.

At the end of this step, each page of your site outline should look something like this:

IV. The About page:
About (navigation label)
About ACME Products (title appearing on page)
About ACME Products – the leader in gadgets and widgets in the greater Milwaukee, Wisconsin area (descriptive title)

  • Company history
  • Photos of the ownership
  • Company logo
  • Form to contact the owners

Conclusion

The final site plan that emerges from this step will be your roadmap and blueprint for your entire website. Refer to it often as it will make the website creation process much quicker and easier.

With your site plan complete along with your research on your target audience and a clarified purpose and message for your website, you will have nearly everything necessary to hand your project to someone else to build or to start building the site yourself. All the important questions will already be answered which will ultimately result in a project that is completed much more quickly and at potentially much lower cost.

The final step, which I will cover in the last entry of the Preparing To Build Your Website series will focus on gathering your assets and preparing your materials for use on your website.

 

Follow Me

Brent Gummow

Multi-talento at Jimdo
Brent Gummow has been building websites for small businesses, non-profits, artists, and educators for the past 17 years in both Ohio and California.

He currently serves as the Multi-talento in Jimdo's San Francisco office, solving problems, educating users, and helping to grow awareness about Jimdo, the easiest website builder on the web.
Follow Me
New Shipping Cost Options
What You Learn from Analyzing Great Content

10 Comments

  1. Useful information to build a new website.To build a successful website you need to have creative design,good themes and perfect and unique content.

    Reply
    • Hello Sofia!
      Excellent point – I completely agree. I’m focusing on helping people trying to get over their fear of starting with this particular series, but I have strong opinions on what makes a website good too. I’ll be sharing those in the future and would love to hear your input on those posts as well.

      Reply
  2. hi Brent,
    This series has been so helpful to me planning my eCommerce store, my folio site was easy but an online store will be on a new level. I’m an illustrator and graphic designer, but the basic facts you have outlined in this series are so important in the task of building a website. Thank you!!

    Reply
    • Hello Laura!
      Thank you so much for writing. Hearing stories like this really makes my day. Very happy to be making a difference! We’ve still got one more piece in this particular series – check it out next week!

      Reply
    • Hello Rihan. Thank you for ready. There are lots of great options to build your website after you do all the preparation that I outline in this series. Obviously I’m very partial to http://www.jimdo.com. Create a free website and see if it is a good fit for your project.

      Reply
  3. i want to improve my website

    Reply
    • Hello! It looks like you are just getting started. I’d definitely work through the steps in this series and then start building out your pages. Keep an eye on our blog for more helpful info coming out every week too!

      Reply
  4. Hi,
    Your article is very nice. Thanks for sharing.

    Reply
    • Hello Ankit!
      Thank you for reading. Make sure to come back on Thursday to read the final post in the series.

      Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>