Pick a site, any site. What’s the first thing you notice? What draws your attention right away? Where do your eyes land?
What do they do then? Do your eyes flow over the page? Do they follow a specific path, flicking to the left, then skimming over to the right and maybe down the page? Do you leap from color block to color block or jump from title to title? Or do your eyes zigzag through utter chaos as you search for something you can focus on?
When any site at all appears on your monitor, you’ll either have a good first impression and want to explore, or you’ll be hit with a jumbled mass of chaos that you don’t even want to stick around to figure out.
Site layout is the answer. It’s the basic composition of the key elements on the page – where everything is. Creating proper layout isn’t something that comes naturally to most people, either. Many designers or dabblers just lay stuff into sites and hope it works.
Sometimes you get lucky. You have a feel for what seems right and what seems out of place, and you can lay out a nice path for visitors to follow when they land.
But luck will only take you so far. You need to understand why layout and the placement of elements work well together to build a better site for your clients – and hit the mark every time.
Why a Site Needs Proper Layout
If you want people to stay on your site, you need to keep some principles in mind:
First, you need to understand that how you view material on the web is very different from how you view printed media. Think about how you look through a magazine or catalog compared to how you surf sites on the web.
With a catalog, you might leaf through pages. You’ll linger over attractive images, read a bit of descriptive copy, or maybe jot notes down on a wish list. You leaf through a magazine too, admiring full-page ads or articles, moving on to the next page, reading a bit of article or a call-out box.
On the web, how you view pages is often different. You’re moving constantly, already searching for something – information, entertainment, products…There’s no time to waste and a barrage of visual stimuli to sort through, analyze or ignore.
While surfing the web, you don’t usually mosey through pages on a site. At best, you browse sites, judging them in a split-second glance, moving from one to the next as you get distracted and click an add or a button. Of course, clicking stuff runs the risk of you being taken away from where you were and not being able to get back, so you avoid the extra stuff begging for your attention to focus on where you want to be.
Your attention span is shot. It’s gone right out the window. It’s moving fast, avoiding distractions and searching for what it wants. If you can’t find that in three clicks on a site, you’re out of there and heading for the next.
Walking Your Eyes Along a Path
Why are websites laid out the way they are? It’s how people in our culture read: from left to right and top to bottom. Although some people in other cultures read from right to left, the majority follows this typical pattern.
- A header (or banner) is always well placed when it’s at the top, as doing so gives people a starting point. They like to know where they are before they begin moving.
- The navigation bar underneath the banner gives people options and tells them what they can find, suggesting places to go to get what they want.
- Additional navigation can be had down the left or right of the page, subtly leading people down the page and calling gently for their attention.
- In the heart of it all is the content, sprawled out with lots of room in a space all its own.
Your site should be laid out in a way that helps people move around and navigate your site easily. Since the virtual world doesn’t really offer a clear sense of direction to people, the direction you can offer them on your site takes on greater importance.
Because that makes visitors a whole lot happier. Why confuse people with a scary looking forest to bushwhack when what they really enjoy is a meandering garden path?