Back to blog
Tutorial

Anatomy of a landing page that converts visitors into clients

By Flávio Emanuel · · 9 min read

A landing page isn’t a site. It’s a funnel.

Most clients who reach out ask for “a website.” When I dig into what they actually need, it’s a landing page. A single page with one goal: turn the visitor into a contact. Not a reader, not a follower. Someone who sends a message or fills out a form.

The difference between a landing page that converts and a decorative one is in the structure. Not the design, not the button color, not the font. In the section order, CTA placement, and copy that speaks the language of whoever’s reading.

With Family Pilates, the LP has Lighthouse 98 and zero client-side JavaScript. Beautiful, fast. But what makes it work is the section sequence: first shows the result, then explains the method, then social proof, then CTA. Each block answers a question the visitor has at that point on the page.

The hero section decides if the visitor stays or leaves

The visitor takes 3 to 5 seconds to decide whether to continue on the page or go back to Google. The hero section needs to answer three questions in that time: what you do, for whom, and what the result is.

This isn’t the place for the company history. Not for mission, vision, and values. It’s the place for absolute clarity.

For an aesthetic dentistry clinic, a hero that works is: photo of a smile with dental contact lenses + direct headline (“Your new smile in 2 sessions”) + WhatsApp button. The patient understood the service, saw the result, and has a way to act. In 3 seconds.

A hero that doesn’t work: slider with 5 images of the office facade, headline “Welcome to our space” and a “Learn more” button. The visitor doesn’t know what you do, hasn’t seen results, and the button leads to another page instead of facilitating contact.

Components of an effective hero:

  • Headline with clear benefit (not a technical feature)
  • Subtitle with specificity (timeline, result, differentiator)
  • Image showing real results (not stock photo)
  • Primary CTA visible without scrolling (above the fold)

Problem section: connect before selling

After the hero, the visitor needs to feel that you understand their situation. Before showing the solution, validate the pain.

For dental clinics, the pain is clear: “Do you smile with your mouth closed in photos? Do you avoid showing your teeth in meetings? Have you researched dental contact lenses but were scared by the price or procedure?”

This block doesn’t need to be long. 3 to 4 short sentences that describe the visitor’s situation with precision. When they read it and think “that’s exactly it,” trust increases and they keep reading.

The most common mistake is skipping this section and going straight to a service list. Services without context don’t create connection. The visitor sees a list of procedures and doesn’t know which one solves their problem.

With GPM2, the LP opens with the target audience’s problem: companies paying more taxes than necessary due to lack of tax planning. Before talking about the solution, it validates the pain. Then presents the service as the answer.

Solution section: show the how, not just the what

With the pain validated, now show how you solve it. Not with technical jargon. With practical results.

Instead of “We perform ceramic laminate procedures with cutting-edge technology,” use “Your dental contact lenses are ready in 2 sessions. The procedure is painless and the result is permanent.”

The visitor doesn’t want to know the technical name of the material. They want to know if it hurts, how long it takes, and what it looks like.

This section works best with:

  • Numbered process steps (e.g., “1. Evaluation, 2. Molding, 3. Cementation”)
  • Photo or video of the procedure/result
  • Concrete differentiator (timeline, warranty, specific technique)

With Tok Final, the solution section shows the installation process in 4 steps with simple icons. The construction manager understands in 10 seconds how it works. No meeting needed to decide whether to get in touch.

Social proof: testimonials kill objections

Client testimonials are the most underestimated section. Most sites place a generic slider with “Excellent service! I recommend!” signed by “Maria S.” This convinces nobody.

Testimonials that convert have three elements:

  • Full name and real photo (or video)
  • Specific problem the client had before
  • Concrete result they got after

“I was embarrassed to smile in photos. After getting dental contact lenses with Dr. [name], I started smiling without thinking about it. The procedure took 2 sessions and was painless.” That’s social proof that works.

Video is even better. A 30-second video testimonial is worth more than 10 written ones. The visitor sees the real person, hears the emotion, and trusts.

With Family Pilates, the testimonial carousel is the only part of the page that loads JavaScript (12 KB). The rest is static HTML. The decision to invest those 12 KB was precisely because testimonials are the section that most impacts conversion.

With FitPlan, student testimonials with real results (progress photos, weight numbers) helped reduce cancellations by 37%. Social proof doesn’t only convince new clients. It reinforces the decision of those who already bought.

FAQ section: break objections before they become dropout

The visitor who made it this far is interested. But they still have questions that might prevent contact. The FAQ exists to resolve those questions without them needing to ask.

The right questions aren’t the ones you want to answer. They’re the ones the client asks before buying. For aesthetic dentistry:

  • “Do dental contact lenses hurt?”
  • “How long does the procedure take?”
  • “Do they need to file down the natural tooth?”
  • “What’s the investment range?”

Each answer should be short (2 to 4 sentences), objective, and contain a concrete data point. A number, timeline, or comparison. Vague answers like “it depends on each case” don’t resolve the objection, they postpone it.

A well-crafted FAQ also helps with SEO. Google extracts questions and answers for featured snippets if you implement FAQPage Schema. This means your FAQ question can appear directly in search results before the visitor even clicks your site.

I detailed how to implement FAQ Schema in the post about technical SEO for developers. It’s the fastest configuration with the biggest impact on rich snippets.

CTA placement: it’s not just a button at the bottom

The most common mistake: placing a single contact button at the very bottom of the page. The visitor who was convinced halfway through doesn’t want to scroll to the end to act.

CTAs need to appear at least 3 times:

  • In the hero (above the fold, visible without scrolling)
  • After social proof (when trust is high)
  • At the end of the page (for those who read everything)

For clinics, the primary CTA is WhatsApp. The floating button that follows scrolling is mandatory. But beyond that, contextual CTAs within sections convert better.

Example: after the before/after section, a CTA “I want to schedule my evaluation” makes more sense than a generic “Contact us.” The CTA text needs to reflect what the visitor wants at that moment, not what you want them to do.

With Soline, CTAs change text according to the section. After energy savings: “I want to reduce my electricity bill.” After success cases: “I want a project for my company.” Each CTA speaks the language of the context.

Speed kills conversion silently

None of these sections matter if the page takes too long to load. The visitor who waits 4 seconds doesn’t see the hero, doesn’t read the testimonial, doesn’t click the CTA. They’re already gone.

A landing page needs to load in under 2 seconds on mobile. This requires:

  • Optimized WebP images with lazy loading
  • Zero unnecessary JavaScript (Astro delivers 0 KB by default)
  • Self-hosted fonts with font-display: swap
  • Hosting with global CDN (Vercel, Netlify)
  • Lighthouse above 90

I detailed all these optimizations in the post about why your website loads slowly. If the LP looks good but is slow, it’s losing conversions without knowing.

Landing page conversion checklist

  • Hero with clear headline, result image, and CTA above the fold
  • Problem section that validates the visitor’s pain
  • Solution section with clear process and concrete results
  • Minimum 3 real testimonials with name, photo, and specific outcome
  • FAQ with 4-5 real client questions + FAQPage Schema
  • CTA at least 3 times on the page
  • Floating WhatsApp button across the entire page
  • Load time under 2 seconds on mobile
  • Lighthouse above 90 in Performance
  • Meta tags and Schema.org configured

The LP that converts answers the right questions, in the right order, fast enough that nobody bounces. If the structure is right, the design can be simple and still work.

Next step

Need a dev who truly delivers?

Whether it's a one-time project, team reinforcement, or a long-term partnership. Let's talk.

Chat on WhatsApp

I reply within 2 hours during business hours.