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.
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.