A comprehensive heuristic framework for website landing experience

When a user lands on your website you have the tiniest, split-second window of opportunity before they hit the back button. Mostly this is based on a purely sub-conscious evaluation by the user.

The site needs to answer questions which they have but never consciously think: am I in the right place? Is it worth my while? Does it look dodgy? etc

What kind of web page would be the best for keeping your visitors on the site, progressing them through your experience and warming them up to eventually make a purchase?

Heuristic analysis is one of many methods of assessing the suitability of a page. I created this framework for understanding how to answer these questions.

What is heuristic analysis?

Heuristics are a set of principals which can be followed in a design process. They are based on a mental model - a kind of psychological checklist which needs to be ticked off if an objective is to be completed.

In this case the primary objective is clicking onward past the initial landing page/experience but the ultimate objective is eventual purchase.

Analysis involves an expert evaluation of the content/experience against the principals in order to uncover potential gaps and missing elements.

How to conduct and use heuristic analyses

It's not my intention in this specific post to guide you on the process, rather to provide the framework. However, there are a few important points to note:

• Analysis should be conducted from a particular perspective, by which I mean you should think of a particular segment of users. For example, generic paid search ads in a particular ad group, landing on a particular page, with a particular intention. You can then constantly refer back to that intention and assess how that user would feel from their perspective
• You should analyse the experience from different perspectives, but also on different devices, and of course on different pages/experiences. Small bits of copy and information can be very different in different places.
• Very importantly, heuristics are NOT best-practices. The ideas that come out of the analysis may work, but they also may not. The purpose is to identify things you can test. Also remember that these ideas are ultimately opinion - where possible you should be seeking other data and research in order to help prioritize which of the ideas to test first.

The process can be time consuming - and it should be - but it will be worth it. The aim is to analyse each principal in detail, based on a specific user as detailed above.

You can then score and summarize each principal. Where you have created different analyses for e.g. mobile and desktop, or different types of pages - it is then possible to make a comparison of these groupings, as per the image.

The framework explained

Relevant

If I click on an ad or any other traffic driving element which will land me on your website, the very first sub-conscious question which I will ask myself is 'am I in the right place?' - is this the kind of thing I wanted? Relevance is a product of:

Expected

Based on what I saw before I arrived here, is what I am seeing what I expected? Does the messaging, offer, product detail etc which I saw external to the site match what I am seeing now? If not, I am confused. For example, your PPC ad said 30% discount but your landing page says 20%.

Appropriate

Generally, does this site look appropriate to what I wanted? Does it scream out that this is providing what I need, or are there other products and distractions which are not relevant to what I wanted.

I searched 'van hire' and clicked the PPC link for Avis and arrived at this page. It says 'car and van hire' so I can obviously hire a van, but because it says 'car and van hire' it leads me to think that they don't specialize in vans. What you can't see below the fold is some copy which states that a new specialist van hire center has opened nearby - perhaps this should be more prominent? There are no pictures of vans - which would add to the instant recognition of relevance - and the CTA is to book a vehicle, not book a van.

Legitimate

Anyone can build a website and put it live. If I land on a site I have never heard of, there is every chance that it is dodgy or a scam of some kind. Particularly where your brand awareness is low, how are you demonstrating the legitimate nature of your business?

What claims can you make around the size, longevity or success of your business vs. others in the market? What elements of design will convey legitimacy and trust? Are all these things visible to me immediately when I land on the site?

Credible

You can be 100% legitimate and 0% credible. You could be a big multi-national company and yet everyone hates you. Credibility is evidence that other people think you are worth bothering with.

This could be testimonials or reviews, or just a review score from Trust Pilot or similar, but it could also just be statements about how many people buy from you such as 'trusted by 2 million UK housewives and counting'

Persuasive

Relevance guards against an instant click on the back button, but then you have to persuade people to bother investing a bit more time. The user has likely been to a few of your competitors who, let's face it, are all a bit samey, so how do you stand out?

Uniquely beneficial

If I search for something in google, and click the top 4 links, one of which is your site, why should I bother sticking around on your site and not one of the others? What makes you different and how do you communicate it?

This is ultimately about your value proposition. It is the simultaneously the hardest thing to do well and also the most important. You have to be different if you want to win over the competition, and you have to make sure this is clear from the outset. If it's buried near the footer of the site or even some other area, you have already lost. What is the communication of unique benefit which I see staring me in the face when I land?

I searched for 'mens shoes' and clicked the very first PPC link which is Lands' End - and arrive at this category page:

I've heard of Lands' End but I know very little about their products. I can see I'm in the right place and there are a selection of mens shoes, but what is their deal? Are they cheap? Are they designed for comfort? Who are Lands' End? Why should I stay here? Actually I think I might be a bit too young for the demographic based in the two shoes I can see, but if I wasn't is there a way that it could be more obvious the shoes are for me? Something about comfort?

Founded in 1963 - wow, so what? Actually this part rotates with other messages, but most are things like 'exceptional service' and 'pay by card' - I don't expect anything less than exceptional service so no point saying it. How would I pay if you didn't take cards. Cash??

It can be really, really hard to differentiate, but you have to think of this example experience: when someone lands who does not know you, they need to know who and what you are and why you are different, otherwise there is no reason to bother. I buy virtually all my clothes/footwear from ASOS, mainly due to the ease of buying a lot of stuff then trying it on and returning most of it - for me, personally, that is what the competition is. You need to persuade me it's going to be easy like that. That's just me though; figuring out what is most important to the majority of your customers is the starting point.

Reciprocal

Value reciprocity is the principal of give and take. I could easily go to one of your competitors websites; they sell the same stuff you do. What are you going to do to make it worth my while if I stay here? 

This is a psychological principal as much as a tangible one. You could offer me a real, exclusive discount, but you could also just tell me about free delivery or other elements of your pricing. The most important thing is that I feel like I am getting something from you that I might not get elsewhere, and the more special it feels to me the better.

Again, how are you communicating this instantly when I land on the site?

Likeable

You could have ticked all the boxes for me so far, and yet I still don't like you. This is pretty subjective and hard to gauge, but the aim is simply to identify whether there might be issues here you want to do further research on.

Likeability could be purely about design, look and feel. It could be about some ethical nature of what you do. It could also be about how you sell and whether that comes across as pushy.

Scarce

This ought really to say urgency and scarcity, which are different things. This is important for most websites, but particularly where your path-to-purchase and decision process is short. If someone is looking to buy something quickly, flicking around a few different websites, then you need to give them a reason to do what you want them to do now, as opposed to either going somewhere else or going away to think about it.

For example, are the prices going to increase soon? Is stock low on this particular product? Is there an exclusive nature to it or some criteria I need to pass?

I searched for 'adidas pulse boost' and clicked the organic link for JD Sports before arriving at this product page:

Firstly, let me say this is an awesome page and ticks virtually all of these boxes in one way or another. However, what you can't see here is that, on the desktop version, the discount shown also says 'reduced to clear' on it. That makes me think the stock is low and I need to hurry up and buy it. It isn't shown on mobile so you don't get that effect, it's just discounted.

But taking it further, why not actually say the stock is low as well? If they are reduced to clear there must be no more stock coming in, which means you can say low stock (and nobody is asking how much stock you have anyway).

Informative

So this website is relevant and you have persuaded me to investigate what you're selling, but are you giving me all the information I need to understand what it is and why I should buy it?

How easy is it for me to consume?

Comprehensive

What do I need to know to make a decision about whether to purchase this product? What does it do? Why is it different? How much does it cost? How much is delivery? How do I get it delivered? What if I want to send it back? etc etc

There are potentially a lot of different bits of info that are needed here, and it is a task to try and figure out what the most important things are for customers at this stage of their journey. The most important parts need to be displayed right here where I am looking. It needs to be clear where I will go when I want to find out the other stuff, and it should be there when I get there.

Digestible

Is it easy for me to consume this information? Is it simple and legible, or in dense paragraphs of writing written in grey font on a white background?

Do I have to search the page for it, or is it just there where I need it? Have you hidden it from me in concertinas?

Social

It's one thing for you to give me your sales spiel about your product - of course you're going to say it's the best thing since sliced bread - but it's another thing if I can see what real customers think about it; how they use it; and that I will be able to get their guidance if I need it.

Comparative

If relevant, can I compare different versions of your product or service? Is it easy for me to understand the difference between any options you are providing me?

If these differences are based on complex features, are you showing me in a checklist of what I get with one of them vs. the others?

Alternatively, do I need to understand how your product or service differs from what I might get from somewhere else? How easy is it for me to see that information?

I typed 'cheap broadband' into Google and clicked the PPC ad for TalkTalk before arriving at this page:

A great landing page in a lot of ways, but I decide to compare the 3 options I am given. When I look at the bullet points, I can see that the only difference between the first 2 is the speed. I've had to do a bit of work to figure that out and it could have been clearer, but the bigger problem is when I look at the 3rd option, which is the from rate from the PPC ad.

This one has no speed on it, so I can't compare it to the other 2. Also, because the bullets are in a different order, at first I didn't notice that it also says 'no set up fee' and thought I would be charged. It also says 'free broadband router' which now makes me think that the other 2 are not free as it doesn't say free, but how much will that cost?

A comparison table here with CTAs at the bottom might work better and is worth testing or at least investigating further

Personal

Again, if relevant, is what I am seeing personalised to me? This doesn't need to be personalisation in the grander sense, it might just be about taking a dynamic approach based on what you know from the ad or channel I came through. If I came from a social media ad, is there anything about what I already told you through my click that you are then failing to realise in the content, which is apparent to me the customer?

Clear

At this point I have made the decision to seriously investigate by getting into the checkout or just digging around a lot further but, given that, what is it I am supposed to DO? Is it clear what you want me to do? This is where usability comes into play

Guided

OK, sign me up! Wait, what am I supposed to do?

Are you guiding me to where you want me to go? Typically this is going to be a CTA link of some kind, or a form, or some other thing where I take some concrete action. But is it clear, or do I have to look for it? Does the wording make sense, and does it give me confidence about what is coming next or am I going to be surprised and confused?

I searched for 'bike service near me' and clicked the top organic link, which was Halfords, as I know there is one nearby. I arrive at the bike servicing landing page:

It ticks tonnes of the boxes already mentioned: it's relevant and well organised, and contains the detail I need. However I soon get a bit lost looking around different 'products' like service packs, free bike check, cyclecare - I'm not sure what I want!

Now, once you dig into it you will find that the first step of everything on this page is the same free bike assessment, which is where they will obviously discuss with you and tell you what you need. It does eventually say this towards the bottom of the page, but if it were much clearer and above the fold I would have just done it, because no obligation to me.

This also scores low on the 'uniquely beneficial' check above, because 'free, no-obligation bike check by one of our experts' is a massive selling point for someone not sure what they want/need.

Supported

If for any reason I am struggling, or it isn't clear what I am supposed to do, or I am unable to do what you have deemed normal for any reason, is there somewhere to get help?

Is there a live chat button, or a phone number, or just a clear help link?

Organised

Assuming I need to consume a lot more information which isn't present on the landing page, I need to navigate through that information, and I will approach that from the place I have landed.

This principal is about Information Architecture - how is your information organised? Is it structured in the same way that my brain structures and breaks down my task? Is it appropriate to the route I took to arrive at where I am?

I want to buy a two-seater sofa and a friend recommended sofology so I go direct to that website and land on the home page:

The picture is of a two-seater sofa, so that is excellent relevance, and this is a nice looking website and very inviting - and the 20 year guarantee is very compelling .

But there are these two different navigation bars at the top - I am mainly drawn to the lighter grey one. What do I click? I don't really know whether I want fabric or leather; I want to see both, so not that. I don't want a corner sofa, or a recliner, or a sofa bed, so none of those. I'm not bothered about sizing my sofa as the space is big. Hmm? Where do I go to see two-seater sofas? There is no option. The drop-down on the other menu is the same stuff, so not sure why both are needed, but doesn't solve the issue.

Easy

Is there any friction as I try to do what it is that you want me to do? Does it actually work or are there things that don't make sense? Is wherever it leads to what I was expecting? If a form, is it easy to fill in or do I have to think about it? Are you asking me for information which you don't need, or which is hard for me to go and find?

Focused

Is the next step the only option that I have, or is it presented within other, distracting options?

It's very easy to succumb to the idea that you should try and get all your offers, campaigns and promotions onto your key landing pages. It's even easier to let a load of different departments in the business stick their own objectives onto everything, but to a consumer I'm just confused about what it is that you want me to do. Keep it singular.

Accessible

This is accessibility in the sense that most people understand it: the chance that anyone can interact with the website despite level of impairment. If it is thought that this is an issue it may need a deeper study.

Conforming

Finally, does your website conform to the standard ways that I'm used to things working on the internet? Imagine if you had a physical store and you suddenly decided it would be cool to make people climb a ladder to get into the store?

Conventional

Are the buttons, iconography, design elements, fonts etc as I would expect based on what I am used to seeing elsewhere on the internet?

If nobody ever evolved anything how would anything improve, but there is a time and a place for that kind of experimentation, and your landing pages are not it. Of course you want to stand out with value proposition, brand, style etc - but don't mess around with the basics if you want people to actually do something quickly.

Empathic

Is the language you are using in your copy the same as the language I would use, or are you using a load of internal jargon which doesn't make any sense to me?

A good way to use customer-language is to look at how they speak about the product in reviews, live chat or anywhere else.

Consistent

Assuming that I carry on through the website, is everything else that I am about to see the same, in terms of the style and how it works?

If there is a header and navigation elements on the page where I landed, are these the same as the rest of the site or different?

It can be very jarring to suddenly find yourself in something different and reduces trust.

Viable

Last but not least, does it actually work, functionally and technically - or are there errors and broken things? This can sometimes be investigated better via data than through heuristic analysis.

Finally...

Always remember, these things are not best-practices, they are ways of coming up with possible test ideas, most of which need further validation and quantification before they become test ideas.

Opinion by itself is worthless, but when backed by other data and research becomes more viable.