One of the most fascinating mistakes a web site page design displays is not communicating exactly what it is we’re supposed to do after it loads. Every industry, from fashion to organizations, seems to think we can read their minds.
Communication is the king of usability. A web page can have content out the gazoo and still not offer a tiny clue about where a task starts or what they REALLY want us to click on first. Content is no longer simple text on a screen. Today we have many technologies to play with and design techniques to try and engage with our site visitors. Our web pages offer images, text links, video, online forms, buttons and plug-in applications intended to motivate our customers into performing tasks.
Why are so many pages abandoned? What does it mean when we say “call to action”? How come Google Analytics shows strong inbound traffic followed by enormous bounce rates? One of the answers (there are several) is that upon arrival your customer wants to “do something” and can’t for the life of them figure out where to start. How do we fix this?
Every web page, regardless of whether it is your homepage or a landing page, must engage your user AND show them where to start a task. The trend today is to place Flash or rotating images on the upper half of a homepage with the expectation that visitors will watch it and then go exactly where you want them to go. Another one is to display a process by using images, but not indicating the order of tasks and what to click to activate them.
Understandable Calls to Action
Here are 3 solutions that focus on user confusion by making calls to action understandable:
- Confusion Point One – What do I click to get where I want to go? This is quite common. Your visitors can’t tell what’s clickable. Rotating images move and can sometimes be paused. Can your visitor figure out if they can click on those images or is there a button or text link nearby they can use? Are your hypertext links a different font color or underlined? Is linked text noticeably different than headings and sub-headings by using different font colors, faces and sizes? Is that a button or an icon? If it takes users somewhere, bevel the edge so it looks like it can be “pushed”.
- Confusion Point Two – There are too many choices. In the big rush to show everything a company has to offer, too many possible tasks are placed near each other. It’s not only busy, but how do your visitors decide which task to visit first? Should they look into the sale items, the video about a new product or the invitations to favorite places on the site first? As long as your design is attractive and organized well, customers will keep on reading down the page. You can take your time and not pummel them with tasks all at once. This only serves to overwhelm them and create indecision.
- Confusion Point Three – Where are you taking me (and can I trust you?) To click or not to click an image is one of the mysteries of the web. Can we click the image to get to the product page or do we get a call to action link or button that takes use there? What happens if we click the image only? Does it take us to a bigger picture of the item or the product page or the category home page where related items are? Communicate what you want users to do, please. Bevel the image’s edge to show it’s clickable. Label buttons clearly with “Add to cart”, “Buy Today”, or “Add to Wish List”. Be precise with text links, especially if they take visitors to a different task than a linked image. For example, a jewelry store may offer several pieces from one artist. A text link can take customers to “Learn more about this artist”, “Learn about this piece”, “More like this” or “See more earrings”. The latter two have different tasks as dictated by the information architecture of the site. For example, “More like this” can be a category of items that other artists make that are like it or perhaps it’s items in a similar price range (in which case, the link label should say, “More in this price range”). “See more earrings” may go to a category of just earrings and customers drill down from there. The key is to be absolutely precise with link label descriptions. It annoys users when a linked image and a text link go to the exact same place and it’s a wasted opportunity. Two or three different tasks in one product call to action box can serve 2 or 3 different user goals.
With mobile device designs, tasks must be well thought out because web page real estate is limited, as is the time people have who use their mobile devices to search or look up something on the fly.
- Be Simple
- Be clear and obvious