<p>Published on <a href="https://blog.prototypr.io/the-biggest-landing-page-mistakes-and-how-to-fix-them-c08302c7b1fd?source=rss----eb297ea1161a---4">| Prototyping: From UX to Front End &mdash; Medium</a> Pedro Cortés </p>
<p>As a Designer/consultant focused on optimising conversion rates and through analysing a lot of pages regularly and seeing what mistakes people tend to make I’ve compiled the most impactful/common ones so you can identify if you are doing them too and quickly fix them.</p>
<p><em>This article was a deep dive on one snippet from </em><a href="http://bit.ly/2HGJVKV"><em>my newsletter</em></a><em> where you get 1 actionable tip every week so you can improve your website (only the 80/20!), </em><a href="http://bit.ly/2HGJVKV"><em>you can get it for free here</em></a><em> btw.</em></p>
<h3>No one gets what it does (at least fast enough)</h3>
<p>This is another very common one and the real problem here is that you only have a limited amount of space to explain what you do and also a very limited amount of time before people get bored or frustrated until they leave, without ever converting 🙁</p>
<p><strong>Here’s a framework you can use to make it easier:</strong></p>
<ol>
<li>Make the title point out the desired result or a benefit</li>
<li>Make the supporting text below very briefly explain how it works or how they get that result mentioned in the title</li>
</ol>
<h3>Bad example 👎</h3>
<p><img alt="" src="https://cdn-images-1.medium.com/max/800/0*oQoM2Anv8n5HRAxU.png">Optimizely can get a way with this a bit more as they are well known but these headlines are pretty meaningless</p>
<h3>Good examples 👌</h3>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*9AatV9WFusk_ctWv.png">PandaDoc<img alt="" src="https://cdn-images-1.medium.com/max/1000/0*zqQlxfpCjgxp9igh.png">A header from a redesign project for a client</p>
<h3>The CTA is way to easy to miss</h3>
<p>You need to give visual priority to what is more important. This basically means if your titles are important make them bold, if your body text is not as important and it stands out less so it doesn’t conflict with the title and more importantly if you want people to click on something they have to see it in the first place! You can find below an example for this.</p>
<h3>Bad example 👎</h3>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*a6SgGKyQpO40u5ci.png">example illustration</p>
<p>Look how easy the CTA is easy to miss if you just scrolling through the website, this example still has a visible headline that helps a little bit but trust me I sell this all the time no matter how basic it is.</p>
<h3>Good example 👌</h3>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*8xzp2v0egv4lqHSS.png">Stripe payments<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*gjZuVJ9L8PSkosaA.png">What people see vs what you have example</p>
<p>Since people scroll through the website pretty fast everything seems a little blurry. Notice how the CTA could still be prominent even in that case</p>
<h3>The screenshots don’t support the explanation</h3>
<p>This problem is super common among the SaaS landing pages where showcasing the actual interface is a common practice and it ends up being a bit generic, hard to tell apart from the competition and/or hard to understand/explain the product better.</p>
<p><strong>How to make better screenshots:</strong></p>
<ol>
<li>Make them visible by using big enough screenshots, reducing the viewport of the browser window so everything is closer together (if it’s a web app) and by zooming in if you want to emphasize one detail not the entire thing.</li>
<li>Ask yourself if that’s the right thing to showcase in the first place. Is it a USP or just a generic dashboard view?</li>
</ol>
<h3>Good examples 👌</h3>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*s5zt_hnILIEyKpcw.png">Twistapp.com<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*wcK72yrvm12eGGsO.png">Todoist.com<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*LPksPTugLw6jk1Kn.png">Todoist.com<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*u9EOH4BNysIuOuys.png">Notion.so<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*EtT94NbpP4ACC2Tc.png">Notion.so</p>
<h3>People buy benefits, not features</h3>
<p>Probably the #1 mistake I see people making. Explaining features instead of the results/benefits it can bring doesn’t trigger an investment mindset from your visitor and that’s what you need to achieve if you ever want them to relate your product/service as a solution to the problem they need to fix.</p>
<p>You can get by if your product is cheap or your services are around the $10/month mark, if you are not on those categories then you really need to improve and you will need to get better and better at this the more expensive your product/service is. That’s why I mostly work with SaaS startups that have $500+/user/year as they can generate a lot of revenue with little customers and it’s much harder for them to convert visitors into customers in the first place.</p>
<h3>Ups… missed it</h3>
<p>Similar to the problem on the CTA, some websites have important sections a little too small and without the proper amount of spacing between sections to make it much easier to follow along and harder to miss, because inevitably, people will scroll through the page not read through the page. It will make more sense in the examples below.</p>
<h3>Example of benefits that are super easy to miss</h3>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*7U4RI3Hai4ggDEUx.png"></p>
<p>This is from the awesome guys building <a href="https://weardulo.com/">DULO</a>, where the biggest reason to buy the shirts was pretty easy to miss (as this is super short and not in-depth) or not understand the entire value it could bring!</p>
<p><strong>Don’t worry, they are fixing it, </strong><a href="http://weardulo.com"><strong>here’s the new version</strong></a><strong> </strong>😉</p>
<h3>People need social proof, the right kind of social proof</h3>
<p>Social proof is always a good addition to the landing page, right? Well…kind off. With people being more and more bombarded with similar social proof they will become more and more numb to it (or even suspicious), that means adding testimonials or random logos isn’t as “clever” as it used to be.</p>
<p>We now need to do a few tweaks to the current social proof you are using to make it more specific and therefore more trustable for the visitor, below you can find some examples of what you can do.</p>
<p><strong>If you have testimonials:</strong></p>
<ul>
<li>Try asking for specific things people enjoy about the product so you will end up with more effective proof than any generic testimonial</li>
<li>If you have influencers in your niche using the product than feature them as a bit of their authority can rub off your product/service.</li>
<li>Make them short and try highlighting the most important parts.</li>
</ul>
<p><img alt="" src="https://cdn-images-1.medium.com/max/568/0*y7Xv85WuDcQHtjth.jpeg">The Content marketing playbook<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*J2-0kTqKz8OROl-6.png">Client project (smartbnb)</p>
<p><strong>If you have company logos,</strong> try to choose only the companies that might be well known in your niche otherwise it seems you are playing bigger than you are as you are “bragging about” small companies no ones knows about, it might become more a bad thing than a good one.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1000/0*YAUZ7JVK8voS82NQ.png">Very important blogs in that niche (from a client project)<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*X0rfqk-gDDKTb_BL.png">Super well-known companies plus great proof of the paying customers and emails sent — Sendgrid.com<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*17ufaltWk4prD5B7.png">Todoist.com</p>
<p><strong>If you have feedback from your customers about their results</strong>, offer them some kind of promotion in exchange for letting you write a quick testimonial on how their company used your product to get X result.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*K9M5RV7s2RvlpSWE.png">Stripe Payments<img alt="" src="https://cdn-images-1.medium.com/max/1024/0*q_N_z_IQNcg5PnE8.png">Envoy.com</p>
<h3>One thing, that’s it!</h3>
<p>Do you like to get a bunch of information at once and then having to process it all by yourself? No? Then think about how are your visitors trying to understand the value of your product when they have too many things to process at the same time.</p>
<p>Divide your website into sections, and make them so they only explain one big thing at once, only have a CTA (most of the times and/or if you are super good at splitting the audience) and only ONE goal for that entire section.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*C_5ExA0vgG7Pr6yX.png">How you should structure your page by diving it into sections with a single goal</p>
<h3>Hungry for more valuable tips!? 👇</h3>
<p>This article was a dip dive on one snippet from <a href="http://bit.ly/2HGJVKV">my newsletter</a> where you get 1 actionable tip every week so you can improve your website (only the 80/20!), <a href="http://bit.ly/2HGJVKV">you can get it for free here</a> btw.</p>
<p><a href="http://bit.ly/2HGJVKV"><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*qoQaiUfSc23S99Mq.jpg"></a><a href="http://bit.ly/2HGJVKV">Get 1 actionable tip a week to improve your conversion</a></p>
<h3>Which of these mistakes do you tend to make? 🤔</h3>
<p>These were just the most common ones I have seen around the community and from my consulting calls and redesign projects, hope you found them useful 😉</p>
<p>I’m curious…What mistakes do you make?</p>
<p><strong>Let’s start the discussion below!</strong> 👇</p>
<p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2Ff51076%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2Ff51076%2F&#038;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252Ff51076%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0"><a href="https://medium.com/media/b85dfbb5286d8a25cf2e754b9462cf45/href">https://medium.com/media/b85dfbb5286d8a25cf2e754b9462cf45/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=c08302c7b1fd" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou"></p>
<hr>
<p><a href="https://blog.prototypr.io/the-biggest-landing-page-mistakes-and-how-to-fix-them-c08302c7b1fd">The Biggest Landing Page Mistakes and How to Fix Them</a> was originally published in <a href="https://blog.prototypr.io">Prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


The Biggest Landing Page Mistakes and How to Fix Them

Top Stories