10 landing page examples with awesome UX
Crafting landing pages that convert is no easy task. Here’s our snapshot of 10 landing page examples with awesome UX
There’s no magic formula to create a perfect landing page. Deciding headline and color are all but a few concerns when creating a landing page design that nudge users to do something. Justinmind took a look at what a few of our favorite companies have done when it comes to their landing pages and given our thoughts on what’s good and what could be tweaked.
Some landing pages perform better than others but great landing pages strike a balance between well considered design, legible typography, sufficient content length and persuasive call to actions – all making up the landing page anatomy, if you will.
There’s a lot that goes into a landing page that converts so constant tweaking and tinkering is necessary to ensure you get the conversions you want. Yep, that means being meticulous over which shade of red to pick for your call to action button. Watermelon pink, anybody?
Here are 10 examples of landing pages with awesome UX:
Overall Airbnb has a seamless user experience but their Become a Host landing page is beautifully designed. It’s minimal, easy to look at and uses a lot of white space. The use of green is associated with money and that’s exactly what a host can expect to get by using Airbnb. It’s possible that the smart color choice makes this a landing page that converts.
What’s great about this landing page is it hones on how much a host can earn in their city so instantly potential hosts have an idea of what sort of income they can expect when using Airbnb.
What’s good: Warm photography, choice of color green, highlights the clear benefit of hosting.
What we’d A/B test: Color choice of the CTA
Calm, the meditation company, evokes feelings of tranquility with their landing page design. The relaxing mountain scene uses video effectively with the slow ripples in the water reinforcing the whole ethos behind Calm. Not only that but using video on landing pages increases conversions. Their headline copy demystifies meditation and the call to action informs users that it’s a free service. How’s that for calming?
What’s good: Minimal design, calming animation, relaxing color choices
What we’d A/B test: Alternative videos
Spotify’s Premium subscription page is dynamic and colorful, representing the wide array of music the service offers. Color profoundly affects how we interact with the world and this even plays a role in landing page design, as Unbounce outline here. The landing page does well by highlighting the main features of premium as well as the 30-day free trial for those who haven’t tried the service before. The main copy, although direct, is a little weak.
What’s good: Bold call to action
What we’d A/B test: Headline copy could be improved
For those looking for minimal landing page inspiration, Squarespace has you covered. Squarespace’s user experience is very minimal and focuses on its beautifully crafted websites. The claim your domain landing page uses video in a similar way to Calm, however, the video isn’t bright nor distracting. It adds an element of energy as users are prompted to type their desired domain name in a large, input box.
The rest of the landing page is white and crisp, as expected from Squarespace. Using refined animation and simple black and white text enables Squarespace to convey their message clearly.
What’s good: Minimal, coherent design and colors, use of white space
What we’d A/B test: Try adding icons to the features for enhanced visual communication
Shopify, the ecommerce platform, uses clear and direct copy, explicitly telling users what they can expect from using Shopify’s services. The imagery helps to explain the message further and creates cohesion with the landing page design.
The page is also peppered with impressive statistics and testimony from happy customers which helps to reinforce Shopify as a trusted platform for your selling needs.
What’s good: Illustrated icons, well written copy, consistent CTA
What we’d A/B test: Bring the features higher up in the landing page design
Download Justinmind and prototype your landing page designs
Deliveroo uses bold and vibrant color choices on its landing page and has beautiful food photography to entice the user to write in their postcode to find nearby restaurants.
The copy is strong throughout the page and is written in a familiar and friendly tone. The Deliveroo logo is scattered on the page to reinforce the recognition of the brand.
What’s good: Large, popular tags to help users decide more easily, effective photography
What we’d A/B test: Layout of the menu section could be optimized
The Mercury Reader transforms web pages into clean text. As websites become more bloated with unwanted ads and frustrating popups, Mercury saves the day by helping users read without distraction.
In that vein, the landing page for Mercury is distraction free, dark and has its newest feature placed in the middle of the page – their new Chrome extension – with a big CTA to boot.
The dark user interface makes the orange color choice pop in all the right places.
What’s good: Use of dark color makes the page distinctive, highlights new features
What we’d A/B test: An animation showing the extension in action
Soverin is a private mailbox. With security risks and hacking on the rise, Soverin offers peace of mind with their advertisement free mailbox. They won’t sell your information on to third parties either.
Custom illustration and the Lisa character helps to build a narrative on Soverin’s page and appeals to those concerned with their online security.
Right away users can claim their desired email and Soverin has placed how much their service costs right under the call to action.
What’s good: Art direction is friendly and whimsical, displaying the price
What we’d A/B test: Clearer headline copy highlighting the benefit
Nuage uses playful copywriting which helps to humanize the brand and in turn makes them more likable – which could to lead a positive impact on conversion rates. It isn’t the easiest thing in the world to make domains interesting but Nuage pulls it off.
The font choice and muted colors make the page easier to read. Paired with minimal but clear copy this landing page design is simple to understand and easy to navigate. However, getting a conversion copywriter may help Nuage as the headline could be stronger.
What’s good: Minimal, inoffensive design and fun copywriting
What we’d A/B test: Change the headline as it isn’t relevant to the product.
Blue is a color associated with peace and dependability. Casper, the mattress company blowing up all over the internet, uses blue all over their branding. After all, don’t you want peace when going to sleep from a company you can depend on?
What’s great about this landing page is the copy is coherent and the theme of sleep is used throughout generating consistency across the website. The changing statistics add dynamism and pique interest.
It’s important to have elements that compel your user to do something and Casper manages that with their landing page.
Casper also uses endorsements from big companies like Amazon and Google. A mattress is an investment so testimony which helps to nurture trust for customers during decision making process.
What’s good: Clear and consistency design and branding
What we’d A/B test: Have a click-through to the positive reviews to improve impact
Landing page trends for great user experience
Minimalism and long form one pagers continue to reign when it comes to landing page design in 2017. Coupled with direct call to action buttons, these landing pages are designed effectively and capture attention. Auto-play full screen video and animation are also becoming more prominent across the web so keep your eyes peeled for more videos appearing on your favorite landing pages.