My Marketing Thing

Briefing a web dude – Part 3: layout ideas

Website hot spot cartoon

As you may have guessed from the title, this post is the third in a series about briefing your web dude. This makes up the holy trinity of web briefing. Find the father and son here: Part 1 and Part 2.

Okay, you’ve had a gander at other people’s websites. From this meandering, perhaps you now have some ideas of what would work for your site.

If you already have a site but are ready to attack it with a blow torch, you probably already have some ideas of what isn’t working right now.

It is quite possible, after answering the questionnaire in Part 1 of Briefing a web dude that you also know what technical gizmos you would ideally like on your site.

Of course, you may not be able to afford all the gizmos that you want. But the quoting process will help you determine this. Also, the web builder may be able to guide you on what gizmos will work best for your particular business and target market.

So why go to all this effort briefing the web dude if you could be up the wrong alley?

The more thinking you put into the briefing process, the faster the web builder will be able to help you get where you really want to go – within a doable budget.

Believe me, it’s easier to start from somewhere that’s a bit off-kilter than in the middle of the Sahara.


Back to the layout thing

Not a lot of people think to give a rough layout to sum up ideas as pat of their web brief.

The keyword here is ‘rough’. Because, of course, the web dude might have other ideas beyond your own that could you end up preferring. But, as mentioned before, get your ideas down so you’ve all got something to play with.

For this rough layout you might want to give what’s officially called a ‘wireframe’.


What is a wireframe?

Wireframes are basic ‘page layouts’ of the main pages of your website. This is not so much how the page will be designed (i.e. look aesthetically), it’s more what goes where.

The wireframe will assist the web designer when it comes to ‘prettying up’ the site (adding colours, tones, images, graphics, etc.). Think of it like an x-ray of the page.

Here’s a generic example of a wireframe:


Home page wireframe example


I just popped in some Latin to suggest text. So if you are creating your rough on a computer then you can copy and paste the Latin from the site Lorem Ipsum.

But you don’t have to design the rough wireframe on your computer. Instead you could:

  • grab a pencil and a piece of paper
  • scribble out a rough
  • scan that baby
  • email it as part of the brief, explaining that it represents initial rough ideas


What is the best layout for your site?

The wireframe above indicates a pretty standard layout. For instance, the menu bar is a bit of a knee-jerk design element.

Important point: When it comes to core layout elements, knee-jerk isn’t necessarily a bad thing.

Visitors already know how a horizontal menu bar works. They can orientate themselves quickly and get to the meat of your message faster.

However, you will also find some super creative sites by-pass the horizontal menu bar in the most delightful of ways. See Planet SARK and Artella Land.

Your layout depends on what will be most important to your visitor. Will it be a creative experience?  Or a fast information gathering experience? Is it important that you appear cutting edge or reliable and direct? Or a bit of both?

Tip: If you do have a horizontal menu bar always have ‘contact’ or ‘contact us’ at the very end i.e. at the far right. This is your most important page. After all, the purpose of your website is to inspire people to contact you, right? So make it easy for your visitor to find your contact page – don’t bury it in the middle of the menu bar somewhere. Most irritating.  


The power of the right hand side

it is highly recommended to have ‘visitor opt-in’ elements down the right hand side of your page. ‘Visitor opt-in’ means things that lead them to directly interact with you. These include:

  • ‘subscribe to our e-news’
  • ‘get a free quote’
  • ‘download our free report on…’
  • ‘buy my latest book here’
  • ‘take our survey’

Affiliate advertisers know the power of the right hand side. So if they aren’t going to muscle into your banner space at the top, they will want to be here. Your hot spot.


Why is the right hand side the hot spot for interaction?

I can’t say for sure, but I do know that it’s a marketing psychology that has been working since the dark ages – i.e. pre-internet.

When you buy newspaper or magazine ads, securing a position on the right hand side of the right hand page often costs more. It’s where the reader’s eye defaults to.

The mystery of this right hand thing is up there with the pyramids – but it has a similar ‘growth power’.


Other layout tips

  • Keep the layout as simple as possible so the visitor doesn’t feel overwhelmed.
  • Keep the layout tight to reduce the amount of scrolling.
  • Like magazines and newspaper articles, people don’t tend to read website content, they scan it. So, like magazines and newspapers, don’t have text that runs right across the page – have columns, it’s easier to read that way.
  • Make it easy for the visitor to contact you
  • Have changing content on your home page to keep visitors coming back (also good for Google ranking/SEO)


Talking of SEO (search engine optimisation)…well, isn’t everybody? I know that deep down you want to talk SEO.

So I promise I’ll grab SEO by the horns and tackle it to the ground for you in the next post. How does that sound? Exciting? You bet.


This post was written by Megan Hills.  Megan is a writer, cartoonist, marketing consultant who has no training in Latin but likes the look of them in wireframes. Find out more about Megan.

Be Sociable, Share!

One Comment

  1. Erica

    What a great trinity of posts, Megan, thank you – you've pulled off a miracle by making talking to web dudes a little less scary.

    I think one reason the right hand side is preferable for advertisers is because in a magazine (or book or newspaper) the right hand side is the one that opens out flat – the left is stuck with the curve from the spine. Though I wonder if it is different in countries where the language reads from right to left…

Leave a Comment

 Related Posts