1
2 Comments

How you can make a landing page for free 🛠️

I recently created a landing page for my project, sidehustlr. You can see the end product by clicking the link.

I also posted a version of this on my personal blog. There, I'll be writing about my transition from a British sniper to now working in the tech industry along with pieces on mindset, personal development, and business.

Tools used for this:

Intro

As I said above, this landing page was created for one of my projects - sidehustlr. It's a platform with on-demand courses that are 100% focused on generating income.

If you've already clicked the link and seen the landing page you'll notice it's simple, right?

Landing pages are just one of those things people love to overcomplicate, I certainly found it overwhelming at first. @levelsio touches on this in his book MAKE about tech stacks; there seems to be an obsession with having the 'coolest' stack. All of this fuss can distract you from the mission: shipping. Similarly to tech stacks, there are loads of shiny landing page tools. I went with Carrd for this, and as the title suggests, I didn't pay a penny - for anything.

Inspiration

As with any project, it's always good to seek inspiration.

I recently saw the below tweet from @harrydry of @GoodMarketingHQ. He analysed a few landing pages and gave his thoughts. I like these landing pages as they're super simple and effective - exactly what I'm aiming for.

Imgur
View the Tweet here, can't seem to imbed it.

Wireframe/sketch

Once you've got some ideas, it's now time to take some action.

For this, I used Wireframe.cc. It's a simple site that doesn't require registration and does exactly what it says on the tin. Wireframes are supposed to be minimalistic, don't get swamped in the details just yet - they come later.

Imgur

Creating the landing page

As mentioned earlier, I used Carrd for this. They have a mixture of free and premium templates, I of course chose the free one. However, I believe their premium plan is $19/year which is crazy cheap.

Carrd was relatively straightforward. It was my first time using one of these, so it took a bit of exploring to understand it all. It's important you create a page with responsiveness in mind, considering the majority of visitors will be using a mobile.

If you're not familiar with responsive design, it typically involves using columns to segment your content. Luckily this is easy to do with Carrd - they actually have a guide on it here.

If you're struggling with choosing a colour palette. I recommend using colorhunt. Similar to wireframe.cc, it doesn't require registration. Big fan of sites like these!

Imgur

Email form

The aim of a landing page is to convert visitors into leads. Having an email form is a good way to achieve this.

Now, there are many ways to skin this cat. I personally used the free version of Mailerlite for this but there are several tools you can use instead. You can a list of integrations here.

It doesn't require much effort at all. Add a form, input the API key from your marketing tool, and the job should be done. Just have a play around with the styling and make sure everything is consistent.

Imgur

Adding some designs

If you visited my landing page, you’ll notice I have a mockup on the right-hand side. You could easily use a tool such as Adobe Photoshop for this, but I don’t have it; I used a tool called Figma instead.

Figma is easy to use and It didn't cost me anything (perhaps I'm being annoying with the free message now).

Putting time and effort into a mockup is worth it. Referring back to @harrydry's Tweet - users want to visualise your product/service. If you're not the most design-savvy person like me, take inspiration from other sites. You can only get better at something by doing it.

Once designed, export your image and add it to the landing page. To achieve the same layout as me, make sure you add the image to the right-hand column of the page - this will help with responsiveness.

This is how mine turned out:

Imgur

Finishing touches

Hopefully you have a landing page that is looking 🔥

Make sure the design is consistent and double-check the email form is working before you publish. It's probably a good idea to check everything looks okay on mobile, too.

I welcome any comments, feedback, or suggestions!

on December 29, 2020
  1. 1

    Currently it doesn't do much.

    I think the point of the LP is what drives its design and functionality. If you are just looking for sign ups then it's simple enough and does the job, although I think you could be a little more elaborative with the copy.

    1. 1

      Thanks for the feedback!

      What about the copy would you change, keen to hear some suggestions?