Landing Pages Wireframing and Information Hierarchy

In this article, we want to understand what's information hierarchy and wireframing and why it's essential in landing pages, how you can structure a logical and practical information hierarchy that helps you to decide how much content you would need, and in which order to present it, how to use it to address the questions, barriers, and motivations of your target audience for them to take action.

What is wireframing?

It is a visual guide that represents the skeletal framework of a landing page. It has to be aligned with the objectives of that page and meet industry standards.

At this point, we are conceptualizing the page, getting an idea of where and goes across the web pages, and we will only bother a little with the colors, images, videos, and so on. It gives you a clear picture of what your landing pages will eventually look like.

There are many ways of wireframing, whiteboards, pieces of paper, software, etc. At this step, you should focus on getting the basic structure rather than diluting yourself with shiny things.

Your information skeleton

A wireframe can be as long as it's relevant and concise to address the core issues and convert your visitors into buyers. It is impractical to think that the landing pages should have the minimum amount of web copy or not too much information because the online audience will need more time to read. It primarily depends upon the conversion scenario or product niche you are selling.

There is a big difference between downloading a free app and buying an expensive and technical product. In the latter case, you would need a lot of background information and make a rational decision before making a purchase.

Having a lot of information doesn't mean it would become boring because you have put different data sets into other places across the landing page.

Case study

Unbounce a test run to explore whether a detailed landing page would perform better or worse. The variant was double the amount of the control. After four weeks, 577 conversions, and a statistical significance level of 99%, there was an uplift of 157.67% in CTR and a 52.23% increase in sign-ups. This simple test shows how valuable it is to give more details on your landing pages.

The findings from the case study were that many users needed to get the answers to the questions they had previously. They weren't converting because they didn't have enough information to decide to make a purchase.

It shows how long landing pages can't perform better, but it does not mean that they must always be this long. Instead, it depends on the context.

Be screenful vs. full page

Another point is to consider thinking in terms of screen views instead of the full page view. The first view of a visitor will be the above-the-fold content, for example, while the majority of us think the visitor sees an entire page by default (without scrolling any further).

In the first screenful, you want to ensure the people are manageable. They should be clear about finding the information that they are looking for.

Your first screenful might need clarification if you have too many options. You can test the user's reaction to your landing page with a 3-5 seconds test, where you will show them your page for 3-5 seconds and ask them what they learned from it. Two questions you can ask in this survey are: what do you think this landing page was about? And what is the goal of this page?

Too much information creates confusion that contributes to a higher bounce rate because it's unclear; too little information causes irritation that also leads to a higher bounce rate which can create mental friction of the questions that somebody needs to clear before making a decision.

The information hierarchy makes you have the right balance of information.

How to build IH

You will need to start by asking three simple questions:

1. Who are you communicating with?
2. What do you want them to do?
3. Where is the traffic coming from?

You can translate it into your target audience, goal, and source. Now, let's look at it one by one.

Target audience

It would start by looking at the severity of the problem-aware audience. A problem-aware audience is those who know the problems but need to know that there is a solution. A solution-aware audience is those who know the market solutions but have yet to see your answer. Then some are aware of who you are but need to figure out if this is the right fit for them. Lastly, some know your product and find it helpful to buy.

For example, when you visit a landing page that explains the basics of what the audience might be looking for. Such as an explainer video of car insurance; even when the audience knows what car insurance is, this information is unnecessary. On the other hand, if your web copy explains why the visitor should choose your business solution over the others, this creates a connection with them and make the information more valuable.

When the audience is only problem aware, you will have to have a lot of content that inspires them to buy from you, but if they are most aware of the problem, solution, and product, they only need the least amount of content to influence their decision.

Your landing page goal

The next question is what action or set of activities you would want them to take, which is the goal of your landing page. There is a big difference between different asks and value positions relating to them.

With a free app download, there are only a few risks, and no cost is involved, which is very different from inviting someone to buy a 1000 dollars product. In the latter case, you will need a lot of background information.

The complexity of a product, effort, cost, and risk would require a lot of content on your landing page, which is opposite to a simple free app download asking for no money, involving zero risk and an essential product.

Source of traffic

There is a big difference between traffic from newsletters, banner ads, social media, search engine organic, search engine paid, LinkedIn InMail, etc. Each of these sources has different types of visitors from them.

Your newsletter users are aware of your product, they must have shown interest in it or said yes to asking for more information, and they have some background knowledge about you or your product.

On the other hand, a banner ad has little or no knowledge about your brand, they have yet to show interest in your ad previously, and they might not have any background knowledge about what they will experience a few seconds ahead of them.

In a nutshell, you should address your audience's questions, reinforce their motivation, and address any barriers.

Working backwards

You can have an approach to work backgrounds. In the first step, you to think of the goal of your landing page; second, you can give them your offer; third, you will show your brand; and lastly, show them the summary or introduction.