DEV Community

Cover image for I revamped my landing page and here's what I learned
theredfish
theredfish

Posted on • Originally published at theredfi.sh

I revamped my landing page and here's what I learned

Hey there, my name is Julian and I'm building Owl Duty a SaaS for developers and testers to monitor and test their APIs. After sharing my landing page with friends, developers and indie hackers I realized my copywriting wasn't good. I was too vague. So I took time to revamp my landing page and here's what I learned along with some personal tips.

πŸ‹οΈβ€β™‚οΈYour landing page is like an exercise

The more you refine it, the more you will improve your pitch and core value proposition. Surprisingly, creating and redoing my landing page helped me better understand what I wanted to build and what my limits were (time, money, network). My first version helped me to acquire a few early adopters, but I knew it was necessary to iterate and ultimately revamp my page to attract more people.

πŸ“ Your copywriting should be attractive

... with catchy headlines but informative paragraphs at the same time. It should be specific without being boring. The idea is to retain your visitors' attention to the end and convert visitors to users/customers. I have to say it's really hard to balance and it may take several iterations to get it right.

πŸ—¨οΈ Talk about your landing page

In my case, I shared it with indie hackers, and developers (some of them are also my friends). Also, I decided to get an outside perspective and see how an almost neophyte person would understand it (almost because after 13 years together my partner understands most of the tech terms πŸ˜…). I got interesting feedback, especially on the copywriting and its clarity.

🎨 Get a good design!

I don't know about you, but when I see a generic page with a bad design I close it immediately. Why? Because the design reflects the seriousness of the solution and the passion of the founder. I revamped the design, but also replaced my generic illustrations with small placeholders describing the features listed. Screenshots work pretty well and give confidence, use them if you already have an existing product. Just make sure your design is great. As for the overall style, I tried to pick one that speaks to developers/techies as they will be my early adopters.

πŸ“² Call to action!

There are many ways to convert visitors into customers/users, but I think a good rule of thumb for a landing page is to make sure your call to action is the first thing visible and accessible from everywhere. For this, I like to put a button in a fixed header, so that visitors can click at any time. I try to avoid asking for an email first, personal preference, but I want to be sure people buy the concept after reading my page. Plus, I don't want to be too intrusive.

πŸ‘€ Who are you talking to?

Users? Leads? Early adopters? Not having a product yet, I adapted my speech and preferred to constitute a mailing list of early adopters. It's transparent, people know why they subscribe (my newsletter in this case) and it builds trust. Plus, they get a special benefit on early program products and services. Make sure your call to action is clear. If you already have a product, you can provide a sign up form instead.

⌚ Designing a good landing page takes time.

The first version took me about 1,5 days (copywriting included). The new about 1,5 weeks (new copywriting included). Don't get stuck and go for the shortest iteration at first but don't necessarily share your page publicly. Get feedback then iterate, and you'll see your business idea evolve as you start building, which should be reflected in your copywriting.

πŸ”’ Build trust from the beginning

You will need to think about the actions and information required to be GDPR compliant: data processing, cookie policy, DPO, ... and maybe some legal notices depending on where you reside. It takes time and shouldn't be neglected for the obvious reasons of doing good but also for your brand image. Anyway you will face it sooner or later if you are serious about your business.

πŸ’‘Tech recommendations

  • NextJS is a great framework to build good SEO and optimize your landing page (not only of course).
  • TailwindCSS is a great way to design UIs quickly with very short feedback loops.

  • I use Netlify to host my page, they have a free tier and they automatically recognize your framework. They also optimize images if you need, and provide everything for SSL certs and adding your custom domain. They also provide preview pages in your pipelines (github app) so it's easy to share and get feedback before moving to prod.

  • Github open sourced two fonts: Hubot-Sans and Mona-Sans I use them for readability and "tech" style.

Did you find this blog post helpful? Help me by sharing it with the developer ecosystem!

Top comments (0)