Web Usability is more important than ever. People have little to no time to read through all of your information to find what they are looking for. Creating visual relationships can help users find what they are looking for quicker and more efficiently.

Prominent = Important

Humans naturally look for similarities and differences in everything. That’s how we can tell people apart. Naturally things that stand out get more attention that ones that don’t. Like noticing the person with the crazy hair in the subway…what were they thinking? Fortunately with design we get to choose what is more prominent. How do you do this you ask? There are several ways.

Here is a list of a few:

• Put near the top of the page
• Make the info Larger
• Make the info Bolder
• Give text a different color
• Separate with white space
• All of the above

The more of these you use, the prominent it will be. Having a more prominent element will be a separater letting the user know that anything around it more than likely relates to it.

Items Related Logically are Related Visually

Grouping Under Header – Placing information underneath a header logically suggests that it belongs to that header.  This is common in newspapers, and pretty well any text you read.  This creates a visual hierarchy.

Same Visual Styles – Much like brothers or sisters, you can usually tell when people are related because they look similar.  Same thing applies to text, if you want something to relate to one another, use the same styling. e.g. All links are blue and underlined.

Clearly Defined Area – Like putting your socks in a sock drawer, putting text into defined areas help organize information. By doing so also helps suggest that all the information is related.

Nest Information Visually

Visually placing information nested within one another is an easy way to create a relationship with information. On the out most you have a general description, as you work your way inwards it becomes more specific.

Be Careful About Creating Unwanted Relationships

Unfortunately it is easy to create unwanted relationships. All it takes is a misplaced emphasis on some text, that leaves the wrong impression. So be careful how you lay things out.