This is my process I’ve picked up over time that’s worked for me, despite having zero formal design background. I used to look at a blank canvas trying to figure out where to even start, and I know a lot of people struggle with that too.
Step One: Steal Like an Artist (Sort Of)
Before you do anything else, go look at websites that actually look good. Not just pretty, but practical too.
I spend a lot of time browsing through top-rated themes. I study how they arrange content, how they structure their sections, what they put where. Then I borrow bits and pieces from different designs and mash them together into something new.
Here's the thing about design: almost nothing is purely original. Everything is inspired by or built on something else that came before it. Once you accept that, it takes a lot of pressure off. You don't need to reinvent the wheel. You just need to expose yourself to enough good designs that you have a mental library of layouts to pull from.
Step Two: Draw It Out First
Once I've found a few designs I like, I grab some paper and start sketching. Nothing fancy; I literally tape four or five sheets together and draw a rough wireframe with pencil first, then go over it with marker.
Step Three: Move to Figma
After the sketch looks decent, I bring it into Figma and start refining. This is where it comes alive. I add real colors, actual images, proper text, and fix the spacing. What starts as a rough sketch becomes something you can actually show a client.
The first version rarely gets approved as-is. Clients almost always have notes. They want to add this, remove that, change something else. That's normal. You take their feedback, play around with the Figma file, and send it back. Sometimes it takes two or three rounds before it feels right. That's just part of the process.
The Details: How I Actually Approach Design
Again, I'm not a trained designer. But these are principles I've learned through trial and error that have consistently worked.
Visual Hierarchy Matters More Than You Think
You need to understand what's most important on a page and make sure it stands out. Your key information shouldn't be buried or crowded out by other elements. If something matters, it should be prominent.
There are plenty of great resources out there on visual hierarchy if you want to dig deeper. Just search for it, you'll find solid articles from places like Adobe and others that explain the principles better than I can. There are also some excellent videos on landing page design that cover hierarchy, creative design, and white space in a way that clicked for me.
White Space Is Huge
I can't stress this enough. So many websites I see have content crammed together with no breathing room. Everything feels cluttered and overwhelming.
Here's what I do: on mobile, I give every section at least 50px of padding on top and bottom. On desktop, I bump that up to 75-100px for major sections. I've seen sites with only 10-20px between sections and it just looks cramped.
For paragraphs, I aim for a line height of about 1.4 to 1.5. That's the sweet spot for readability. You'll see some sites go up to 1.7, which can work, but 1.4-1.5 feels most natural for body text.
If you're putting a heading above a paragraph, make sure the heading is at least 1.5 times the font size of the paragraph text. And bold it. That visual difference helps separate sections and draws the eye where you want it to go.
My Go-To Website Structure
Here's the basic skeleton I use for most sites. Once you have this structure down, design gets way easier because you already know what content you need and where it should live. It becomes more like paint-by-numbers.
Hero Section
This is what people see first. I start with an H1 that states the main thing the business does, using their most important keyword. Then an H2 that goes into more detail about their services and what problems they solve. Finish with one or two call-to-action buttons. What do you want visitors to do first? Call? Get a quote? Make that the CTA.Services Section
What does the business actually do? What problems do they solve? I typically use cards for this section, maybe with some icons to add visual interest. It breaks up the page and makes the information easier to scan.About Section
This is where the company sells itself. Who are they? What's their history? Why are they the right choice? Let visitors get to know the people behind the business. It humanizes the company and builds trust.Additional Content Section
This is the flexible middle part. Google likes to see content on the homepage, and I recommend at least 1200 words. I use this section to add extra content around their keywords and services, which helps with SEO.
I put it in the middle because people tend to remember the first and last parts of a website most. Services go up top so people remember what the business does. Testimonials go at the bottom so people leave with positive impressions. The SEO content sits in between.
This section can also include things like "reasons to choose us" or a step-by-step breakdown of how their process works. It's a catch-all for whatever additional info the client wants to showcase.Gallery or Portfolio
Show off the client's best work. Pretty straightforward.Testimonials
End on a high note. Let real customers explain why this business is great. I also like linking to a dedicated testimonials page with all their reviews. This is honestly a content gold mine: it's organic, naturally written by actual people, and it's stuffed with the client's keywords without even trying. Testimonials are one of the best free SEO tools out there. Add as many as you can.Footer
Contact info, logo, maybe a mini sitemap, social media links. The usual stuff.Adding Interior Pages
Once the homepage is locked in, the rest of the site gets easier because you've already established the visual language.
For interior pages, I keep things simpler. The hero section on an interior page is usually smaller, just a basic banner with the page title and maybe a short subtitle. Then the content follows the same rules: proper spacing, clear hierarchy, and consistent styling with the rest of the site.
Most sites need the usual suspects: About, Services, Contact, maybe a Blog or FAQ page. Some clients will have specific needs like a Team page, a Careers section, or individual service pages. The structure adapts, but the design principles stay the same. You're just slotting content into the framework you've already built.
Wrapping Up
So that's my process. Expose yourself to good designs so you have a mental library of layouts. Sketch it out on paper first. Refine it in Figma. Get client feedback and iterate. Then build it.
Top comments (0)