uxmal cuellar logo with blog text under

Homepage Layout for Service-based Website: What to Include

a4 paper with website wireframe sketched out with black marker on wooden desk

What's in this article

When creating a service-based website it can be challenging trying to figure out how to lay out the content of your site or what to put in it. We’re going to go through the ideal service-based website and what sections to put on your homepage. so how do you lay out your service-based website?

Your website should include elements that show the benefits and results of working with you and make visitors want to hire you so they can get those same results. This can be in the form of reviews, written or video format, explainer videos, big name clients, case studies, a strong headline and CTA

Hero Section

The hero section is the first thing you see on a web page, right above the fold. When someone lands on your page they should know what you do, what they have to gain and what to do next.

Hero image

The first element of this page is the hero image its goal is to present an overview of your site’s most important content and get the visitors to explore your site. An ideal hero image will be eye-catching, support your headline and subheading and be authentic. 

This could be images of a person using your services, an illustration, animation or background video showing an overview of your services 

Bonus tips:

  • Dont use stock images unless it relates to your offering and messaging
  • Stock images don’t look very authentic. And if it’s not authentic then is it trustworthy?
  • Hire a pro photographer, illustrator

Headline

The second is a headline, it is a short sentence describing what you do. It should be simple to understand, compelling and targeted towards your audience. Doing this in a few words can be difficult, this is where subheadings come in.

Subheading

Next are sub-headings, this is a sentence or two expanding more on your business and its offering. You could also add in what they have to gain when using your services.

Call To Action (CTA)

Lastly, is a call to action that you want your visitor to do next. Make it stand out compared to other elements in this section so is easy to find and also keep them to a minimum. Avoid using the default ‘Send’ as a CTA. you can be very specific with them e.g Sign up for a 30-day free trial. Some more examples are;

  • Book a session
  • Call now
  • Subscribe 
  • Free trial
  • Buy now

Social proof

Social proof does have to be left at the bottom of the website. You can build trust straight away by adding some social proof to your hero section. Your headline and subheading may be compelling but what others say about your services is the cherry on top. 

The example below shows a great example of how to add some social proof to your hero section. Here are other ways to add some social proof 

  • name dropping big name companies/brands using your services
  • Mention the number of people using your services 
  • Testimonial snippets
  • Google reviews 5-star rating badge
hero section of cleint manager io

Add a “Featured in” or “Trusted by”

You’re trying to build trust as quickly as you can, in this section show visitors that you have a history of working with high-profile clients, this reinforces the idea that potential clients can trust your services because a well-known brand has trusted you before.

Show big-name company logos that you have worked with or have been featured in e.g Business Insider, BuzzFeed, Forbes, etc. Alternatively, you could showcase the certificates and/or awards you have acquired working in your field. Above is an example from envato.com

Benefits of Working With Us Section

With your experience in the industry, you would have noticed a pattern of results, concerns and questions that past customers have had. In this section, you can address those upfront, and list them out. Try and come up with at least 6, here are a couple of questions to get started;

  • What questions do you get asked on a regular basis?
  • What concerns do you address when working with you?
  • What guarantees can you promise?
  • What is the main goal that people want to achieve when hiring you?
  • Do you offer affordable value-for-money prices or premium white glove prices?

Featured Testimonial

Have you worked with a high-profile or well-known company? This section is a great place to put a testimonial from them. If visitors see that you have worked with a high-status client or company and they advocate for your services with a testimonial then this will reinforce the trust between you and a visitor.

Social validation has the added benefit of showing that you have authority in the field especially if it comes from a high-profile client.

Don’t know how to ask for a testimonial? Here’s a template from the FreelanceMVP YouTube channel that you can use too:

Dear [NAME],
It would be super-helpful if you gave me a testimonial for my business, it’s totally free and they REALLY help me to win more work, so it would mean a lot to me. 2-3 sentences would be really great, here are some things that might help:

  • How long have we known each other?
  • Was there a time that I helped you with something that meant a lot to you? 
  • Was it something you were struggling with for a long time?
  • Why was it meaningful to you?
  • Do you think this says something special about my character?
  • Would you recommend people work with me?

Thank you again [NAME]. I really appreciate you helping me with this. It means a lot to me

All the best,

[ Your name ]

Bonus tip! make sure to call ahead or talk to them in person before sending this email, it increases your chances of them following through. This is from FreelancerMVP, thank you Evan!

Explainer Video

You could change it up and place a video in this section. A great video would be an explainer video of a customer avatar and their journey of trying to solve their problem.

They try to do it themselves or use a competitor’s service but they still don’t get the results they were looking for. Then they find your services through one of your marketing channels and this is where you go through your process to ensure your customer gets the results they were looking for.

Upwork has plenty of freelancers looking for work or you could try to find one here or on other platforms like

  • Fiverr.
  • Toptal.
  • Jooble.
  • Freelancer.com.
  • Flexjobs.
  • SimplyHired.
  • Guru.

Case study Section

Showcase one of your best success stories where a client really benefited from your service. Remember you’re not trying to convince your visitors, you’re showing them the pros of working with you and the possible results they could get from using your services.

Keep it short, and add a small description of the problem, solution and results. For results write them in bullet point form

  • Improved X from Y to Z
  • Decreased X from Y to Z
  • X made in Y days

Quick and easy to read while someone is skimming your site because that’s what a visitor tend to do when they read a website. If they want to learn more about the case study add a link to the case study where you can go more in-depth.

Reviews!

Show off your 5-star reviews! Don’t hide them in a carousel lay them all out for everyone to see, one after another. You worked hard to build your business and now showcase the compliments that people have said about you and your business.

Don’t forget to add a badge from Google so that people don’t think that you wrote them yourself. And for good measure add a link to your Google reviews page so they can view more if they wish.

People care more about what complete strangers say about your company than what you have to say yourself.  They also have the added benefit of reinforcing that you can produce results consistently for many people over and over again.

So if someone chooses your service they are more than likely to get the same results as well.

Testimonials in Video Format

People feel more of a connection when they can see a face. Yes, Google reviews have those little thumbnails that sometimes have someone’s face but, seeing someone’s face and seeing them moving, acting, smiling, or frowning humanizes the content. Text base reviews have no emotion it’s impersonal.

79% of people have watched a video testimonial to find out more about a company, product or service, why not add video testimonials to your website? Amazon does it… Don’t get me wrong google reviews are important too, especially for local SEO, but adding a video testimonial is the cherry on top.

Start asking past clients, especially the happy ones, to send a quick 1-minute video could be on their phone, through Loom, or whatever they choose and add it to your site. You could even take it a step further and use a snippet from one of your video calls with them, just remember to ask for permission before posting!

A Reminder of What You Do

There’s a high chance that visitors are skimming through your site so just add a short reiteration of your tagline that you used in the hero section just to remind them of what you do. Images with 3 benefits will fit perfectly here, keep it short and simple.

Have An Extra Service You Provide?

Every website should have a goal and focus the majority of its efforts on this goal eg get visitors to call, book, subscribe etc this is what I call a 1st tier goal. 2nd tier goal could be an upsell or an extra service you provide. 2nd tier goals give users an option to express interest without having to commit too much.

Contact Form & Call to Action

You may be tempted to add a FAQ here, but here is not the place to add it. Your website goal is for your visitors to reach out or purchase your services.

If they have a question then they can fill in the contact form and ask you, if they are convinced after seeing all the benefits that other clients have gained then they click the call to action but if there’s a FAQ that answers their question then why should they bother reaching out it. 

Alternatively, you could put it on another page. If you’re stuck and need help I’m here to help 👇

Need a hand? I've got 4 ways to make your life easier.

1. How good is your website at booking clients? Answer 24 questions and get actionable tips today and see where you can improve your website

2. Website Audit Roast: This is where I give you personalized improvements for your website. Get a website audit roast for free! saving you time and money!

3. Branding design: Stop blending in! Ignites your unique branding. Get a captivating narrative, and stunning visuals, and leave your mark on the world.

4. Web Design: Your website isn’t just a digital portfolio, it’s a lead magnet. I’ll design a user-friendly experience that turns visitors into clients.

How good is your website at booking clients?

Answer 24 questions and get actionable tips today

Share this article on:

See all Articles