Enter your search

The ultimate guide to designing a high-converting landing page

By
How to design and build an effective landing page, with a free template and 50+ examples

landing page design best practices

If you have a website then you already have a landing page – it’s your homepage.

When visitors land on your website, they will often only spend seconds there before deciding to leave. From our research, 96% of website visitors tend to leave most websites within 20 seconds.

You don’t have long to convince anyone that you’re the right product or service for them – so designing and building a great landing page is crucial.

We’ve been running GoSquared for years, and in that time we’ve designed and built hundreds of landing pages for ourselves, and for our customers.

We’ve made tons of mistakes and learned a lot along the way, and so we finally decided to share our learnings with you so you can jump straight to greatness in your journey to building a high converting landing page.

This is a huge and extensive guide, so we’ve broken it down into a series of sections:

  • Define your value proposition
  • Homepage vs landing page
  • A landing page design template you can use today
  • Build trust
  • Get feedback on your landing page
  • Types of landing pages
  • Measuring the success of your landing page
  • Have a plan for the rest of the journey
  • Landing page resources
  • 50+ examples of landing pages

Define your value proposition

design your value proposition

Good landing pages are extremely clear. They don’t necessarily have to be hugely innovative in terms of design.

In fact, the best landing pages follow a pretty well-trodden template that is easy for visitors to read and understand.

A high converting landing page starts with clarity – and that starts with words. What is your value proposition? What are you offering that no one else is?

A landing page design template

landing page design templates

Navigation

Thankfully if you want to dive deep on designing great navigation for your landing page, and for your whole website, we’ve written an extensive guide on how to design website navigation.

Title

It goes without saying, but the title of your landing page needs to grab the attention of the reader – it’s possibly the only thing they’ll read. If you get it right, it could be the first thing they read before ultimately making a purchase!

Your title needs to be set in a large, easy to read font – it should be the largest text on the page.

The copy of your title is critical and ties back to what we were covering earlier in the “defining your value proposition” section.

Subheading

If the visitor reads your title, then perhaps they’ll consider reading your sub heading too – it’s the second most important piece of copy on your page.

Your subheading should build on the title to clarify the attention-grabbing headline to tee up the visitor to want to learn more and ultimately click your call-to-action button.

Social proof

If you have customers, you can build social proof.

If you are fortunate enough to have already won a well-known customer or two, get their logos on your page as fast as you can.

It’s incredible how often this key element of a landing page is forgotten in the race to get a page live. Social proof takes time and effort to gather, but the result is dramatically increased credibility, and an ability to handle objections from visitors without having to speak for yourself.

Just let your customers do the talking.

Good questions to ask existing customers include:

  • What were your concerns when you first signed up for our product and how did you overcome them?
  • Why did you pick our product over the competition?
  • How would you describe your product to a friend?

These questions will hopefully lead to some powerful quotes that you can add to your landing page to effectively address any common concerns of visitors before they hit the “back” button.

Call-to-action

We recently wrote the ultimate guide to writing and designing effective call-to-action buttons (CTAs) – it’s been read by thousands of people and shared all around the world by some of the most influential designers and marketers out there.

If you’re keen to learn more about call-to-action buttons and want to see a healthy selection of examples, then we highly recommend you check out that guide.

Read our ultimate guide to Call-to-Action buttons

Features or solutions

Chances are you’re closely connected to your product or service – you know every bell and every whistle you have to offer.

But when it comes to creating an effective landing page, you need to step away from some of the details – you need to focus less on “what” your product does, and more on “why” it matters to the people viewing your page.

For example, here at GoSquared, it’s great that we have so many features in our live chat product –and that it’s beautiful and easy-to-use.

But most people outside our team don’t really care about these details.

Most people care about how GoSquared can make them more money, how we can help their team be more productive, and how we can deliver measurable improvement to their conversion rates.

As an exercise for your own product – try to describe why it’s helpful to someone without specifically calling out any features. Focus on the “why” and you’ll go a long way to writing more persuasive copy for your page.

Call-to-action (again!)

Repeating your call-to-action rarely hurts. What you see as the creator of your landing page is very different to what a visitor will see. Remember that you only have seconds to grab the attention of a visitor, and to encourage them to consider your product or service.

Repeating a call-to-action can sometimes feel, well, repetitive when you are creating a page or any kind of website. But remembering that visitors may be jumping around and spending mere seconds, will likely make you feel more comfortable repeating your call-to-action at least once to ensure the visitor is never far away from taking their next step.

Footer

The footer of your landing page is valuable real estate. If someone makes it all the way through your landing page, they’ll end up bumping into your footer and potentially rest there for a few moments.

Given your landing page is focused on encouraging the reader to take a specific action, you want to try to avoid distracting the visitor with links and copy that could alienate them.

For instance, many larger websites have a huge number of pages and have a form of site map in their global footer. For your landing page you want to avoid putting any unnecessary links in the footer that could take a visitor on an unintended path.

Your footer, though, is an opportunity to add further reassurance for visitors – for example:

  • Add the date of when your business was founded to reassure people you are here to stay.
  • Show a “total customers” count to remind visitors they’re not the first to ever buy from you.
  • Show a star rating from a review site to add credibility.
  • Especially if you’re making a physical product, show where your product is designed or made.
  • Your footer is an opportunity to add further reassurance – it doesn’t need to be white space.

    Build trust

    building trust with your customers

    You know your own brand better than anyone, and while you may be the most honest, most friendly, most helpful business owner in the world, your visitors and potential customers don’t know that.

    Your landing page needs to take someone from having never heard of you to trusting you enough to give you their email address, or potentially their hard-earned money. There’s no better way to build trust than to let other people do the talking – like your existing customers and well-respected publications and review websites.

    Reviews, quotes, star ratings, and logos all help to add credibility to your proposition. But even if you have great feedback, you don’t get to share this credibility with the world unless you put some serious effort into funnelling that into a place on your website – on your landing page.

    Show ratings

    Showing ratings from review sites such as Trustpilot, TrustRadius, and G2 Crowd is a great way to show your prospective customers that you’re trustworthy can care about your customers – assuming the reviews are good that is!

    You can often embed a widget from these websites to make it easy to display a live update of your star rating along with the number of reviews you’ve received.

    Alternatively, if you are more design conscious, you can use an image editing program to make your own stars and fit them to the design of your website, linking clearly back to the respective review site they reference.

    Show badges and awards

    How many times do you see or hear an ad that mentions “award-winning” in the tag line?

    Don’t underestimate the reassurance prospects can gain by seeing that third parties recognise your business and your products and services. “Winner of the award for best customer service in the industry!” is distinctly more powerful than “We love to serve our customers!”.

    Show press mentions

    While not from customers, even the sign of a familiar logo on your landing page can be reassuring to visitors. If you’ve been written about or even mentioned in a credible publication that your audience will be familiar with, then this can be a great way to quickly build trust from zero.

    Get feedback on your landing page

    get feedback on your landing page design

    Your landing page shouldn’t be a secret – once you have a workable set of images and copy, get it in front of people as soon as you possibly can.

    Don’t be shy – getting feedback from people will help you improve your page substantially. It’s far better to get feedback from friends and colleagues at this early stage before you spend money and energy driving visitors (and potential customers) to your page.

    If you don’t get feedback early, you’ll just be throwing money away later.

    Send it to friends and colleagues

    The moment you have your key elements nailed down, send your page to friends and colleagues you think will be willing to give feedback. There’s no reason not to!

    Even just a preliminary round of knee-jerk responses from people you know will help you understand more about your landing page.

    For instance, if you’re anything like us, when you’re putting together your landing page you’ll be uncertain about certain copy or illustrations and photography.

    Getting your page in front of anyone else will help you establish if those concerns are shared by others or if there is a totally different set of concerns you’ve missed because you’re so stuck into the making process.

    Do a user test

    We’re big fans of user testing at GoSquared. We even put together a guide on how to do user testing on a tiny budget.

    You can learn more from a few user tests than you can from a thousand surveys or analytics reports. User testing quickly reveals big problems, often offering inspiration and ideas for how you can fix those problems.

    You don’t even need a complete landing page before carrying out a user test – you can do a quick and messy user test with your key value propositions on paper, and gather feedback from real people on what resonates and what doesn’t.

    Put live chat on to get feedback from actual visitors

    Even once your landing page is live, and visitors come flooding in, your page is still not complete.

    Especially early on, your visitors will likely have questions that aren’t answered by the page, and have objections that aren’t handled by your existing copy and quotes.

    Putting live chat on your landing page will help you both gather this feedback and respond in the moment to avoid losing out on potential customers. The feedback you gather via live chat can be a treasure trove of ideas for how to improve your page – just make sure it’s noted down and methodically recorded so you can turn the feedback into actionable changes and improvements.

    Not sure about using live chat just yet? Thankfully we have a guide highlighting 16 benefits of using live chat.

    Types of landing pages

    different types of landing pages for different purposes

    Visitors can land on many different pages of your website. Perhaps you only have one page right now – that makes life easier to some extent.

    If you have a larger, more established website, though, you will have multiple landing pages that each must cater to different needs, and each will likely benefit from being designed to drive different outcomes for the visitor.

    Home page

    Your home page is the one landing page every website has – and it tends to be the broadest.

    People can visit your home page for a wide variety of reasons. Ideally, people are there to consider purchasing your product, but they might also be there with an intention to read your blog, to find out if you’re hiring, or to sign in to their account.

    Your homepage often has to cater to a lot of scenarios, so can risk becoming a jack of all trades, and a master of none.

    Product pages

    If you sell multiple products, then it makes sense to think about each product having its own landing page.

    By giving each product its own landing page, you can focus the attention of the reader on the specific reasons they should purchase the specific product, and address concerns that are more specific than you could possible convey on a more versatile page like your homepage.

    Persona or solution pages

    Many companies in the world of tech have products that appeal to wide audiences.

    When you appeal to many people, you can risk delivering bland, boring messages by trying to please everyone. A popular way to address this issue is to create landing pages for each key persona or solution you sell – so for instance “Product X for Marketers”.

    By focusing landing pages around key personas, you can make your product fit like a hand in a well-made glove and use the terminology and examples that will make your prospect feel more confident that you’re the right choice.

    Measuring success

    measuring the success of your landing page

    “Half the money I spend on advertising is wasted; the trouble is I don’t know which half.” – John Wanamaker

    If you’re putting in the effort to create a landing page, then you need to ensure you’re aware of the impact it’s having.

    If you’re new to measurement and analytics, you might want to take a look at our free ebook on the fundamentals of web analytics.

    What is the purpose of your landing page?

    Measurement and analytics can get very technical very quickly, so it’s important to start with the basics – just try to nail down what the purpose of your page is. What is the primary outcome you want visitors to take when they reach your landing page? Whatever that outcome is, you want to find a way to measure it.

    Common outcomes to measure for landing pages include:

    • When a visitor fills out a lead form in order to receive an ebook or another resource.
    • When a visitor signs up for a trial of your product.
    • When a visitor calls a phone number on the page to talk to a salesperson.

    Once you have figured out how to measure any of these successful actions occurring you just need one other piece of information to give you a conversion rate: the number of visitors who land on your page.

    Most landing page builders will have a way to measure the number of visitors to your landing page, but you can also use other web analytics tools (we may be slightly biased but we hear good things about GoSquared Analytics) to give you a number for how many visitors land on your page every day, week, or month.

    A/B testing

    You have probably heard of A/B testing because it’s key to how many large businesses make decisions about how their pages should look and read. The most infamous example of A/B testing is Google testing 40 different shades of blue on the links in search results to see which shade would encourage the most clicks.

    Most businesses aren’t Google. Or Facebook. Or Amazon.

    A/B testing is often promoted as “the right way to make decisions” because some of the biggest and most successful companies employ it extensively to improve their conversions and ultimately make more money.

    However, most businesses have a fraction of the website traffic that these larger companies have, so the trust you can have in the results of any A/B test is often dramatically lower.

    A/B testing won’t give you an idea for a landing page, but it can help you make a decision between two very good ideas.

    For example, if you have two headlines for your landing page, or two ideas for the layout of your hero section, running an A/B test to establish which version leads to a higher conversion can help you decide.

    Words of caution for A/B testing beginners

    A few words of caution for anyone dipping their toes in A/B testing, though:

    • Be crystal clear on what you’re testing for – what metric are you using to define the most successful of A or B?
    • How long are you going to run your test for? The longer you run a test, the more conclusive it can be, but then the longer you may show a poorer performing version of your landing page to a subset of your audience.
    • The more versions of your page you test, the more traffic you need to get to your page to ensure the test is conclusive – every version of your page means splitting your traffic.
    • Try to test truly great ideas – a danger of building a “Just do an A/B test” culture is that you get lazy, and spend less energy on writing great copy, or producing great illustrations and imagery. Remember your page needs to appeal to humans, not just algorithms.

    What to test

    Having said this, A/B testing can be used very effectively to improve the conversion of your landing pages. A few elements that make sense to test:

    • The heading
    • The subheading
    • The layout of the hero section
    • Your call-to-action button text and colour

    Have a plan for the rest of the journey

    know the customer journey

    The landing page is just the start of the journey a visitor makes to becoming a customer.

    Your landing page may be to drive someone to purchase a product, it may be to download an ebook, or it may be to start a trial of a service you offer. Regardless of the outcome, there is always a next step, so bear that in mind when designing your landing page – it’s not just a single page, it’s a step in a flow.

    We tend to find that mapping out the experience and full flow of a visitor is helpful – grab a white board of a piece of paper and just story board out the steps of how someone gets to your landing page, and what happens after visiting your page.

    What happens when the visitor drops their email address?

    The chances are high that on your landing page you’ll be asking for email address from your visitors. Are you clear both with your visitors, and with yourself, about what you will do with that email address?

    We’re now living in a far more privacy-conscious world, and one where GDPR is in force, so it’s critical to be clear about why you are collecting any personally identifiable information (PII) and what you are doing with that info.

    • Will the visitor be signed up to a mailing list?
    • Will they instantly receive an email containing something they specifically asked for?
    • Will your sales team be in touch via email?

    Retargeting if the visitor leaves

    Even if you’ve made the best landing page ever, the majority of visitors to your page will still bounce off it without giving you details of any kind.

    While it’s an increasingly controversial advertising method, you can use retargeting (sometimes called remarketing) to advertise to visitors on other websites if they leave your landing page without converting.

    To be clear on what retargeting is – these are the ads that “follow you around the internet” when you are looking to make a purchase – like when you were thinking about buying that new mountain bike, went to the online bike store, and then keep seeing mountain bikes popping up in your Facebook News Feed, Twitter Timeline, and on random websites where you’re reading about whatever you want.

    Retargeting isn’t inherently bad or evil – it can be helpful and can definitely be impactful. But it’s worth bearing in mind the two sides of running ads like this. Sometimes when businesses chase conversion rates and growth at all costs it can sometimes turn away the very customers they’re hoping to attract.

    If you want to dive deeper on retargeting, check out our guide on how retargeting can help you reach more of your audience.

    Landing page resources

    landing page resources, landing page examples and inspiration

    Unbounce

    Unbounce was one of the first landing page builders and remains one of the best – with a huge range of features for marketing teams of all sizes to create effective pages without writing a line of code.

    Instapage

    They call it a “post-click experience” platform. Whatever you want to call it, it’s still essentially a landing page builder. And a good one at that.

    Leadpages

    A fully featured landing page builder, with a host of other features to help you boost landing page conversion.

    Land-book

    A continuously updated site with heaps of landing page examples for your inspiration.

    Webflow

    A design focused website builder that enables you to build professional looking sites (genuinely) without writing code.

    Crazy Egg

    A heat mapping tool to show you where visitors are clicking on your landing pages. Very useful to see if parts of your page are confusing visitors.

    Examples of landing pages

    Here are a few of our favourite landing pages out there. If you’ve come across a good one, let us know and we’ll add it to the list!

    1. Stripe

    This landing page for Stripe Payments doesn’t overwhelm you with too much information. Instead, it’s easy for visitors who want to start right away to get started (or talk to someone), and if you want to browse more you can with the links highlighted in purple.

    Stripe landing page guide

    2. Notion

    This is a clever landing page from Notion which is targeted at people considering switching over from a competitor. The page let’s uses familiar imagery of Evernote’s branding (the elephant) and by using a comparison tells the visitor what Notion is without having to explain.

    notion landing page evernote

    3. Framer

    Framer use banners sitting at the top of their landing page to help promote certain events or content to visitors – in this case, their Loupe Conference. The large black text in the centre of the page creates an obvious hierarchy of messaging so you get the message straight away.

    framer landing page design

    4. Hotjar

    Choosing to focus on only two colours, Hotjar uses clever text highlighting on the landing page to get across the company’s value proposition in only 3 words.

    hotjar landing page design elements

    5. Proof

    By offering only two options, in a larger font and a highlight colour, Proof draws visitors towards two CTAs – offering the chance to demo or sign up.
    Note: Proof are showing off their own product on their landing page as it pops up in the bottom left-hand corner.

    proof landing page design

    6. Basecamp

    Basecamp uses a clever visual hierarchy to draw the eye down towards the green ‘try Basecamp’ box. They take the opportunity to show off their brand personality with illustration and casual copy.

    basecamp landing page design

    7. Clearbit

    Using a white CTA on a blue background makes for an eye-catching landing page which clearly and succinctly explains the value of Clearbit and moves visitors towards signing up.

    Landing page design inspiration

    8. DigitalOcean

    By displaying their pricing directly onto the product landing page, Digital Ocean removes an extra step from the customer journey making it a one-click to sign up experience.

    digital ocean landing page guide

    9. RightMessage

    Right Message makes it clear to the visitor that they can get started with the product for free. They also offer a pre-recorded 3-minute video demonstrating the product in use – this can be a great way to get a lot of information on your landing page without it feeling cluttered.

    right message landing page design

    10. On RoadMap

    Roadmap’s refreshingly different site stands out from almost everyone else listed here. This landing page uses social proof front and centre to encourage visitors to become customers. The biggest take away here is – you don’t need to do what everyone else is doing.

    roadmap design landing page conversions

    11. Buffer

    This landing page for Buffer Reply draws the eye to a one sentence value proposition but also shows off the company’s culture and personality with its whimsical illustrations.

    buffer landing page conversions

    12. Asana

    The dark background of Asana’s premium landing page helps the company to stand out to the visitor who is likely used to designs with a lot of white space. This bold use of colour is a clever trick to distinguish between multiple products under one name.

    asana landing page design high converting

    13. Tability

    The quick, snappy copy of Tability’s landing page reflects their brand proposition of getting things done. They also show off their product which stands out against a dark green background.

    tability landing page design advice

    14. Mailchimp

    In the copy and imagery, Mailchimp demonstrates the “promise land” of success after you use their product – they are telling you that when you get this product you will be a pro who is on top of all their work. Showing the promised result, not the problem, can be a powerful way to make a convincing statement.

    Mailchimp landing page design

    15. TransferWise

    The landing page for the TransferWise borderless account uses a visual hierarchy to encourage you to sign up, but also to dig a little deeper into the product if you aren’t yet convinced. The dark background makes the neon green card stand out and helps to create a distinctive visual identity.

    transferwise landing page design

    16. Libra

    Using a striking full-screen photograph with minimal text is a bold way for Libra to stand out. This approach is not suitable for all companies but could be a great option for a lifestyle brand. The CTA in this example is to watch a video, or more subtly, read their research paper.

    libra landing page example and design

    17. Trulia

    The Trulia landing page lets visitors get straight to the point by featuring the search bar right in the middle of the page. You’ll notice the “sign up/login” button more subtly in the top right corner. The aim here is to get visitors to see the value of Trulia by using the search first, then get them to commit to signing up after. Smart.

    landing page best practices

    18. CharlieHR

    CharlieHR uses social proof and a “try for free” CTA as the main features of their landing page. They have also set up a live chat prompt to start conversations with any visitors who might have questions.

    charlieHR landing page example

    19. Shopify

    Knowing its customer base Shopify uses inspirational and active language as the headline copy on their landing page. Interestingly, they don’t automatically push signing up – this is left up in the right-hand corner – instead Shopify takes a content-first approach to educate and assist their visitors before trying to convert them. This is similar in strategy to allowing search functionality before signing up.

    Shopify start business landing page guide

    20. Airbnb

    Using an incredible hero image as the main focus of the landing page Airbnb keeps a visitor in the ‘inspired’ mindset that best fits choosing an experience or place to travel to. Before making any commitments or logging in you are encouraged to explore the site and all the possibility it holds with the prominent advanced search display.

    airbnb landing page example

    21. Wistia

    Bold colours and a strong statement declaring “everything you need” gives the visitor a confidence boost that Wistia knows what they are talking about.

    Wistia landing page best practice

    22. Canva

    Canva requires you to sign up before starting to design anything and so they place this option on the left-hand side of their landing page – naturally a place where the eye is first drawn to. They use the rest of the space to show the possibilities of what can be done with the product and leave the details up top in a muted grey.

    canvas design landing page example

    23. Squarespace

    As a website design tool, Squarespace needs a landing page that packs a lot of punch. The sleek design shows off how their tooling can help you make something elegant and sleek and the heading copy gives the user confidence they’re in the right place.

    Squarespace website design

    24. Netflix

    With such high brand recognition, Netflix doesn’t explain what they are or what they do on their landing page. At all. Instead, they jump straight in to address the most common hesitation about signing up – being charged at the end of the free trial. They also neatly “personalise” the landing page based on the current date.

    Netflix landing page design ideas

    25. Masterclass

    Knowing that their most valuable asset are the names of the teachers, Masterclass uses text weighting and colour to make these names the stand out aspect of the page.

    masterclass landing page design high converting

    26. Coursera

    Although you can browse the catalogue of courses without signing up Coursera pushes the visitor towards making an account straight away. This is a smart way to encourage people to enter your marketing funnel but doesn’t feel pushy as the search bar – in the expected place – gives you another option.

    coursera landing page example

    27. WeWork

    Using an image carousel makes WeWork’s landing page interesting without being too busy. See how they’ve positioned the next image just peeking out from the right-hand side – if it was hidden much more visitors would be unlikely to be prompted to click through.

    WeWork landing page design

    28. Feast It

    The landing page for Feast It gets the important details out of the way fast. They don’t want you to find the food truck of your dreams and then realise they can’t come to your area. This upfront form helps prevent customer frustrations later on.

    website landing page for click throughs

    29. Marvel App

    On this site, Marvel puts the most important information to the left of the screen – which in most Western countries is where visitor’s eyes naturally travel to first. This helps the imagery to be a nice addition, not a distraction.

    landing page visual hierarchy

    30. WeTransfer

    Using a transparent film over their single-page site makes this an effective landing page which tells you everything you need to know and has the benefit of getting you to agree to their terms. This is a great way for sites like WeTransfer to cover their legal requirements without it feeling like a pain or taking the form of a huge T&Cs contract that no one wants to read.

    great landing page examples

    31. Slack

    By using logos of other companies and tools that you can collaborate into Slack they are sending a powerful message: this is a solution for everything you want to do. It has the added bonus of using social proof and familiarity of other big logos to reassure visitors about the product quality.

    amazing landing page examples

    32. Monzo

    The dark background colour helps Monzo’s value statement really stand out on this landing page for their US launch. Monzo shows it’s brand values with a bold statement that feels collaborative and understanding.

    bold landing page design references

    33. Apple

    You don’t need to go far to find a website that’s been in some way inspired by Apple’s website design. Some of Apple’s more recent landing pages (for specific products) have focused on large text that’s easy to read on all devices. They’ve even been experimenting with discounts and incentives to make you more likely to purchase. Apple is clear proof that effective landing pages can be beautiful.

    apple landing page design reference

    34. Revolut

    This clean landing page uses video to quickly explain the values of Revolut to any visitor without cluttering the page. The faded out pink “Get Started” button acts as a prompt to fill in the phone number field but also helps to keep the page streamlined.

    revolut landing page examples

    35. Gremlin

    This landing page certainly gets across the point that the product is free. Featuring prominently in the centre of the screen and on its own line, this message is loud and clear. Gremlin have also used an unobtrusive green banner across the top to highlight an upcoming conference – this can be a clever way to show off temporary events or offers.

    excellent landing page examples for inspiration

    36. Bugsnag

    This example from Bugsnag balances a busy image with incredibly clean text and navigation bar. This gets across the brand personality and brings some visual interest without distracting from the core message.

    landing page inspiration

    37. Baremetrics

    This is another good example of using a banner to share recent updates and key messaging, in this case, a report on cancellation. By promoting content on the landing page Baremetrics are able to gain some trust and respect from the user, establishing themselves as a leader in the field.

    bare metrics landing page inspiration

    38. Atlassian

    For Atlassian’s Jira software the landing page hits you with a punchy claim of being the number 1 development tool. Notice that there are 3 CTAs for a free trial on this one page – this is perhaps one too many, but the different styling makes it feel less pushy.

    landing page inspiration

    39. ProfitWell

    This landing page for ProfitWell uses social proof of some big names to encourage confidence in any visitors to the site. They use an interesting CTA of “get free metrics” – this makes it stand out from something like “try it free” which can still cause hesitation in some visitors.

    landing page inspiration

    40. Sketch

    This very sleek and clean landing page focuses on that bright orange button encouraging any visitors to give the product a go. Sketch is a design tool that requires a basic level of knowledge to get the most out of, the landing page also features chances to watch a video demonstrating how to use the product and a “learn” option in a prime space on the navigation bar.

    website home page inspiration

    41. Airtable

    With the “get started” CTA Airtable don’t mention costs in a prominent way – instead pricing is nestled up in the navigation. By not even mentioning that it’s free the audience don’t think about costs, or spend time evaluating value, they can just get started.

    landing page design inspiration and tips

    42. Chargebee

    Chargebee use a banner and webinar content to capture email addresses from their visitors and set themselves up as field experts in SaaS finance.

    landing page inspiration design

    43. Recurly

    Recurly’s use of contrasting colours helps the most desired CTA – signing up for a trial – to stand out against the rest of the busy page.

    website design inspiration

    44. Close

    Keeping it simple and fairly monochrome helps to hammer home Close’s vision of “breaking through the noise” on this landing page. Again there’s a banner focus on content and ‘Try Close’ is highlighted as one of the few colour aspects to the page.

    landing page inspiration for SaaS

    45. Cultured Code

    This landing page for Cultured Code’s task manager keeps everything very simple. Notice that the call to action is to watch an introductory video, not to sign up.

    landing page website design tips

    46. WebinarNinja

    This landing page for WebinarNinja is one you would come across when searching for an alternative for GoToWebinar. Building landing pages that focus on switching from an alternative product is a smart trick to capture that traffic and to easily explain your product’s value to an audience who already knows what they want.

    website inspiration

    47. Curated

    Curated use a very clean, simple design to keep the visitor focused on their value proposition which is where your eye is automatically drawn. They encourage visitors to get started straight away and see the product’s value through testing it out, but the clean navigation bar allows an alternative, although less desirable, option.

    landing page website design tips

    48. FreshBooks

    There’s a lot going on on Freshbooks’ landing page, but still, the eye is drawn to the CTA where a visitor fills in their email. Some social proof is added both through press name checks and a great statistic about customer satisfaction.

    high converting website design

    49. Front

    A short social proof example is included in Front’s landing page which provides an instant reassurance that you’re in good company. Using a video, live chat prompts, and stand out colours for important CTAs are all good techniques that you can see in this example.

    website design inspiration for high converting landing pages

    50. FullStory

    By opening with a question FullStory get the visitor to think about the problem that they are hoping to solve. Clever use of colour, social proof of existing customers, and a content focused banner make this a great example.

    landing page inspiration tricks and tips

    51. Kalo

    Adding a live chat prompt to any landing page can be a great way to help visitors navigate the site and also to capture leads that you can follow up with later. Kalo uses a video encourages visitors to linger on the site which increases the opportunities to convert them into qualified leads and customers.

    landing page design for high conversion rates

    52. Kayako

    Adding a second free trial CTA under the main text might help to increase the CTR here, but Kayako do a great job of creating a calm and effortless feel to their landing page. This gets across the brand message visually as well as through text which is an important element of the design process.

    landing page tutorial

    53. Pipedrive

    A bold opening statement from Pipedrive helps to imagine that ‘promised state’ of success after using their product. Using colour sparingly on the most important page element is good practice for CTAs and the video, although a lesser ranked CTA, helps to keep visitors on the page for longer.

    high converting landing page tips

    54. Square

    This clean but fun landing page for Square’s PoS offering doesn’t bury the visitor in too much information. They are making the assumption that if you’ve got this far you probably know what you are looking for and so focus the attention on good design and getting started.

    landing page examples inspiration

    55. Typeform

    Typeform takes 5 words in their largest text size to get across exactly what their product does. The content focused CTA gives a namecheck to Mailchimp which acts as a bit of social proof whilst also positioning Typeform amongst major player in the SaaS industry.

    landing page website design inspiration

    Thanks for landing, thanks for reading!

    If you made it this far, congratulations. Thanks for reading our ultimate guide to designing an effective landing page.

    We’re keen to hear your tips and tricks, and any learnings you’ve had from working on your own landing pages. Be sure to let us know via Twitter and we’ll feature them in the post!

Written by
James is CEO and one of the co-founders of GoSquared. He also likes to talk about design.

You May Also Like

Group 5 Created with Sketch. Group 11 Created with Sketch. CLOSE ICON Created with Sketch. icon-microphone Group 9 Created with Sketch. CLOSE ICON Created with Sketch. SEARCH ICON Created with Sketch. Group 4 Created with Sketch. Path Created with Sketch. Group 5 Created with Sketch.