Posted on July 30th, 2014
According to Steve Krug, the author of Don’t Make Me Think: A Common Sense Approach to Web Usability, the No. 1 rule of web design is to make the user think as little as possible. Not because the user will leave the site or think it’s poorly designed, but because the user will think it’s their fault if they don’t understand what to do on a website. I think it’s fair to say this is not how we’d like our users to feel upon visiting (or leaving) our sites.
Ideally, websites should be intuitive so users spend less time trying to figure out where the navigation is, how to start once they arrive, and even how to use the search button. To me, a search button is a pretty self-explanatory function of a website. For those of us who grew up googling, we don’t need for it to say “Search” or even have a button to click when we want to go. (I always try Enter before I click a button to “Go”.) But Krug argues that these little things aren’t always obvious to users, so there are best practices for a search button.
I think Amazon is a good example of an effective search button. First, it’s at the top of the page since it’s the first thing you want to do when you get to Amazon. It’s also HUGE, clearly labeled as the search area, and has a “Go” button after the field where you type in the query. This kind of search is the easiest to use because it tells you exactly what you need to do, and it’s located in the best possible spot.
Another thing that makes a website easier to use is how fast users can skim it. People are not good at reading instructions; I’m an English major and I read everything except instructions on websites. It’s tedious, so people just try to muddle through instead, clicking on whatever link looks promising. Since it’s so easy to go back, there's little risk for clicking on a link even if it takes you to the wrong page (unless a page is slow to load). Because users tend to take their chances, they need to be able to scan everything in a hurry so they can make their best guess about where to go.
Two websites that are easy to scan are Designer News and Smashing Magazine. Designer News is good for browsing, so they have a few obvious options from the home page: you can search “Stories” or “Jobs” right from the top, two of the reasons you might visit the site. The navigation is short and sweet, with the search function available if you’re trying to find a specific story or topic. Last, the news feed is super easy to scan, with icons that mean different things - you can even skim without needing to read! Best day ever! My one issue is that the name of the website is missing - it just feels nice to know where you are.
Smashing Magazine is a good resource for web design, so it has sidebar navigation with categories (the headings are bold) to quickly look through if you need a certain topic. The name of the site is obvious, with a different navigation that spans the top of the page. This nav is visibly separated from the sidebar nav, with less options to choose from, and social media icons clearly but discretely tucked to the side. These icons are slightly transparent unless you hover over them, making it feel like one less thing vying for attention.
This is a fun experiment on usability. Krug calls it the Trunk Test:
“Imagine that you have been blindfolded and locked in the trunk of a car, then driven around for a while and dumped on a page somewhere deep in the bowels of a Web site.”
Find a website that you’ve never been to, and try to answer these questions as quickly as you can:
According to Krug, being able to answer these with little hesitation is the mark of effective website usability.
This book is hilarious and designed exactly like Krug suggests websites should be designed: with strong visual hierarchy, scanability, and clear points that will be made in each chapter. It's comprehensive in other areas including usability testing, accessibility, and working with different members of a web dev team. (The section is called “The Farmer and the Cowman Should be Friends”. Any other Oklahoma! fans out there?)
This is definitely a staple of a web design library. Do you have this on your go-to list? What are some of your favorite websites that are super user-friendly? @alisenhazzard