Sometimes there is nothing harder to see than regular old text.
One of the biggest ironies of usability testing is hearing test participants say, “Well, I wish the site would tell me that information!”, only to find out that the information was in a paragraph right there in front of them. Users do not read is a common mantra among all usability analysts. If you have information you really want to get across to your visitors, consider the following: To begin with, realize that not all information is important. Identify the three or four things you really want someone to know about the page they are viewing. If it’s e-commerce, this would be immediate discounts, free shipping, etc. If it’s an informational site, this may be an overall synopsis of the situation, highlighting a quote, etc. Again, focus on these items, and make sure they stand out from the rest.
One way of thinking of this is to consider your website content as being positioned on three visual layers:
- Critical or unique benefits should be highlighted on the “front layer”. This should be obvious, but the only way ‘Free Shipping’ is going to stand out, is if it is visually separated from the other information. Don’t tuck this into a paragraph at the top, and expect people to see it. Highlighting information in bullets is the most common and successful method.
- General Information should be on the “middle layer” and neither emphasized nor downplayed - As a general rule, approximately 85% to 90% of your content should be positioned on this layer. This is the general, 12-point Times New Roman font. It should not necessarily stand out, nor should it be hidden.
- Optional Information should be downplayed - Information that is not critical to the current process, but may be desired by some, should be put in the “back layer”. Some methods of this would be to take it out of the primary field of focus, put it in a gray font, and in a short paragraph at the top, etc.
Example #1: Consider the following screenshot from LinkedIn. LinkedIn is a service for people to network and share connections. This page shows what others can see about you. We’ve “blurred” the general information, but notice how they highlight the ‘Tip’ by putting it in a yellow box. Whereas the ‘Your Profile’ information is not critical to the task at hand, so they put it in the margin in a gray font.
This is a clear example of visually “layering” information to make specific content stand out.
Example #2: Consider the following example from an online banking company describing the benefits of their services. If you have important information to highlight, bulleting the list is typically the ideal method.
Duplication of Links on a Page Every web site uses links to help visitors find information more easily. Many times the same item of information may be linked to from more than one spot in a site, often from more than one spot on the same page. This is a good thing because you want your visitors to find relevant information easily. Making it accessible from multiple links helps the user. If they are reading content in the center of the page, they may not be drawn to the left nav, so you can have the same links in both places. Sites get in trouble when the links to the same information appear with different wording. We saw an apparel site that used differently worded links to point to the same wool apparel page. One said “Wool fashions” and the other said “Wild and Wooly”. Users weren’t sure if these links pointed to the same content. On a medication site, links on the same page pointed to the content about who could suffer from a condition. One link was labeled “Condition could affect anyone” while a second link read “Who is affected by condition”.
Users looking for sufferer information clicked on both links and then complained that they went to the same content. In summary:
- It’s fine to have multiple links on a page pointing to the same content
- Make the links short and descriptive - not cute
- Word the links identically to avoid visitor confusion