Shared publicly  - 
 
How to Use Visual Hierarchy To Create Clear and Easy-to-Read Web Pages

Imagine you’ve entered a cave.

Your eyes slowly adjust to your surroundings and begin to make out the shapes and forms around you

You see three doorways: they’re equal in size, and all the same distance from where you stand. How do you choose where to go first?

You’re frustrated, because you don’t have enough information to make a decision. All you can do is guess.

Now imagine you’ve entered a second cave.

In this one, there’s one large doorway before you. It says “Tours” and is wide and well-lit.

To one side, there’s a small doorway with a window in it that says “Tickets” above it. Next to it is a nondescript door that says “Employees only.”

In this cave you know exactly what to do.

You’re here for a tour, so you walk up to the ticket window, buy your ticket, and walk through the door that says “Tours.”

Your website is like a dark cave. And in tomorrow's post +Pamela Wilson will explain how to guide your visitors effortlessly through this cave with a simple 3-step thought process.

Update: Post is now live: 
http://www.copyblogger.com/visual-hierarchy/
18
6
Caroline Jones's profile photoJon Martin's profile photoJeff Doubek's profile photoAshwin K Dhandhukia's profile photo
16 comments
 
I love the analogy.  The illustration make the concept of visual cues so powerful. A new way to think of an old issue.
 
I've been giving a lot of thought to this lately. It seems like we need something between a blog and a website, that better organizes our content, yet allows for immediate conversations. Something that helps visitors find the articles they want quickly.
 
Wonderful article. One of the tricks I use is to look at  a page upside down and pay attention to how my eyes follow the flow of the layout. I can detect subtle errors in balance and symmetry. The text then becomes a design element.
 
+Tom Barrett That is a great tip! It's something they teach in design programs.

It's a little tricky to do with a web page, though. And every time I try that with my iPad, it turns itself around again. What's that about? ;-)
 
+Pamela Wilson as a blogger I've always been frustrated when my posts rotate off the front page as new posts are put up. I've tried different strategies to keep them top of mind, but the blog format always seems to get in the way. Now that we need to become authorities in our field, it seems like we need a different architecture to better organize our evergreen content.
 
Excellent, excellent article (as always). I often use similar analogies to help anxious clients step away from too many links on one page (or email). Instead of a cave, I use the analogy of a hallway or a path with signs, and help them visualize what it would be like if they found themselves in a hallway (or path) with multiple signs. It could be multiple signs (with different text) on one door, or similar sounding signs on multiple doors, or just simply many interesting doors. Where to go? It's not just confusing, it's anxiety provoking. 

Better to serve as a guide along a pathway. "First you go here, and then here".

I'll be following my own advice with an upcoming redesign to my own website.
 
I can't wait for +Copyblogger Media 's New Rainmaker. I know what I want to do, I'm just not skilled enough to do it...tech-wise. How do I know? Because I've been "gently stalking" [as we say on Google Plus] +Pamela Wilson both on +Copyblogger and +BigBrandSystems. Great advice that I so need to get into practice. 
 
Hehehe, I didn't invent the term; it's pretty pervasive here on The Plus. But I do "gently stalk" people I admire and want to learn from and you are definitely high on that list, +Pamela Wilson 
 
Great article +Pamela Wilson! I definitely liked the part about the busy/to prominent side bar.
Add a comment...