Functional vs Design: Who Wins the Battle?

A successful business has workflow processes in place. The sales and production infrastructure is critical to sustainability and growth. Often, when it comes to marketing these practices fall outside of the workflow. In the first part of this article, I talk about the process I went through when I decided to rework my website and make it integrated with my studio.

Then I discuss the steps you should consider taking to make your website more compatible with your business model. In other words, let's make your website a good employee.

You don't have to choose quality over beauty when it comes to designing a website. Both are necessary and are capable of getting along. Both are equally important when it comes to developing a website.

Websites should:

1. Be easy to navigate

2. Be visually appealing

3. Provide a great guest experience

4. Tell guests what to do

5. Create a positive experience

Design should not have a negative impact on the functionality and functionality should be well-designed. I'm going to provide you with a few basics on to marry functionality and design.

Navigation

When I decided to redo my website, I took a look at the navigation that is standard with most websites. They are built with 5 menu options that are chosen from:

Home. About Us. Services. Products. Contact. Team. Blog.

These menu options have been a staple for websites since the beginning of www development. All provide necessary information to help educate guests. I started to question the design:

How well are these menu items taking guests through the process?

Are we so tied to these menu items that something is missing on how we lead customers to take action?

I think the answer is YES. The more your pages are related and connected, the longer guests will stay on your website.

When I developed my website, I wanted it to be process driven. What do I offer? The answer is found on my Homepage.

From here you have 2 options, learn more about All-in-One Marketing or start the process of picking a website.

Learn about different websites and styles that fit your business needs.

Once you pick the type of website, learn more about the plans I offer and what will fit your needs.

Then you can contact me and we can get started.

Three simple steps and all have a call-to-action. Each page of a website should build and work off of each other. Each page should be loaded with action and information in an organized way that is not overwhelming.

But enough about me. Let's talk about you.

Structure: Step One

There are three ways to structure your website. Sequence, Hierarchal, and Web.

Sequence: Order your page in a series of chronological, alphabetical, or logical series. A dictionary or thesaurus website is a good example of a sequence website. The links are considered to be linear navigation.

Hierarchal: Ordering comes from one place of origin, usually a homepage. The hierarchal style is useful for corporate websites that have a lot of well-organized material. News websites such as CNN.com are a good example of a hierarchal website.

Web: Organization is not a restricted pattern. The logic behind a web organization pattern is to follow thoughts and ideas. You allow the guest's interests to guide them. This is how blogs are normally structured. When using the web structure it's important to build in one or more call-to-actions on every page.

Once you decide on a structure, then you want to start to wireframe your website. Wireframing is much like creating a storyboard. You want to draw out each page and decided where they are placed and how they link together.

Hansel and Gretel: Step Two

Using navigation tools such as breadcrumbs will help keep all of your pages organized and prevent guests from getting lost and frustrated.

You don't want visitors, you want guests. Guests will stay a while, make themselves comfortable, and feel free to look around.

Breadcrumb navigation helps guests look around and allows them to follow a trail home when they get too deep into a website. I like to use breadcrumbs on E-commerce websites to help keep product navigation simple.

Be Bossy: Step Three

You are not just storytelling. You are also directing. Each page should have a "Call-to-Action". Call-to-Actions come in several different forms but the one thing they have in common is they are direct.

Here are a few examples of CTA's:

1. Read More

2. Buy Now

3. Call Now

4. Click for FREE Quote

5. Sign Up to Receive...

6. Schedule an Appointment

All of these call-to-actions keep guests on your page a little longer, get them farther into the buying journey, and collect information.

Let's bring it all together.

When developing a website, it's important to lay out the structure.

Structure: Sequence, Hierarchal, and Web.

Wireframe: Map out the journey. Integrate it or have it mimic your sales process.

Navigation: Leave breadcrumbs so guests can find their way around.

Call-to-Action: Tell your guests what to do helps guide them in making decisions.