How to Design a Website That Drives Conversions

It’s no use having a beautiful website or a lot of traffic if you can’t keep visitors engaged on your site. If all your visitors leave as soon as they arrive, it’s almost as if you had none at all.

When someone visits our website—whether through a post shared on social media or a Google search—we want that person to continue engaging with our content and getting to know us better. Furthermore, if we take it a step further, the ideal scenario is that after getting to know us a little, they’ll want to subscribe to our mailing list, send us a contact form, or purchase a product from our online store (if we have one).

Since this is such an important topic, here’s what you need to keep in mind when designing your site to make this happen (with a couple of specific examples of how to implement these strategies), so that your website truly achieves its goal: connecting with your audience from the very first visit and helping you gain readers and potential customers.

Table of Contents


    Why do we need to keep users on our website?

    Well, as I just mentioned, the first thing is that we want people who don't visit our website to continue learning about us and building a relationship with us and our brand. But there are other reasons that go beyond that— it's also good for your site's SEO.

    The longer someone stays on your page, the better, because Google interprets this as a sign that your site contains valuable information for users. This, along with other steps you can take to improve your site’s SEO, leads to better rankings on Google and, consequently, greater visibility for your website and its content.

    In terms of SEO, how quickly a user leaves your website is measured by a metric called the “bounce rate,” which reflects how often people “bounce” when they arrive at your website. In other words, if your bounce rate is very high, this means that most people leave as soon as they arrive on your website. Here’s a link to Google explaining what it is, and this post where they analyze it in more detail in case you’re interested.

    In any case, what we generally want is for our bounce rate not to be too high, because that means we have good engagement on our website and that visitors are staying for a while.

    How to Keep Your Visitors Coming Back

    So you know it’s important to keep your visitors browsing your website… But how do we get them to stay longer? The short answer is with great content and strategic web design:

    1. If your content doesn't offer your audience anything of value, it doesn't matter how strategic your web design is… they won't stick around. And what's worse, they won't come back. So focus first and foremost on creating content that's truly useful for your audience.

    2. On the other hand, if you have excellent content but your website is poorly designed, your traffic will suffer as well, because you’ll make it difficult for visitors to interact with your site and take the actions you need them to complete when they visit.

    As I mentioned, in this post I’m going to focus on web design, and now I’ll explain the key points you should consider when designing a strategic website.

    What should you keep in mind when designing a website that converts?

    Strategic web design must achieve two things: first, it must make your website an attractive place for your ideal customer or audience, so that at a glance they feel they’re in the right place. Second, it must have a clear objective to ensure that all visitors follow a specific path through your pages.

    Make sure your website reflects your brand

    Making your website appealing is closely tied to branding. Only with well-defined branding designed to attract your ideal customer will you be able to connect effectively with your audience, and strong branding is the starting point for defining a website’s visual style. Here, you should consider the colors and fonts defined in your branding, but also the use of white space, the styles of the images (illustrations and/or photographs), and even the writing style of the text, because these elements are part of your brand’s verbal branding.

    As for the visual aspect, a while back I wrote a post about how to apply your branding to a website ( specifically on Squarespace, but you can still apply those tips to other platforms), and you can find several posts on the blog about branding…though if you’re not even sure what I’m talking about, you can start with this post where I explain what branding is.

    In general, to ensure your branding is effectively reflected on your website, I recommend:

    • First and foremost, make sure there is consistency between the ideal customer you’ve defined in your brand strategy and the audience you want to reach with your website: the two should be one and the same. Even if there are certain segments of your audience you’d like to engage more with through your website, there should be no disconnect between your brand’s audience and your website’s audience.

    • Make sure your web design follows the branding guidelines you’ve already established for your brand, as your website should be a key channel for communicating your values and message.

    Set strategic goals for your website

    One of the first mistakes people make when designing websites without much experience is failing to define specific goals for the site. A website shouldn’t exist just because it looks nice, or because you’re supposed to have one… no. A website should exist to fulfill a specific goal; it must have a purpose. It could be to provide information about your services and get potential customers to contact you, promote a podcast, gain subscribers to your email list, or sell a course.

    When we skip this first step, we end up without a clear starting point for what we want to achieve with our website. Always remember that your website is a business tool, and it should help you achieve very specific goals for your business. This is one of the reasons why there is no single formula for designing websites, since each site will be created based on the business and its priorities. So when you’re designing your website, first define what you want it to help you achieve—what its fundamental objective is.

    For example, if I tell you that an online store’s website isn’t the same as a photographer’s website, it might make perfect sense to you: one sells products, the other sells services. But if I tell you that the website of an online store selling premium-priced products (let’s say a jewelry store) isn’t the same as the website of an online store selling products at a lower price (a cute little stationery shop), you’ll realize that, even though both are store websites, they aren’t the same: each one’s sales strategy, the way they attract customers, and the motivations of those customers to buy will be different in each case.

    Therefore, the design of these two online stores will differ, depending on each one’s business and website strategy. Perhaps the primary goal of the jewelry store’s website isn’t to drive purchases, but rather to attract subscribers to close sales through email marketing, or to provide detailed information about the product creation process and the people behind its production—since these are custom pieces whose value must be clearly explained. On the other hand, the stationery store (with an industrial production process and more affordable prices) may have a more direct online sales strategy, because the customer’s investment isn’t as significant, and the goal is more focused on making a purchase with an emphasis on sales and discounts.

    The same goes for a service-oriented website… a professional illustrator who takes on commissions but also sells courses or prints is not the same as a photographer who wants to grow her Instagram account.

    So, what I want to make very clear to you about all this is that your website’s design will depend on what you need it—as a business tool—to do for you and your business.

    To ensure you get off to a good start with your website design, I recommend:

    • Start by defining no more than three strategic goals for your site. Try to keep it to three or fewer, so you can stay focused on what you want to achieve with your website.

    • Once you've identified them, organize them hierarchically and assign priorities to each one.

    Includes calls to action related to objectives

    In addition to setting overall goals for your website, it’s very important to define specific goals for each page. And of course, each page’s goal should contribute in some way to your site’s overall goals… otherwise, it just creates confusion.

    Each specific goal should be linked to a specific action: in other words, there should be a particular thing you want visitors to do on that page, and you need to make it easy for them to do it. If you don’t even know what you want people to do when they browse your site... how are they supposed to guess?

    For example, the obvious purpose of your contact page is for people to get in touch with you in some way. Therefore, you should make it easy for users so that when they arrive at that page, they find different ways to contact you: by submitting a form, sending an email, or calling you on the phone. Because not everyone likes to fill out forms, and some people may prefer to email you directly, or call you on the phone if you’re a local business… or even see your address to visit your location, if you have a physical storefront.

    So, once you’ve defined the goals for each page, include calls to action on each one. Calls to action (CTAs) are clear messages you provide to users to encourage them to take a specific action. This could be visiting the blog, booking a consultation call, or subscribing to your newsletter, and they should have an eye-catching design.

    Every page should have at least one CTA, though I recommend including both a primary and a secondary CTA. For example, going back to the contact page: someone might visit your contact page but decide that it’s not yet time to write to you or contact you directly, so the primary call to action on that page isn’t completed. In this case, the user has two options:

    1. He sees nothing else to do on this page, so he closes the tab and leaves.

    2. You give them the option to follow you on social media (which is a more indirect way to stay in touch with you), or to continue getting to know you and exploring your content on your blog.

    With the second option, at least you give users the chance to keep interacting with you, rather than leaving them stranded on a nearly empty page with just a form and little else.

    Map out your visitor's journey

    Another thing you should do is map out the ideal visitor journey on your website. When someone visits your site, they may arrive through different channels:

    • You can go directly to the home page, and from there you will take Route A.

    • You might arrive via a post shared on social media, in which case you'll take Route B.

    • For example, they might arrive at a landing page where you have an opt-in form that you're promoting, in which case they'll follow Path C.

    Therefore, users can arrive at your website through different channels, which means that their entry point won’t be the same in every case. So it’s very important that you sit down with a pen and paper and think through the different ways users might enter your website, so that in each case you can design a path that keeps those users navigating within your site.

    If your website has been up and running for a while and you use Google Analytics, you can see which pages your visitors are landing on, where their traffic is coming from, and the path they’re taking using a tool called“User Flow,which is very helpful for visualizing all of this so you can optimize your design.

    Two specific examples

    Currently (2018), the three main goals of my website are:

    1. attract subscribers for my photography course,

    2. position myself as a source of valuable content on topics such as visual branding, web design on Squarespace, and creative photography,

    3. and provide information about my web design services, making it easy for anyone interested to contact me.  

    You might find the order of these goals (especially the first one) a bit odd, given that my design services are currently the core of my business, but these are the ones I set when I designed the website a year and a half ago: my project wasn’t a business yet at that time, and my goals back then were different from what they are now.

    Over the past few months, my business and my priorities have changed, something I haven’t yet reflected on my website. As a result, and to be completely honest, my website isn’t currently working optimally for my business. This is a problem, and it’s one of the things I’m working to change in the coming months… But for now, let’s look at things as they are so I can explain, using two specific examples, how I maintain traffic to my website, using these goals as a guide.

    Redirect after subscription

    Photography Course Landing Page. The goal of this page isn't to have visitors browse the site, but to sign them up for the course, so the only call to action on the page is designed to achieve that goal.

    Photography Course Landing Page. The goal of this page isn't to have visitors browse the site, but to sign them up for the course, so the only call to action on the page is designed to achieve that goal.

    My main source of traffic is Pinterest, and within that traffic, most of the visits I receive go directly to the landing page for my photography course (this isn't by chance; it's part of a strategy I defined when I designed and launched my website). Since it’s a landing page, its sole purpose is to get people to sign up for the course, so users have only two options there: sign up for the course or close the browser tab.

    Now, if they decide to sign up, I want to take advantage of their interest in my content to help them get to know me a little better and start building a relationship with these people who have just discovered me (and thus contribute to overall goal number 2). That’s why, as soon as they submit the sign-up form, they’re redirected to another landing page (you can easily set this up in Mailchimp). On this page:

    1. I’d like to remind you that you need to confirm your enrollment in the course, because right now the most important thing is that you don’t forget to do so and that you complete the enrollment process;

    2. Thank you for signing up—I’m truly grateful every time someone shares their email address with me;

    3. Here's a button that takes you to the "About Me" page;

    4. and another button to go to the blog's home page

    The page visitors are redirected to after submitting a subscription form, where the goal is for them to learn more about me through my blog posts or the “About Me” page.

    The page visitors are redirected to after submitting a subscription form, where the goal is for them to learn more about me through my blog posts or the “About Me” page.

    I apply this procedure to different user flows, and taking into account the characteristics of each one, I have designed pages with different text and links for each case:

    • Once you've submitted the sign-up form.

    • Once they've signed up, they're taken to a different thank-you page, which also includes calls to action and buttons.

    • The pages look different depending on whether someone signs up for the photography course, the newsletter via Instagram, or the newsletter through one of the subscription forms on the blog.

    When I review my Squarespace analytics—which include data on button conversions— I know that the vast majority of people click on one of those buttons. Thanks to this, they continue to engage with my content, which is beneficial for me and, I hope, for them as well. From there, my website is designed so that visitors can easily continue browsing, whether they’re on my About page or a blog post.

    Optimize your posts

    At the end of each post, there’s a direct call to action—to sign up for the newsletter or learn more about one of my services—as well as related posts that make it easy for visitors to keep exploring the content.

    At the end of each post, there’s a direct call to action—to sign up for the newsletter or learn more about one of my services—as well as related posts that make it easy for visitors to keep exploring the content.

    Another way users find their way to my website is through blog posts, whether via Google or Pinterest. That’s why the design of my blog post pages is optimized so that if someone reaches the end of a post and is interested in what I’ve written, they can continue reading about related topics.

    Although most websites include a feature to navigate to the previous and next posts, it’s much better to show our readers relevant content on topics similar to what they’ve just read.

    With Squarespace, it's very easy to display posts on a specific topic anywhere on a page, complete with links and featured images, but this isn't the only way. Generally speaking, you can use the "related posts" feature:

    • the way I do it, by using a summary block in Squarespace (or a plugin or something similar in WordPress) at the end of each post,

    • with a list you create manually that includes links to the posts at the end (it's more work, but it's perfectly doable),

    • If you have a sidebar, you can include your most popular posts there (which usually works quite well).

    In addition, my blog posts include a call to action related to my email list (goal number 1) or my services (goal number 3), depending on the content and purpose of each post.

     

     
    Previous
    Previous

    How to Create a Mood Board for Your Brand

    Next
    Next

    Workflow: Brand Identity Design for Ingrid Fontana