26
A WEBSITE BLUEPRINT HOW TO CREATE IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE) BUILD www.sol8.com

How to Create a Website Blueprint

  • View
    268

  • Download
    5

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: How to Create a Website Blueprint

1 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

A WEBSITE BLUEPRINT

HOW TO CREATE

IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE) BUILD

www.sol8.com

Page 2: How to Create a Website Blueprint

2 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

How to create a website

blueprint in order to manage a

successful website (re)build

BY KASIM ASLAM

Kasim Aslam the Digital Ninja knows how to put “awesome sauce” on everything he touches.

The brains and technical knowledge behind Solutions 8, Kasim is proud to co-own the fastest

growing digital media company in Arizona. Even as a kid, Kasim knew he wanted to be an

entrepreneur and own his own business one day, having watched his father run multiple

businesses of his own. He grew up playing center and power forward in high school for the

basketball team and his goal in the next 5 years is to be retired, hopefully. Kasim loves his

chosen field because it is always an adventure, no day is the same, and because the

technological landscape is always changing. He can connect and proficiently explain even very

difficult, technical procedures to anyone and this makes him an amazing person to have on any

team. Kasim’s advice to other entrepreneurs is: "Spend less time worrying and more time doing

- a great plan is worthless without execution".

Kasim and his wife, who is currently Miss Arab USA 2012, love to travel and two of the places

they have enjoyed are Egypt and Honduras. When he isn’t working, which rarely happens,

Kasim enjoys writing and acting in local films. He and his wife met on the set of a GoDaddy

commercial and Kasim has also shared a screen with Sarah Chuck, David Della Rocco (Boondock

Saints) and Sayed Badreya (a popular Egyptian filmmaker and actor). Kasim is inspired mostly by

the strong men in his family and by his wife Suzanne. If Kasim was an animal he would be a

Chimpanzee. Digital Media and strategy planning is a wild jungle, but Kasim maneuvers and

swings through it all with ease.

@kasimaslam

Page 3: How to Create a Website Blueprint

3 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Table of Contents

Introduction ............................................................................................ 4

Your Website: A Fifty Thousand Foot View ............................................. 6

Your Website: The Open Source Content Management System ........... 14

Your Website: Best Practices for a successful Build .............................. 19

Page 4: How to Create a Website Blueprint

4 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Introduction

INTRODUCTION

Page 5: How to Create a Website Blueprint

5 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

“Your website is the foundation of

your digital strategy”

Your website should be the epicenter of everything your

organization does online. Where your Digital presence is a

solar system your website is the Sun. When building a new

website (whether this is your first step in the digital world or

you’re a seasoned business rebuilding your site) it’s important

to heed the carpenter’s motto: “Measure twice, cut once.”

Having a well thought out “blue print” for your web

application will save you countless hours of time, innumerable amounts of money and a stress level that

could make a bomb defusing expert weep like a spice girl at a “where are they now?” convention.

If you have already found the right vendor to build your site (or are building it in-house) then providing

your team with a well-defined blue print will set them up for success.

If you’re still looking for the perfect development team, knowing exactly what you want will put you in a

position of being able to adequately vet potential vendors and ensure quite a few essentials including:

You and the development team are on the same page in terms of scope

Your specific needs are clearly outlined ensuring the development team has an opportunity to

speak to them directly

Every bid you receive is based upon the same criteria so that you are comparing “apples to

apples”

Your website blueprint will ensure that your needs are clearly outlined; continue to refer back to it

throughout the process in order to maintain the level of consistency required for the development of

such an important component of your business. When managing a web development process having a

blueprint is absolutely essential to your success.

Let us begin.

Page 6: How to Create a Website Blueprint

6 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Your Website: A Fifty Thousand Foot View

YOUR WEBSITE A FIFTY THOUSAND FOOT VIEW

Page 7: How to Create a Website Blueprint

7 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

“General theory of an effective website and its uses”

IIff yyoouu wwoouulldd pprreeffeerr ttoo ggeett ddoowwnn ttoo bbrraassss ttaacckkss pplleeaassee sskkiipp ttoo tthhee nneexxtt sseeccttiioonn::

““YYoouurr WWeebbssiittee:: TThhee OOppeenn SSoouurrccee CCoonntteenntt MMaannaaggeemmeenntt SSyysstteemm..””

While there are many reasons to have a strong presence on a multitude of online properties, the only

digital tool that you have complete and total control over is your own website; your ability to engage

and convert users is exponentially more potent when they’re on your home court. Where online profiles

like Facebook, LinkedIn and Twitter (in order to protect the integrity of their community’s aggregate

experience) have very specific guidelines and functions, your website can and should be custom tailored

to engage your users on your terms allowing you to capitalize on your viewership and ensure the highest

possible conversion rate.

For this reason it's crucial to make sure that, regardless of how active you are online, ultimately all roads

lead back to your website. Secondary properties like those mentioned above are extremely important

but they are still secondary and should be run with the aim of driving all possible and relevant traffic

back to your website if and when appropriate.

To this end your website needs to accomplish the following overarching goals:

o Attract

o Engage

o Convert

o Nurture

Page 8: How to Create a Website Blueprint

8 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

1. ATTRACT

I’m assuming you’ve heard the term SEO (search engine

optimization) - this is a process geared toward making your

website the most “relevant” result for a specific key phrase (or

phrases) in the eyes of major search engines (i.e. – the almighty

Google). We’ll dive more deeply into the intricacies of SEO in

later chapters. It’s important to touch upon here because

before we can begin this all important and exceptionally tedious process, you have to ensure

that your website is actually optimizable. This means your site must be well built with clean,

transparent code, quick to load and best practice compliant.

2. ENGAGE

You have seven seconds. Statistically a user will decide whether

or not to stay on your website within seven seconds. While this

is yet another great reason to optimize your site’s load speed

(something we discuss in greater detail in the on-site

optimization punch list) what it really means is you need to build

your website with immediate engagement in mind. Your website needs to clearly and succinctly

deliver your target message in a way that allows users to immediately qualify your web

application as pertinent to their search.

This means ensuring that your highest value information is delivered above the fold (meaning

they don’t have to scroll down to see it), is easily identifiable and displayed in ways that help

capture your user’s attention and illustrate your main points. Images, videos, bullet points and

infographics are extremely valuable tools to this end and should be built with the idea that they

must capture a user’s attention before earning the right to educate the user any further than

the initial seven seconds.

A mistake many digital marketers continue to make is focusing primarily (and often solely) on

the homepage of their site while leaving internal pages sparse and void of engagement.

Remember that the great and mighty Google has made it its mission to get its users to the end

Page 9: How to Create a Website Blueprint

9 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

result as fast as possible meaning that, very often, they’ll be linked to an internal page or blog

post on your site and bypass the homepage entirely. Every page on your website (and especially

your blog) needs to be built with targeted engagement in mind.

3. CONVERT

User conversion is absolutely key to an effective digital

marketing strategy. Conversion and engagement go hand in

hand; if a user is engaged the logical next step is conversion.

Your website is not a static, informational brochure meant to

host information online for your users to browse at their leisure.

Your site should be built with the intention of converting users

into active and ongoing members of your own personal digital

community. But what does it mean to “convert” a user?

Conversion refers to any action taken by the user that assists in your ability to engage them

further.

Examples include:

Subscribing to your blog or RSS feed

Submitting their email in order to receive updates and newsletters

Commenting on your articles or engaging in further discussion on hosted forums

Filling out a conversion form

Emailing, calling or otherwise contacting your organization for additional

information

Liking, friending, +1ing, following any number of your social media properties

Bookmarking your site

Downloading / accessing internal sources of media and information

Page 10: How to Create a Website Blueprint

10 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Converting users is the first step in “filling your funnel” and beginning the sales cycle required to

turn users into prospects and prospects into customers. There are three layers to your sales

funnel (top, middle and bottom) and all three should be serviced through consistent conversion

points throughout your website. An important thing to remember is that your conversion points

should be specific to the area of the website within which they are housed. If you have a

products/services page make sure to have conversion points geared toward further defining

your products or services. Conversely, your portfolio or client pages may house conversion

points such as case studies or testimonials better suited to the section’s topic.

TOP OF THE FUNNEL

A “top of the funnel” conversion point is typically a very

broad and (dare I say) general offering that helps convert

users who are in the beginning stages of their due

diligence process. More often than not these top of the

funnel offerings are geared toward education and

clarification. It can be something as simple as a high value

blog or article and as intricate as an eBook or whitepaper meant to explain one of your key

topics or core competencies. It's critical that any content you provide as a conversion point is

high value enough to your target user to trade their email address for. Please consider this your

new gold standard: “Is my [insert content type] valuable enough for a user to be willing to give

me their email address for?” If the answer is no, then you’re not giving enough - you have to

give to get in the realm of inbound marketing.

Some examples of good “top of the funnel” offerings:

eBooks and whitepapers that explain the products / services from an objective

standpoint and educate users on the values and uses of their employment

Explanatory / educational video highlighting key points about your industry and

product or service

An infographic explaining the way a product or service works and the value it

provides

Page 11: How to Create a Website Blueprint

11 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Remember to stay far away from a sales pitch when creating content meant to convert. Try to

provide your users with information as though you were an independent and objective

consultant giving advice on the industry. This approach is the most effective at building trust and

establishing credibility as a thought leader.

MIDDLE OF THE FUNNEL

Where a top of the funnel offer is meant to incite interest

and/or educate a user, a “middle of the funnel” offering

is geared towards assisting users who have moved

further along the sales cycle in making specific decisions.

These offers are more focused and need to be geared

toward advancing the user toward the bottom of your sales funnel.

Some examples of good “middle of the funnel” offerings:

A budget calculator that allows the user to determine the costs associated with the

types of products/services you offer (these can be constructed in Microsoft excel

with simple algorithms for automated calculations)

eBooks / whitepapers meant to assist users in specific use and deployment of the

tools and technologies relevant to your industry (I would consider this eBook a

“middle of the funnel” offering)

Videos that detail the specific differences between certain levels of offerings and

which level is most appropriate for each user based upon their needs

Seminars or podcasts instructing users on specific components or facets of your

industry and how they pertain to a user based upon their needs

BOTTOM OF THE FUNNEL

Bottom of the funnel offerings almost always entail

direct interaction with a user on a one-on-one basis.

These users are presumably ready to buy and have been

well educated on your specific offering, the value they

Page 12: How to Create a Website Blueprint

12 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

will receive in its use and your organization’s methodology and value-add compared to your

competitors.

Good “bottom of the funnel” offerings include:

Free, no-obligation consultations on the user’s existing infrastructure

Personal demos via online meetings meant to showcase your offerings and explain

their uses in regards to the user’s specific needs

Onsite visits geared toward ascertaining user specific needs with a full analysis of

their specific requirements and a proposal as to how your organization can fulfill

them

Bottom of the funnel offerings and conversion points are the highest value and most time

consuming offering you can provide. It’s important that you qualify your users prior to leading

them this far down the sales funnel in order to ensure that you’re not wasting their time or your

own.

4. NURTURE

While you’ve probably heard of nurture tracks (which will

be discussed in the “marketing automation” portion of

this eBook) this particular “nurture” section pertains

directly to your website and its ability to keep your users

continuously engaged and, within the scope and

feasibility of your industry, constantly coming back. In

order to function adequately as a nurture resource your

website needs to be organic and constantly changing and

updating. This doesn’t mean that you need to recreate your core content on a regular basis -

instead you should make sure that you’re updating your website with relevant news, new

products or services, case studies, testimonials, completed projects (including images and

videos), new hires or additions to your team and anything else that might be pertinent to your

organization.

Page 13: How to Create a Website Blueprint

13 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Your website should be an ongoing reminder to your users that you’re always evolving,

innovating and growing as an organization and it should continue to give them a valid reason to

revisit your website. One of the most powerful nurture components your onsite digital

marketing strategy has available to offer is your blog. When users subscribe to your blog (or

your RSS feed) they give you the ability to continuously “drip” high value, highly relevant

information on them with the aim of keeping them continuously engaged and constantly aware

of your organization and its potential to meet their need.

In addition to your blog, image and video galleries are also extremely high value properties to

have and maintain as they give your users the opportunity to see exactly what you do and the

specific implementation behind your offering. It’s important that you’re diligent in the upkeep of

these properties since an out-of-date gallery can do as much harm as an up-to-date gallery can

do good. You don’t want to give users the impression that you’re not continuously working and

completing new projects.

Page 14: How to Create a Website Blueprint

14 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Your Website: The Open Source Content Management System

Your Website The Open Source Content

Management System

Page 15: How to Create a Website Blueprint

15 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

“Building a website”

When building (or rebuilding) a website it’s absolutely essential to have the following two requirements:

Manageability

As a recovering developer, I find it acceptable to tell

you: website developers are costly, finicky creatures

generally devoid of social intelligence, power drunk off

of their seeming strangle hold on your digital future and

often times dangerously equipped with strong and

pungent odors. It’s important that you are in a position

of self-reliance as much as is humanly possible in order to avoid these highly volatile and

typically over caffeinated abnormalities of human existence. You want and need the ability for

you (or other, non-developer members of your organization) to manage your web application

on an ongoing basis without the need for regular developer interaction.

Scalability

Like your digital marketing strategy in general, your website is

never complete. It should always be growing and should be built

on a foundation that allows for additions and organic growth

without the need for costly custom build-outs of functionality

that should be readily available for integration. It’s quite likely that you’ve already experienced

the unbelievably frustrating event of having paid billions of dollars for a fabulously lavish,

custom website build only to find that, shortly after deployment, the new [insert widget of

choice here] you wanted to add resulted in a “proposal” for billions more or, much worse,

wasn’t even possible with your current infrastructure and required yet another build from the

ground up. If you’ve been here before, you never want to repeat this mistake. If you have had

the good fortune of avoiding this tragic yet all-too-common pitfall, allow me to assist in guiding

you in the direction of near absolute protection from what I call the “woes of custom

development.”

Page 16: How to Create a Website Blueprint

16 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

THE OPEN SOURCE CONTENT MANAGEMENT SYSTEM (CMS)

A content management system (CMS) is a pre-existing application that your

website is built “on top of” and that allows you to manage the site without the

need of a full time developer or maintenance contract. A CMS equips you with

a web based admin panel that allows you the ability to login and manage the

site from anywhere you might find internet access and make updates to the

entire site infrastructure. A well-equipped CMS should afford you the opportunity to:

Add/edit/delete your main and sub-navigation

Manage and update all onsite content including text, images and videos

Add new pages, articles and blogs as necessary

Manage “back end” components (like meta data which is addressed later in the SEO section)

Manage admin panel access for other members of your organization

Manage custom components of your application like backend databases and specific modules

A CMS is meant to empower your organization to utilize your website to the fullest extent of its abilities

with the absolute bare minimum interaction required from the clichéd vampiresque developer.

IMPORTANT: You’ll note that there is a second half to the title of this section. We’ve already covered

what a CMS is, but what about the whole “open source” thing? Well my friend, allow me to enlighten

you as to one of the dirtiest little secrets in the website development community.

“Website developers (like most professions) crave job security. For this, and

many other self-serving reasons, many developers operate from a proprietary

development model; proprietary meaning that they’re building your website

on a platform of their own creation1. This is of great danger to you for a

number of reasons.The first and foremost being that, should you choose to

discontinue your relationship with this hypothetical developer, you’ll soon find

1There are circumstances where a proprietary model is completely unavoidable, specifically in highly customized solutions, but the

vast majority of businesses (and I mean 95%) will be well served by an open source platform.

Page 17: How to Create a Website Blueprint

17 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

that procuring a replacement is of great difficulty and, in some cases, an impossibility.

No matter how well built their custom CMS may be, it is often extremely difficult for an outside

developer to decipher the inner workings of the custom code. Many times these developers build out

their proprietary platforms with the specific aim of keeping an outside developer in the dark. This

means, in short, that they basically own your digital presence and that you are beholden to them for

anything and everything you may need done to your website. ”

Even if you have absolute trust and faith in your developer - what happens if they

suddenly go out of business? Get hit by a bus? Or are unable to perform a task or

specific build that is key to your growth? If your site is on a proprietary platform

your digital presence is only as strong as the development firm.

Open Source Content Management Systems are applications available absolutely free to the developer

to use (for further research into the strange anomaly that is open source development check out Dan

Pink’s RSA Animate video on the surprising truth behind human motivation that can act as the

foundation for the vast majority (and I mean 99%) of websites. The beauty behind the open source

model is that it is, prepare yourself for the redundancy, open. Every developer on the planet has the

ability to view the source code, learn the model and work with and on your website. This means that

you have the entire global development community available to you as a potential workforce. Sound

pretty good? It gets better...

One of the most powerful benefits of using an open

source content management system is the community

that accompanies it. Picture hundreds (oftentimes

thousands) of independent developers who are

constantly creating modules, plugins, templates and

other forms of additional functionality available for use

with your CMS. This means that, when the times comes

for you to add that special new widget you just can’t

live without, your developer can pull an existing module

right off of the digital shelf, customize it to your needs

Page 18: How to Create a Website Blueprint

18 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

and integrate it directly with your CMS. While this integration isn’t free it is exponentially less expensive

(and less time consuming) than having to build said widget from the ground up.

Already too good to be true? Allow me to blow your mind further. The digital world is in a constant state

of growth. Best practices, coding conventions and industry requirements are changing all the time. If

you’re on a proprietary platform, you’re at the mercy of your current developer’s ability to keep up with

this frantic rate of change in order to ensure that your CMS meets all of these standards. If you’re using

an open source system the global community that supports this system is constantly innovating in order

to make sure the application is kept up to date. Regular updates are common and easily to integrate and

ensuring best practice compliance becomes exponentially easier with an innumerable workforce slaving

away in the pursuit of maintaining the integrity of the application with which they all have a common

investment and interest.

Page 19: How to Create a Website Blueprint

19 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Your Website: Best Practices for a successful Build

Your Website Best Practices for a

Successful Build

Page 20: How to Create a Website Blueprint

20 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

When building a custom website, we should borrow the age old

carpenter’s adage: “Measure twice, cut once.”

Here are the steps you should take in preparing the initial “scope of work” (SOW) for your website:

ESTABLISH YOUR CORE GOALS

Not to go all “Stephen Covey” on you but with every

website build we want to begin with the end in mind.

Without establishing a firm goal (or goals) for your

website you may find the final scope of work to be

disjointed and incongruent with the real needs of your

organization’s digital presence. Defining actionable

goals in the beginning gives you something to refer

back to and use as a standard when determining more specific components of your site like its

functionality.

You should refer back to these goals throughout the entire pre-development process in order to

ensure every step taken is aligned with your target end result. Without this process it is not

uncommon for an organization to look at their newly completed development and realize that it

does nothing (or very little) to actually facilitate their goals. Instead it is simply a collection of

things they assumed should be a part of their application.

These goals can be fluid. If we realize in the planning phase of the application that they are

incomplete, then we mustn't hesitate to make any necessary adjustments. However, I caution

you against adding a single piece of functionality that doesn't do something in the nature of

bringing you closer to at least one of your core goals.

What is the goal of your website? Ultimately, what do you want it to

accomplish? Be specific…

Page 21: How to Create a Website Blueprint

21 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

DEFINE YOUR TARGET DEMOGRAPHIC

An equally important clarification to provide for yourself and

your developer is your target demographic. While your core

goals answer the proverbial “what?” in the scope of your

application the target demographic defines the “who?” This step

helps provide further definition to your functional specification

because it allows you to isolate your core users in terms of their

needs, concerns, interests and (potentially) behavioral patterns.

DETERMINE YOUR CORE FUNCTIONALITY

Here’s what you’ve been really itching to put down on paper this whole time. What is it that you

want your website to do? Use the goals you have established along with the newly clarified

knowledge of your target demographic to determine the functionality that should drive your

website.

Remember, stay away from adding functionality for its own sake. There’s an ongoing epidemic

in the world of web development that consists of people adding costly functional components

to their site because they think they need to. With each

piece of functionality make sure to confirm that it helps

further one of your primary goals. The flip side of this

coin is this: be creative! The sky is truly the limit and

almost anything is possible. Just because something has

never been done before doesn’t mean you can’t be the

first to do it. What processes currently take place in your

everyday business that could be digitized and hosted on your website? What utilities can you

arm your users with that will supplement their ongoing experience?

A brief aside on this note: the vast majority of our time spent on this topic deals with engaging

and converting new users. We tend to look at our website as a sales tool, and rightfully so!

However, it can be so much more than that. Two groups we often neglect in this process are our

existing Clients and our staff. What functionality might help you further service the needs of

Page 22: How to Create a Website Blueprint

22 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

your current Clients? What functionality could you build or integrate into your website to assist

your employees in their daily tasks helping to make them more efficient or better equipped?

IDENTIFY YOUR CONSISTENT CALLS TO ACTION

Your consistent calls to action are slightly different than the

conversion points mentioned in the sections prior. While the

conversion points we discussed in the chapters prior are

usually topic specific and may only be housed on particular

areas of your site, the calls to action we refer to here are the

primary steps you want your customers to take when they

reach your website and should be highlighted throughout the entire application. What is it,

specifically, that you want your customers to do when they reach your website?

Remember, this can be counterintuitive if you don’t take time to consider your real needs.

When I walk through this process with potential Clients inevitably one of the first things I hear

them say is “I want them to pick up the phone and call our sales department!” While this may

be (and probably is) true for your organization there are instances where you might actually

prefer users don’t call. Fielding inbound user requests can be tedious and take up valuable

manpower. Are there instances where you would prefer that they educate themselves on

certain facets of your business before reaching out to you? Allowing users to “self-qualify” can

save time and resources, especially if your particular product or service is highly targeted.

Also make sure to keep your functionality in mind when you begin defining your consistent calls

to action. For example, if you have an online scheduler built into your site, I would imagine one

of your consistent calls to action should be to schedule an appointment. Remember, your

consistent calls to action are steps you make available for your user to take throughout the

entire website experience.

Page 23: How to Create a Website Blueprint

23 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

BUILD YOUR APPLICATION SITEMAP

Your sitemap is a visual representation of the layout of your website.

You will use your sitemap to determine what content will be on your

site, how it will be organized within your primary navigation and sub-

navigation and where the functional components of your site will be

housed.

Creating a sitemap can be one of the more challenging steps in building your scope of work. For

assistance in creating a sitemap you can download our worksheet: “How to create an effective

and scalable sitemap for your new website.” You may also want to download our “Website

sitemap template” to base your sitemap on.

CREATE YOUR FUNCTIONAL WIREFRAME(S)

If you’ve been a part of a custom application development

before you may have experienced the following scenario: once

you have a preliminary scope of work in place your developer

starts creating mockups and sending them to you for approval.

(A mockup, by the way, is just an image that a graphic designer

prepares showing what your website could look like.) You pick

a mockup you like, maybe go back and forth a time or two

making a few tweaks and then voila! They start building your

website, fitting everything from your scope of work into your fun new mockup. Welcome to a

perfect recipe for disaster.

Despite the fact that this is how 90% of developers approach website builds, this process is

completely backwards. While creating mockups is without question one of the most exciting

phases of building a website, doing so without first establishing your wireframes is setting

yourself up for failure. When a graphic designer prepares a mockup typically the only goal they

have in mind is to be aesthetically pleasing; the format and layout of the site itself is completely

arbitrary and left to the determination of “what looks nice.” This method puts your functionality

Page 24: How to Create a Website Blueprint

24 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

and navigability at the mercy of a design that was pulled together without any real thought as to

how the site was meant to work.

You need to approach your website build from the exact opposite direction by building out a

wireframe for each of the core components of your site. Think of a wireframe as a "stick figure

website" that defines the structure and placement of each primary component that makes up

your site. Remember all that obsessive talk earlier about the importance of your goals, calls to

action and functionality? Well this is where the digital rubber meets the cosmic road. Take the

determinations that you have made about the goals and functionality of your website, couple

that with development best practices (examined further in the wireframe worksheet referenced

at the end of this section) and any possible limitations (logical, developmental or procedural)

and decide how the application will best "fit" together.

To give you a specific example - if one of your primary goals is to “educate your users” and the

main functional component you have chosen to accomplish this task is a video gallery, it’s

important that the video gallery is front and center on your new site. Taking that a step further,

how should the videos be displayed? Is there a single video that you’ll be highlighting each

month, or do you want to have a filmstrip that users can click through in order to browse

multiple videos easily from the same location.

You can think about every single piece of functionality as an independent application. So our

wireframe helps us to decide how these applications will not only tie in with each other but also

facilitate each other so that we're able to reach a developmental synergy.

At the bare minimum you will need to create the following wireframes for your application:

- Main (the "home page" of the application)

- Child page (the "interior page" of the application)

- Special (Optional - this is the wireframe of any custom components of the application)

Page 25: How to Create a Website Blueprint

25 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

APPLICATION WORKFLOW (OPTIONAL)

If you’re building a website that is highly

functional and has an advanced rules engine, it’s

important that you map out the workflow of

these functions prior to beginning the

development. This is especially true for

functions that have multiple layers of “if/then”

functionality. “If a user takes this action then

s/he will be taken to this next step.” The best way to accomplish this is by using your newly

created wireframes to map out the application workflow in a manner that acutely details each

of the available steps. I recommend using Microsoft Excel for this portion as it allows for

limitless horizontal and vertical extension.

This is helpful not only in defining the specific steps that an application will walk a user through,

but also in determining how effective the user experience is and flushing out any logical errors

you may encounter in the development process.

And there you have it! Once you have completed these steps you can compile each of these

components into a single document and use it as your RFP (request for proposal), scope of work

and functional specification in order to adequately drive and manage your soon to be successful

website development process. Good luck dear reader! Though I know not where this road may

take you, I send you forth into the treacherous realm that is custom development with the

knowledge that you are, thanks to my brilliance, as well equipped as is practically possible and

that, should you fail, you have no one but yourself to blame.

Page 26: How to Create a Website Blueprint

26 HOW TO CREATE A WEBSITE BLUEPRINT IN ORDER TO MANAGE A SUCCESSFUL WEBSITE (RE)BUILD

www.sol8.com

Share This eBook!

Image Sources

http://www.clker.com/cliparts/e/v/A/R/K/t/transparent-magnifying-glass-hi.png http://freshdigitalpresence.com/wp-content/uploads/2011/07/bigstock_Social_media_on_Smartphone_21485075-300x272.jpg http://hr.gmu.edu/images/footstep.gif http://fixcourse.com/wp-content/uploads/2012/07/websitetraffic1.jpg http://kcmgmarketing.com/wp-content/uploads/2011/11/attract-visitors.jpg http://www.earnsmartlyonline.com/wp-content/uploads/2012/09/engage-feature1.png http://www.famousbloggers.net/wp-content/uploads/2011/09/visitors-to-subscribers.jpg http://global.tahono.com/images/funnel/funnel%206%20jpg.jpg http://blog.hubspot.com/Portals/249/images/lead-nurturing1.png http://cdn.skyje.com/wp-content/uploads/2011/11/cms.jpg http://www.qlikview.com/~/media/Images/Products/deep_manageability.ashx http://www.gensight.com/Project-Portfolio-Management/Images/Technology-Global-Scalability.jpg http://www.westcoast.tas.gov.au/webdata/resources/images/Alert-Icon-.png http://aasthatechnosys.com/images/content-management-system.jpg http://library.hootsuite.com/Portals/125827/images/icon-whitepaper-generic.png http://www.wire.wisc.edu/Libraries/Common_Header_Footer/iStock_000004996421XSmall_-_Goals.sflb.ashx http://blog.salonvoices.com/wp-content/uploads/2011/05/valpak-target-audience.jpg http://fluxwade.files.wordpress.com/2011/03/istock_000007411540xsmall.jpg http://www.dealsavant.com/wp-content/uploads/2011/06/call-to-action.jpg http://emphaticsolutions.com/images/wireframe.jpg http://en.q-bpm.org/mediawiki/images/5/50/Workflow-engine.png

www.sol8.com