A impressive website is not only nice to look at and packed with technological wizbang, but is also usable. Usable not only by the people who wrote it, but by the actual users that are going to visit the site.
This is why it’s important to think about usability while designing a website, while building the functionality and while putting in the content and the final tweaks.
A good way to analyze the usability of a website is by asking yourself questions about the visitor; Why did they stumble upon the site? What are they expecting? What can they do once they get there, and how can we communicate that as fast as possible.
The hard part about answering those questions comes from the fact that it will often impact multiple disciplines that will need to work together to get the best results. A optimal workflow to preform a certain action doesn’t get created on paper, just as with any other aspect of a project it will need to be tweaked until you hit the sweet spot. A balance between a clear interface where the user can see at a glance what his or her options are and solid and powerful functionality that will enable the user to do what he wants to do.
A good way to improve usability is by analyzing the workflow of the user by writing a use-case. A use-case is basically a list of actions a user must preform to reach a certain goal. Take for instance the example below.
Goal: Creating a user account
1. The user visits example.com
2a.0 The user clicks the 'register' button in the upper right corner of the page.
2b.0 The user clicks a page that is members-only.
(The user is redirected to the login page, and a text explains registration is mandatory)
2b.1 The user clicks the 'register' button that is shown prominently next to the
3. The user fills out his desired username, e-mail address and presses the 'register' button.
(The user is notified that a e-mail is sent to verify his e-mail address)
4. The user clicks the verification link from his e-mail client.
(The user is sent to a thank-you page.)
In the above example we have defined the steps a user must take to create his or her account on our website, now that we formally know which steps the user must take we can discuss these steps and look at how clearly they are defined.
In the second step we see that there are two paths the user can take. He or she can either go directly to the registration page, or go to a members-only page where he or she will be redirected to a login page with text explaining why he needs to login or register. Now we actually want to avoid people going to the members-only page because it gives a negative incentive by denying access to content and it increases the steps a visitor needs to take to create a user account.
Now a possibility to avoid path 2b would be to look closely at step 1. This is where the visitor first lands on the page.
From eye-tracking studies we know people primarily scan sites in an “F” pattern. Notice that the ‘register’ button was in the upper right corner of the page. By moving this button and perhaps its accompanying text to the left we can be sure that more visitors will at least notice it. Perhaps not act on it, but they will be aware that the site they’re visiting might require registration at some point, this will hopefully negate some of the negativity of finding out some pages are for members-only: not only did the visitor already expect this might happen, he will also know what to do when it happens.
Another possibility is by increasing the register buttons visibility on the left side of the page by giving it some more white space. By increasing the white space around an object you are actually making that object more attractive for eyes to look at it. You can easily see the effect on the second and third example image on the link above about the “F” pattern.
Now the above is a simple example of improving the usability of your website, and often many other factors are involved. But no matter how complex it might become, a good use-case will give you a great starting point to find out where you can tweak your site to make it more usable.