Anatomy of an Authoritative Wireframe Landing Page
If you read the couple of paragraphs written by you, you’ll get a fair amount of idea that to optimize conversion you need to prepare a couple of versions of the design (using your best knowledge and experience) and test them with real users.
What’s most important though is: how to wireframe a landing page so your team will actually understand the importance of testing.
Here are some tips to design your wireframe landing page:
1. Wireframe a first version of the landing page
We see a lot of landing pages using a classic layout with a picture on the left side and a call to action on the right.
The reason for that layout comes from the knowledge gathered by psychologists working in the field of advertising.
In a series of research, psychologists proved that an image placed on the left of the advertisement text (e.g. on a billboard or press ad) provides the easiest situation for your cognitive system to interpret.
The right hemisphere deals better with images than the left hemisphere. Since our vision neurones are crossed – an image processed by the left eye goes directly to the right hemisphere.
Does this mean that the layout above will always better the one with an image on the right, or at the top? No. Though the neuro-argument is quite strong, it doesn’t mean that the conversion rate will definitely be higher.
It just suggests that the image and text will be quicker processed, therefore there’s a chance that with a great, meaningful image and copy, your landing page will perform better.
One should still test this in the specific environment that is formed by the design and the users.
2. Provide the team with arguments
It’s great that a person decides to test various versions of the design. However, it gives the teammates a lot of new work to do. They will most probably criticize everything that you do.
Unless you actually provide them with reasonable arguments, there will always be criticism. So, it is important to always explain your proposition and decisions.
Team will actually see your thought processes about the design and where you see chances for optimization. People readily welcome such information. They kind of feel that they are a part of this optimization process and are just better motivated.
3. Clearly mark the versions of your design
Many people usually use a site map to store the versions of their design that are about to be tested simultaneously, marking them with the appropriate version number and a title.
Since you can literally generate hundreds of versions, it’s really important that you always design based on your knowledge, not just the mathematical possibility of multiplying the design.
Therefore, the effect of a contrast might be more significant. What’s more, the whole layout will be weighted towards a headline and say, two bullets, which are very compelling.
In some cases, this might be a very persuasive layout for a wireframe landing page. If a certain version of a design gives you some idea of a hypothesis which is small but worth testing, create a dependable version.
People purposefully reduce the contrast between the content and call-to-action button, to check if users, forced to focus less on a button and more on a headline copy, would convert better. It’s a kind of version control system.
4. Always share the results with your team
That’s the golden rule – always share and discuss the result of an optimization test of your wireframe landing page with the whole team.
Let them see what works and what doesn’t for your users and teach them how small things can affect business. It’ll pay off with great motivation, and understanding of the users and the design.
There are no miracles in the art of optimizing a wireframe landing page – just room for hard design work and a lot of testing.
It actually gives you super-hero power. No tutorial will outsmart you and replace your experience. So get out there, and design an attractive wireframe landing page.
You can start creating, building and publishing the best wireframe landing pages in Minutes! with our Lander templates.