Part 2: Creating Your Own Architecture, Content, And Design Document

Posted in Tips, Web Design • Posted on 4 Comments

In Part 1 of the ‘Website Planning’ series we discussed the importance of creating a website blueprint and the 5 keys to developing a successful website. Before undertaking the website build individuals and/or businesses should set clear goals for their website, identify the target audience with whom they want to communicate, set a call-to-action to ensure website visitors take the action you want them to, think through site navigation to ensure visitors know where to go and how to get there, and establish a list of keywords to help with SEO. By following these 5 steps you will have all that you need for developing your own website blueprint.

What Is a Website Blueprint?

A website blueprint is similar to a blueprint for a house, it’s a set of plans that allows the builder to easily construct the website while limiting the unforeseen obstacles that could arise if one doesn’t think through the website build prior to getting started. Your website blueprint should contain:

  • as much information about your website as possible
  • plans for every page within your website. From the Contact us page to your major information pages, all should be flushed out in detail so that the builder can simply plug-in the information during the build.

What Are the Main Components of a Website Blueprint?

Blueprint

Photo by stocking

Developing a proper website blueprint definitely takes time. With that said, it’s going to save your website builders much more time during the build because they’ll have plans to work off of and not just notes or email messages from you/the client. All websites contain three critical pieces. Each piece works together with the other two pieces in order to create a seamless web experience for the reader. The three main pieces that must be worked through for every page within your website are:

  • Architecture
  • Content
  • Design

Each web page within your website needs these 3 elements in order for it to function properly. I liken the Architecture , Content, and Design of web pages to the human body.

  • The Architecture of a web page/website is similar to the bone structure in the body. It forms the overall shape of the website.
  • The Content of the website is like the internal organs. The “heart” of the site so to speak ;).
  • The Design of the website is similar to the skin of the body. It’s the outward appearance that the website displays to others.

If a person is missing any of these elements or if any of these elements are not functioning properly the entire body/person is affected. The same is true for a website. If the architecture is broken then the Content and Design suffer and vice versa.

Now that we understand the three main elements that must be flushed out within every web page within your website in order to create a strong website blueprint, let’s go ahead and break each of these elements down and explain how they fit into the whole of the website blueprint.

Website Architecture

As stated above, website architecture is similar to the skeleton of the human body. It’s the layout of your website. Not to be confused with the design of your site, which we will get into later in this article, the architecture is how the website and each individual page is laid out. Some of the main architecture elements of your web pages are:

  • Main Navigation Buttons – Are these located along the top of the site? Is there a left navigation system? Perhaps you want to have a drop-down list from some of the main navigation buttons.
  • Main Content Area – Where will the main content area be? Is it centered within the page? Does it encompass the entire page?
  • Right/Left Sidebars – Will you have a right and/or left sidebar within the web page? Will there be plugins or navigation buttons within the sidebars?
  • Image Slider – Some websites now have image sliders somewhere within the page. Will your site have a slider? Where will it be positioned?
  • Footer – The footer is an important part of a website, but one that is often overlooked. Will you include navigation buttons in your footer? How will it be positioned and displayed?

By thinking through these architectural elements within your site prior to the construction of the site you will save a lot of time during development. It’s also a good idea to keep these architectural elements the same for all pages of your site. Obviously there could be a few pages where these elements may differ, such as if you have a blog on your site, or an e-commerce store, etc. For the most part though, as you work through each page of your website within your website blueprint, these architectural elements will be fairly consistent.

Website Content

Developing your website content is one of the most important pieces to creating a successful website. Successful content must:

  • tell your story in a way that’s both educational and engaging
  • be optimized for search engines
  • written in such a way that naturally leads your reader through your website
  • structured in a way that allows your readers to understand whatever information you are trying to convey
  • leads readers to your call-to-action
  • encourages readers to click deeper and deeper into your site

Include Keywords in Your Website Content

Back in part 1 of this website planning series we discussed the importance of developing a list of keywords that would help your website rank highly on search engines and attract quality website visitors. The content within your web pages is where those keywords should be inserted. When optimizing your content, be sure to:

  • sprinkle your keywords throughout your web pages
  • not to “stuff” your pages with keywords whereby your content no longer makes sense
  • link the proper keywords when driving your readers to other pages within your site. Instead of linking the words “click here” for more information on website design. Link the words “website design tips”.

By taking time to write your content now, during the website planning phase, you can make all of the necessary changes before the site actually goes live. Remember that the content of your site is like the organs within your body. It’s what keeps the site functioning over time. Be sure to take as much time as you need to perfect the content within the pages of your website.

Website Design

It used to be that people didn’t take much time or put much effort into the design of their website. However, over the years people have begun to realize just how important design really is to creating a successful website. Just like your outward appearance is the first thing most people notice about others, the design of your site is what catches the reader’s attention first.

Some important design factors to keep in mind are:

  • Design the site within the theme of what you’re try convey to your audience. If you’re writing about plants or flowers you probably don’t want pictures of cars on your site.
  • Identify the main design elements within each page of your website

Here are some of the other design elements that you should think through for each page of your website:

  • Navigation Button Colors – Should a button change color while in a depressed state in order to help the reader identify which page he/she is currently on?
  • Site Logo – Where will the site logo be positioned within the site?
  • Content Images – Within the content of your pages images should be used as visual supports for the information being discussed. Determine what images can be used within the content of each page.
  • Site Colors – What colors make the most sense for your website? Choose background colors and font colors that appeal to your target audience and support the theme of your site.

Design is a critical component to the success or failure of a website. It’s important to go through each web page and determine what design elements make the most sense for that specific page. All design elements should reflect the overall theme of your website in order to give the appearance of a cohesive website. Remember, design is the first thing readers notice. Be sure to choose a design that encourages visitors to dig deeper.

Creating Your Own Architecture, Content, and Design Document

Create your own website blueprintTaking time to create your own Architecture, Content, and Design document will be the best investment you decide to make for your website. This document will act as your guide when building your website. Be sure you list all of the pages within your site, go through each page and fill in the architecture, content, and design elements. By thinking through each of these three key elements for each page you will ensure that you create a website that’s educational, easily navigated, and one that attracts visitors to complete your calls-to-action.

The next installment of the ‘Website Planning’ series will discuss the benefits of creating your own website blueprint and explain why it’s worthwhile to spend the time doing so.

24 Written ArticlesWebsite

Ryan Taft is a twenty-something entrepreneur with a passion for helping small businesses use online marketing tools to reach more customers and prospects, build relationships with those folks, and ultimately grow sales.

4 Comments
  • Andrew Groat

    Wednesday, October 26th, 2011 01:54

    1

    I think this is the problem that most modern web developers face these days. There is an abundance of learning material, new web technologies and cookie cutter solutions that help to make our professional lives easier. However, because of this, the fundamentals, principles and structured workflow has been cast to the wayside.

    0
  • Morgan

    Wednesday, October 26th, 2011 19:20

    2

    Great tips to the pre-development part of building a website! Thanks for sharing. Looking forward to Part 3!

    0
  • Brandon

    Friday, October 28th, 2011 11:54

    3

    Great post.
    Can you please provide in next part about web architecture for multi platforms, because nowadays people prefer the type of website that can be accessed from anywhere at anytime.

    0
  • Christina Cruz

    Monday, March 26th, 2012 20:16

    4

    Another great post. Thank you for all the great information. I really appreciate it.

    0
  • Christina Cruz

    Monday, March 26th, 2012 20:16

    4

    Another great post. Thank you for all the great information. I really appreciate it.

    0
  • Brandon

    Friday, October 28th, 2011 11:54

    3

    Great post.
    Can you please provide in next part about web architecture for multi platforms, because nowadays people prefer the type of website that can be accessed from anywhere at anytime.

    0
  • Morgan

    Wednesday, October 26th, 2011 19:20

    2

    Great tips to the pre-development part of building a website! Thanks for sharing. Looking forward to Part 3!

    0
  • Andrew Groat

    Wednesday, October 26th, 2011 01:54

    1

    I think this is the problem that most modern web developers face these days. There is an abundance of learning material, new web technologies and cookie cutter solutions that help to make our professional lives easier. However, because of this, the fundamentals, principles and structured workflow has been cast to the wayside.

    0

Comments are closed.

54.167.182.201 - unknown - unknown - US