10 design tips for a better landing page
I am predictable. I am not really flashy and if we ever meet, you’ll know exactly what I stand for in a few seconds. No, this is not my dating profile, but everything I would like in a website.
Have you ever had a quick surf in the evening? Hunted for a bargain or a last minute weekend break? You may have had a long hard day at work, chilling in front of the t.v. or have the radio playing in the background. But wait – you land on a page from a Google search and you are thrusted into the middle of an unfamiliar site. You see bright colours and a Flash animation that looks like it belongs to the Battlestar Galactica. You feel like a seizure is coming on. A track from Prodigy suddenly starts blurting out and you can’t find a button to turn it off…so what do you do? The easiest thing – hit the back button.
Well here are my top 10 tips to consider when designing a website:
1 – Make it clear what your site does
If you land on any page of your site, is it clear what the site is called and what the site does? A strapline can be just a few words, but will tell your user what the whole site is about and adds confidence that they should be sticking around to explore more.
2 – Show the benefits
A user can afford to be selfish. If they can’t see the immediate reward of clicking further into your site, they will go elsewhere. It is critical to show the user your USPs (Unique Selling Points) in the first 8 seconds of them landing on your site. Try summarising with a few bullet points as to why they should stay on your site.
Moo.com have got it right with a great product range shot and a few bullet points summarising the benefits, leading the user to the conversion point, which in this case is to choose their desired product.
3 – Remove those FUDs (Fears, Uncertainty and Doubts)
Is your site secure? If it is, chances are you are not showing this off to it’s full potential. Within the top 100 online retailers 56% don’t display any badges to show that their site is secure, yet studies have shown doing so will increase conversion rates by an average of 13%*. It makes your user feel secure and confident about continuing their journey on your site. The same logic applies to email sign-up marketing. Inbox spam and ‘affiliate marketing’ are pains in the rear, so there are always going to be uncertainties about handing your email address out. Let the user know that you take their details seriously, and will keep their information safe and spam free. It builds a better relationship with them and makes them enjoy the full experience of your site.
POA (Point of Action) reassurances are also a must when keeping your user confident that you can deliver. Toys’R’Us have got it right with their ‘Add to Cart’ area, giving the customer related information on delivery and the ability to add to various wish lists.
4 – Flash and Music…really?
Let the user have control. As a general rule, I don’t use flash unless it is absolutely needed, like telling a necessary story that is unable to be communicated with a simple illustration. But even in that case let the user know that they are clicking on a video, and give them the option to control playback and sound.
Apple do this really well – making a clear CTA (Call to Action) and giving the user the ability to decide whether they want to learn more themselves, instead of ramming it down their throats. A lot of sites believe that if you have a 60 second video the user will watch it all and after they will know exactly what the business is about – this is not always the case and can be remedied by having just a few bullet points to summarise.
5 – Know the time and place!
So your user has browsed your online shopping store, they have added their items to the basket and made the decision to check out. The user is now on the last page of the process and finishing off – but hang on – right by the ‘confirm purchase’ button you tease them with ‘related items’ and bang – they get distracted, leave the order, consider starting the whole process again, get frustrated and worst of all you’ve lost your sale.
Think page by page, “What do you want the customer to do at this exact point, on this exact page?” Do they need to see the ‘returns policy’ on the first page? Shall I show them a product review early on in the process? What button do I need them to click, is this helping them towards their conversion point?
I do my online banking with Natwest (name and shame) and once logged in, I get asked to check if my email address is up to date. Now I think that’s really efficient…for the first time. But since then I’ve logged in 1001 times since, every time I see it, I feel more annoyed! Bad user experience can leave a bad taste…
6 – Keep your forms short and friendly
Chances are you’ve taken one look at a form and thought “Oh boy!” Or if you’ve decided to tackle it, got to the bottom, clicked to move on and been catapulted back to the beginning of the page and told in big red letters how stupid you’ve been. This can make someone feel foolish, add valuable time to the process and start to dip into the enjoyment bucket of the user experience.
The first rule of designing a form is to remove any fields that aren’t 100% critical. Tests we’ve done here at ConversionWorks have shown that by removing 50% of the fields have increased as much as 50% of conversions.
7 – Show them the way
So you’ve got your amazing design, great illustrations, texture, flash fonts, bevel boxes and gradient city, but you might have actually lost the meaning of the page itself. Generally you will have 1 main conversion point for that page (maybe a couple more). It could be a button to take the user to the next page, a form to fill in or a white paper to download, but don’t lose the bigger picture and help guide the user to where you think they should be heading.
The example below shows the ‘before’ at the top and the ‘after’ underneath. Isolating the CTA and giving a contrasting colour makes it stand out and guides the user to the next step.
8 – The We/We Factor for Headlines
Everyone likes to talk about themselves – so let the title speak to the user as an individual and not what you are saying as a company.
A great bad example is an American Based Wine Retailer. The top image shows the ‘before’ advertising (that they go to Bordeaux for their wine); whilst the ‘after’ image shows what they could be saying! Speaking directly to the consumer makes it easier to engage your audience and let’s them feel part of the site.
9 – Hero Images vs Supportive Images
Getting images right is absolutely key. I don’t say this just because I’m a designer, but because analysis proves this theory. A low quality image can put people off. A high resolution image could take too long to download. Ask yourself “Does the image aid you in your conversion point?” Despite the mis-leading name, you need the ‘Hero Image’ to be a ‘Supportive Image’.
The ‘before’ image, below on the left, shows how your attention is drawn to a pretty face but naturally your eyes follow hers and directed off to the right and off screen. The ‘after’ image, on the right makes you first look at the model, but through the positioning of her eyes, your attention is drawn to the CTA which is highlighted and guides you to the next point of the journey. Don’t get too caught up in the image itself and realise why the image is there in the first place!
10 – Test, Test and Test again
Designers can sometimes have a tough life as their work can be subjective. Trying to convince a client (despite their 2 year art class 25 years ago) that you have more experience with design and the medium of the web can be exhausting. However well you understand your end user, decisions you make might not always be 100% correct.
Be confident that you’ll be in a better position after each test, gaining knowledge on what works and what doesn’t. Testing can help prove your thoughts and creative hunches on design elements, getting those bounce rates down and conversions up.