|
Hey Reader,
Designing a landing page as a beginner feels impossible
You open Figma
The screen is blank
Your mind is too
So you start scrolling through Dribbble
Then Behance
Then maybe YouTube
Still nothing feels real
That was me too
I thought landing pages had to look like design awards
But after working on 150 plus websites
I learned something better
They don’t need to be flashy
They need to work
Here’s the same 5-step process I still use today
It works whether you’re brand new or rebuilding from scratch
Step 1
Start with real websites
Not mockups
Not case studies
But actual live sites from businesses in the same niche as your client
This gives you clarity
It shows you structure
It reveals what’s actually converting
And you’re not copying
You’re adapting
There’s even a law for this
Jakob’s Law
Users want your site to feel like all the other sites they already trust
Familiar beats clever
Every time
Step 2
Choose 3 to 4 colors
That’s it
You don’t need a full design system yet
Use one primary
One secondary
And one accent
The 60 30 10 rule always helps
Sixty percent primary
Thirty percent secondary
Ten percent accent
Tools like Coolors or Adobe Color can help you test combos
Keep it clean
Keep it focused
That’s how you build trust
Step 3
Pick one font family
Not three
Not fancy
Just clear and flexible
Use weight and size to create hierarchy
Bold for headings
Regular for body
Smaller for captions
Try Inter or Poppins or Satoshi
If you’ve never picked fonts before
Start simple
Step 4
Plan your layout with intention
Most beginners guess the sections
But landing pages follow a proven structure
Here’s mine
Hero
Problem
Solution
Features
Testimonials
Pricing
FAQs
Final CTA
It works because it answers questions in the order users think them
It also follows the AIDA principle
Attention
Interest
Desire
Action
Every section moves people forward
Step 5
Now write the copy
Or get help writing it
Use ChatGPT
Give it your offer
The section purpose
The brand tone
And let it draft something
Then edit it into something sharper
Use real testimonials
Use benefit-driven language
Use “you” more than “we”
And make your CTA clear and visible
Preferably above the fold
Bonus tip
Don’t spend time prototyping animations in Figma
Especially if you’re new
Static layout is enough
Focus on clarity and flow
Not micro-interactions
You can even build directly in Webflow or Elementor once your structure is set
Because no animation can save a confusing layout
But a clean layout will work without any animation
If you’ve been stuck on your first landing page
Or feel like every design looks wrong
Use this as your starting point
It’s helped me build dozens of high-converting pages
And I’m still using it today
Talk soon
Ali
P S Want access to more step by step breakdowns like this
Join my free community KhanCircle
It’s where I share deep dives like this weekly
Join here and start building with us → KhanCircle
|