Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It's 100% free, no registration required.

I am designing a one page site, and I need to go back to basics and learn about how to translate business aims into a homepage design.

Can anyone offer some advice on the relationship between design and business goals? E.g. Where I should put the call to action in a responsive design.

share|improve this question
1  
Hi Andrew, as it stands this seems like a very open-ended, brainstorming, idea gathering question. You may do better to ask specific targeted questions rather than a large sweeping general question. –  Scott Apr 11 '13 at 16:24
    
I read it as like "What are the key principles for designing one-page call to action sites" and what differences in approach should be taken compared to a more conventional web site (hence "go back to basics")- which seems like a good question to me. Could be worded more clearly though - Andrew, can you make it clearer? Might be good to know what sort of call to action as well. –  user568458 Apr 11 '13 at 17:38
    
Fair enough. Downvote wasn't mine. It was my hope that Andrew would reword a bit. –  Scott Apr 11 '13 at 17:52
    
down vote wasn't mine either but I am taking his question as how should I "design for web" –  Matt Apr 11 '13 at 18:09
1  
As it stood, it was a better fit for our UX Site. I edit it a little because it got really good answers (Andrew, please feel free to re-edit). Here's another interesting resource on long scrolling pages –  Yisela Apr 11 '13 at 20:25
show 2 more comments

2 Answers 2

up vote 3 down vote accepted

Obviously it all depends on what these business goals are... but, there are a few principles in designing one-page call to action sites that are pretty universal and established through evidence.

Since they have a clear goal, these types of sites are comparatively easy to test, particularly, with iterative A/B testing. (half users see one design, half see a slight variant, watch how the two groups behave in the analytics and learn about what works. Then make a new pair of slightly improved designs based on what you've learnt, test again, improve again...).


So, the first step is about the approach. It's always good practice to create a design then create a feedback loop where it can evolve based on real testing, but it's usually a major logistical challenge and comparatively subjective: with a one-page site focussed on a clear goal, it's essential and much simpler and cleaner.

You're creating something that will evolve and narrow in on the goal (not creating something then sitting back, ammending it if needed).


Second step is, wise up on what others have learned through such testing: particularly in your specific sector. Look for sector-specific trade magazines alongside design and usability sources.

That said, some things are fairly universal. I forget the exact references, but here are a few general pointers to get started with.

Key principle: it's all about leading the reader by the hand directly to your call to action, so that when they get there, they're as interested and keen as possible, balanced against; needing as small an investment of time and active effort as possible:

  • Have a very clear, linear path. Any ambiguity about where to look first and where to look next in a campaign tends to lose people. Don't try to be too clever.
  • Avoid anything confusing or anything that creates uncertainty. This includes noisy or complicated design features. Have a very clear, consistent style that sets a very clear, simple, strong theme that just makes sense. Think "Do I need this?" about everything, even more so than normal.
  • Have one clear main call to action (see below if you really need alternative options):
    • Lead the reader to it, presenting it at the point that is at the balance where they're most interested and most likely to go for it...
    • ...but also, where there hasn't been too much demand on their time that might cause them to drift away. So, everything you offer between the top of the page and the call to action must definitely be worth it and can't create confusion or ambiguity. Have lots of ideas for persuasive intriguing hooks, messages, pitches... and ruthlessly discard at least 95% of them.
    • Make it as clear and unambiguous and eyecatching as possible. Even though you've led the reader straight to it, it's still possible they might skip it (especially if it looks like an ad) or not realise it's something they are to interact with.

More on the call to action button (since it's the most important thing). tldr: Lots of whitespace, big, prominent, logically positioned.

More on single-page design. tldr: base all your content on linear flow, and if you really need extra content, consider closable popup boxes and an unobtrusive, subtle navigation bar down the side.


If you need to present alternate options, a good tip is to not let them get in the way of the primary call to action. For example, you might tuck them away below the main call to action, reasoning that people who get that far will be people who are interested, but don't like the primary option for some reason.

For example, in charity fundraising call to action pages, they'll often lead the reader to a massive button that starts a pay-monthly direct debit form (the best form of charity income - you can use it to plan ahead) - then, after that, much much smaller beyond the big shiny tempting "Yes! Let's do this!" button, there will be options like one-off donations, gifts in wills, sponsoring events, etc.

You can't risk people thinking "Which of these options will I choose?" then drifting away in indecision and choosing none of them. But, sometimes you must have options for people who can't do the main option (e.g. if they can't or won't set up a pay-monthly direct debit with their bank for some reason). So, you place the alternatives where only someone who's thinking "I want to do this but I can't do that" will go.

share|improve this answer
add comment

Welcome to GD but in regards to your question it is very open ended and really cant be answered with an exact solution.

I am designing a one page site. I need to go back to basics and learn about how to translate business aims into a homepage design.

Look into Following A Web Design Process

Can anyone offer any tutorials where I can start implement the achievement of the business goals through the design. E.g. resources on call to action in a website / app design (it will be a responsive design).

My advice is search for single page design, such as this. I would also look into site-mapping, wireframing, and implementation. A Sitemap generator here. I hope this helps to get you started. If I miss understood what you are after please edit your question.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.