We talk a lot about user testing and the user experience on this website. If you’re a regular reader, you’ve seen us go through a redesign over these past several months. But we have yet to talk about how to get started if you already have a website. And there’s a big leap between thinking that things can be better and actually making them so.

But it does beg the question, if you were to hire somebody to come in and improve your website, what would they do first? What should they do first?

Today we’re going to look at the initial steps you would take if you wanted to improve your website. The specifics will change depending on the project but the overall outline remains remarkably consistent from site to site.

Let Talk Time

Before we get started, let’s talk about how long all of this should take.

It really depends on how in-depth you go, how much effort you put into creating a report, and how large your website is. I typically plan 1-2 days to do all of this. I’ve done one in 5 hours before and I’ve done others that have taken 20 hours or more.

Either way, this is a bit of a time commitment.

But then again, you didn’t think it was magic, did you?

The good news is, you don’t have to do this all at once. You can eat this sandwich one bite at a time. 🙂

Trust in God, Everybody Else Bring Data

The one thing you’re going to need in order to help you make decisions is access to web analytics. This will most often be Google Analytics but it could also be any of the other good tools out there: KISSmetrics, ClickTale, Woopra, Omniture, etc. Other data, such as from Google’s Webmaster Tools will also be helpful.

You need at least one analytics source. Google Analytics is the bare minimum. But if you have access to more than just Google Analytics (or even instead of Google Analytics), the other tools will provide valuable insight as well.

If you don’t have access to any web analytics, the first measure of business is to get some installed and to collect several weeks of data. I wouldn’t feel comfortable making any serious decisions without at least 30 days of data but your comfort level may vary. But the point remains, the more analytics data you have access to, the more informed your decisions will be.

Step 1: Diagram Your Website

Whenever I start looking at a website for improvements, the first thing I want to know is what it looks like from an information standpoint.

Think of it like back when you used to play The Legend of Zelda. When you got into a dungeon, you needed to know your way around. So you’d seek out the map. Then you’d find the compass which would tell you where the boss is. And finally you’d need a key to unlock the door to the boss’s room.

Websites are essentially the exact same thing. Well, minus Nintendo’s intellectual property and the fact that it all happened in your childhood.

The point of diagramming your website is to look for two things: GOALS and FLOWS.

The following is an example of a diagram that I did for PopSurvey.

I created this diagram in Google Docs. It does several things – all of which help me wrap my head around how the website is used. It should be noted that the particular method I’m about to describe is my own. You should feel free to modify it or ignore it at will. You da boss.

I wanted to notate:

1. The general flow of the website (notice that I didn’t note every possible link coming off of a page)
2. The paths to goals
3. Which pages were filters, which had goal opportunities, and which pages indicated a successful goal had been reached

I did this by drawing out the paths of the site (which I found by clicking through the site), by giving the boxes colors to denote their state, and the lines colors to denote the value of the path.

Doing all of this will give you a visual representation of the goals and flows in your website.

There’s a good chance that you might have already found some other problems with the website while clicking around. Note these. That’s why you’ll see the little red superscript numbers above the boxes. Those numbers correspond to notes about each page that’s been tagged.

The important thing here is to get a feel for the flows and for how things work.

Even if you’ve been living in your site forever and feel really comfortable with it, this is still a valuable exercise. It will inform the next step.

Step 2: Look at the Numbers

Depending on your particular situation, you may or may not have access to sales and sign up figures. If you do, you’ll be able to put more specific values to your data. But for the purposes of this article, we’re going to assume that you don’t have access to those numbers. To keep things simple, we’ll assume that the only thing you have available to you is Google Analytics.

If you feel a little nervous about approaching Google Analytics, I feel your pain. It can be a daunting problem. That’s why we found 5 articles that will help you with Google Analytics. Whether a n00b or a longtime user, everybody can learn something from those articles.

For our purposes, we really only need one number: the bounce rate.

A “bounce” is when somebody lands on a page and leaves the site without going further into the website.

What we care about are the bounce rates along the critical paths of the website. In my example above, we’d focus on the boxes along the green and blue paths.

What are the bounce rates for those pages? Are they low (20% or less), medium (20-40%) or high (40%+)?

Start with the pages with the highest bounce rates. And think – should this page have a high bounce rate? Because it’s possible that it should. For example, if you have a page on your site with your location information. If somebody finds that page via Google and gets the information they were seeking, it makes sense for them to bounce from the website. In this instance, the user bounced AND found the information they were looking for. It was a successful visit but it also bounced. This is going to happen. That’s why these numbers are meant to be rules of thumb.

[highlight color=”eg. yellow, black”]All you’re trying to do at this point is to begin to make some assumptions.[/highlight] Play with the numbers and look at your IA diagram. Can you figure out what’s driving your user’s behavior? (Here would be a great time to have data from tools like Inspectlet or ClickTale. Being able to watch videos of your users actually using your website is crazy informative.)

Step 3: Comb Through Your Site

Remember when you were making notes on your diagram about the things you didn’t like on individual pages in the last step? Now’s the time to collect all of the weird things that your website does into a pile. You don’t have to be 100% sure things are bad to note them. The goal of this section is to develop a list of problems. If you find yourself with a big list, divide the list by importance.

What constitutes a problem?

Ah, yes. The $64,000 question. The difference between a professional and an amateur when it comes to doing these professional reviews is their ability to sniff out the right problems. Pros look for problems in the narrative.

The narrative? Isn’t that something that books have? How does this apply to websites?

Actually, every website has at least one narrative. A narrative is simply a story that you tell somebody to communicate information. It does not mean a literal narrative that you might find in a story.

Let’s look at this from the point of view of somebody with an e-commerce cart. What is their narrative? It would look something like this:

1. Frontpage – presents the main competitive advantage, lets me click further into the site based on what they do
2. Category page – I’m now on the category page looking at, say, shoes. I want running shoes.
3. Sub-category page – Now I’m looking at a page full of running shoes. I wonder if they sell Nike Free running shoes?
4. Product description page – Yes they do. And they have my size and color at a price I’m willing to pay. I want to buy them.
5. Cart – Ooh, look at my stuff. I want to checkout.
6. Checkout process
7. Receipt

That describes a whole story for a user. It also describes the path somebody would take through the website. Funny, that.

That’s why zeroing in on the narrative is so key. Once you understand what you have to offer and how you want to roll it out to your users, you’ll begin having a better conversation with your users. Your bounce rates will drop and more of them will do what you want.

What to look for?

You can start by reviewing the 6 Things Your Home Page Must Have (to Keep from Sucking).

Then think of these:

Credibility: They want the website to project credibility and topic authority. The tone of the website should also be consistent with the goal of the website. You wouldn’t, for example, have a website about wedding photography designed in garish circus colors. (Well, not unless you specialized in circus wedding photography, in which case, you have a point.)

Authority can be conveyed through the use of other logos. That’s why you see people tell you where they’ve been reviewed (New York Times!) or who their clients are (Google, Best Buy!) because if the New York Times takes notice or Google and Best Buy use the product, there’s a good chance that it’s a quality product.

The Big 3 (Who are you, what do you do, who are you for?): These three questions form the crux of what the front page of a website should answer immediately. Users want to know what’s going on within 3 seconds or they get itchy about sticking around. So there’s a simple test – Given 5 seconds, can you discern the who, what, and who for? Use a tool like 5 Second Test if you need a fresh opinion.

How clear are your critical paths? The reason that a bounce rate is a valid way to assess the critical path is because a path has a before and an after. It’s part of the process. So if the visual presentation is informative (for example, including bread crumbs) then even if somebody enters the process in the middle, they should be able to orient themselves and find where they need to go easily enough without having to leave the site.

Look at your critical paths and identify the pages with the highest bounce rates. Develop theories as for why this is. Can you find data to support your theories? Can you think of a way to test your assumptions?

[highlight color=”eg. yellow, black”]These are the real questions that drive user testing success. It comes from identifying real roadblocks and then figuring out how to eliminate them.[/highlight]

Menus and Search: Menus can present multiple problems. For one thing, they’re responsible for directing traffic around the website. If people don’t know what the labels mean or if it’s not obvious what they’re supposed to navigate to, then they look for a search bar (if you’re lucky) or more likely, leave. Make sure the visual style is consistent, that the labels are easy to ready and understand, that the menu items are ordered correctly and are simple enough without being too simple.

And as for search, be sure you’re collecting this data in your analytics. And if you can, use Google’s search. WordPress is known for having a lame search engine. Unless you really know what you’re doing, go with Google. They produce the best results. If that’s not an option, just remember that having a good search option is key. If your search is broken, people won’t be able to find what they want on your website. And they will leave.

The Signup Process: Look at the signup/checkout section with a magnifying glass. If you’re an e-commerce site, you want to look through each part of the checkout process. If you can get a tool like ClickTale, which will identify on a field-by-field basis where users are abandoning your form, you’ll be able to see exactly what you need to clarify or simplify. Like the critical path section, formulate some thoughts on why people are leaving. Is it something they’re expecting that you’re not giving them? Are you making it too hard? Are you sending them to PayPal? (Seriously, that’s lazy.)

On the other hand, you might find that you don’t really have a sign up process. What if you sell yoga or therapy or some other service?

In these cases, there will be a general funnel, but you’re right – it’s more important to have your contact information be obvious. You can use a service like CallRail to track phone calls from your website. You don’t have to track calls from the website but doing so will help you put an actual dollar value on it, giving you better ROI data.

Step 4: Competitive Research

Everything you just did, you can do for your competitors. Though only a masochist would do it to the same degree as what you just did for your own website.

[highlight color=”eg. yellow, black”]The key to doing good competitive research is to find things that you like on their websites.[/highlight]

Think of it this way: they’ve done their own research or have at least hired their own experts to build their site. It only makes sense to see what they’re doing that works.

If you have time, look at websites outside of your particular market. Become observant of tricks that websites use to keep a strong narrative signal.

Take copious notes, and screen shots.

Step 5: Take a Break

Good lord, are you trying to kill yourself? You need to let all this settle in your brain. If you can sleep on it, do that. If not, at least go get a sandwich. Replenish the energy in your brain. You’ve earned it. Even now, this has been a long article. I mean, we’re almost done but feel free to take a walk around the block. Stretch. Get another bourbon (or a smoothie). Whatever you’re into.

I’m just trying to look out for you.

Step 6: Distill Into a Report

Even if you’re only doing this for yourself it’s a valid exercise to take everything you’ve just researched, assumed, taken notes on and have drawn and to draw very clear connections.

Identify the problems.

Propose solutions for those problems. Use supporting data when possible. Show how you can get the data if need be. These will likely end up producing user tests that can be run.

If you feel like drawing out new wire frames, do it. Make a new IA drawing if the whole thing needs to be overhauled.

And finally, decide how much you like risk.

Each one of your assumptions is just that – an assumption. [highlight color=”eg. yellow, black”]What user testing does best is test your assumptions.[/highlight] The fewer assumptions you test, the more risk there is that your assumptions are wrong.

It’s tempting after turning a critical eye on your website and your competitors to assume that you automatically know a better answer. And that’s quite possible. After all, the goal here is to make the website better. Which, when you think about it, is a pretty low bar for success.

The amount of testing you do to confirm the assumptions you’ve made before investing in making changes depends on how expensive it is to make them.  It’s a balance between cost and risk. But that’s always the case.

You’ll have to get to this point and then make a judgement call.

Conclusions

Believe it or not, this is what I give to each of my clients. I need to be able to go over their site in minute detail. I need to log my assumptions. I need to do competitive research. I need to dig through the data. And I need to digest it all.

Yes, it’s a lot. But it’s the smart way to get started.