5 tips for an effective landing page to have better conversion

According to a Klipfolio survey, the average time spent by a user on a page is 52 seconds. We live in an information overload era, and all you have is 3 seconds to attract the user's attention. MIT neuroscientists found that the brain can identify images seen for as little as 13 milliseconds. To get that attention in 3 seconds, you have to leverage a clear information hierarchy and visual imagery.

Squint test is a popular UI design framework. When a user squints, they should be able to see the most important element first, the second important element next, and so on.

A typical landing page contains a value proposition, call to action, benefits, credibility/social impact, and visual elements/images that represents/describes the product/service.

Applying the squint test UI design framework to the landing page components, below are five tips to make an effective landing page:

1. For value proposition, use at least H3 font size (https://material.io/design/typography/the-type-system.html). E.g., Asana uses 45 px, and Hubspot uses 60 px.
2. As the font for value propositions is bigger, keep the message short and crisp - 6 to 8 words. E.g., Asana uses 7 words, and Hubspot uses 5 words.
3. Typically, a detailed text below the value proposition narrates how the product meets the value prop. This text typically uses Body font size. The H3 and Body font sizes difference makes the value proposition stand out clearly. E.g., Asana and Hubspot use 18 px for this text.
4. Use a visual image representing the product/service above the fold and to the right of value proposition. Eyes scan left to right usually and hence the order. E.g., Hubspot uses a short video that shows a happy user referring to contacts, and Asana uses an image that lists the benefits.
5. Use a clear CTA (call to action) button and any guarantee to reduce the friction if possible (e.g., 30-day free trial, No CC required, etc.). E.g., Asana uses a medium-sized and colored button, and Hubspot uses a larger white button against a color background.

When designing the landing page using the above squint test framework, the user sees the value proposition first, the image next, the detail, and CTA.

The best way to synthesize this is to observe this hierarchy in design-led or awesome marketing companies' landing pages. Please let me know your thoughts or observations.