Hair salon website design that fills the book

Most salon websites are designed to be admired. The good ones are designed to be used, usually by someone on the couch at 9pm, phone in one hand, thinking "I really need my colour done". That person has about ten seconds of patience. If they can't see your prices, your work and a way to book, they go back to Google and try the next salon.

Here are the twelve things that make the difference. For each one there's a quick test you can run on your own site right now.

Booking comes first

1. A "Book" button that's always in reach

Every page, including the home page, the services page and the team page, should have a clear way to book at the top. On a phone it should stay on screen as the visitor scrolls. Label it "Book now" or "Book online". "Contact us" makes the client do the work.

Test it: open your site on your phone. Can you see a way to book without scrolling? Scroll to the middle of the services page. Can you still see it?

2. Booking that happens on your own website

When the Book button sends a client to a different website, three things happen. They leave your brand at the moment they've decided to buy. They may land on a page that shows other salons too. And the visit, which Google counts as a sign your site is useful, ends on someone else's domain. Booking on your own site, at your own web address, keeps the client, the data and the credit with you.

Test it: tap Book. Does the address bar still show your domain?

3. As few taps as possible

Every extra screen loses clients. The best flows go: choose a service, choose a stylist (or "anyone"), pick a time, enter details, pay. Don't make people create an account, and don't ask for anything you don't need.

Test it: book a haircut on your own site and count the taps. Ten or fewer is good. If you gave up, so do your clients.

Show the menu and the work

4. Services with prices and times

"How much is a half head of foils?" is probably the most common message a salon gets. Answer it on the site. List every service with a price, or a "from" price when it depends on length and thickness, and how long it takes. Clients who can see a price book with confidence. Clients who can't often assume it's expensive and keep looking.

Test it: could a new client work out roughly what their appointment will cost without messaging you?

5. Your own photos, shot well

Stock photos of models tell clients nothing about you. Your own before-and-afters tell them everything. A few habits make an ordinary phone photo look professional:

• Face a window. Soft daylight flatters colour. Salon downlights turn blondes yellow and shadows green.
• Use the same spot every time. A plain wall, the same angle, the same distance. Consistency makes a gallery look curated.
• Shoot portrait (4:5). It fills a phone screen and suits Instagram, so one photo works everywhere.
• Show the back for colour. Balayage, foils and blends read best from behind with the hair smoothed out.
• Always get permission before posting a client's photo, especially where their face can be seen.

Test it: are the photos on your site of your own work, taken in the last year?

Easy to find, quick to load

6. Your suburb, in words

People search for "hair salon Ponsonby" or "balayage Papakura", not your salon's name. Google can only match you to those searches if the words are on your page. Put your suburb and city in your page title, in your main heading or opening line, and in your footer with your full street address. Add a map and a one-tap directions link.

Test it: look at the tab title in your browser. Does it say what you do and where, like "Salon Name | Hair Salon in Suburb, City"?

7. Speed

A salon site should appear almost instantly, even on 4G in a car park. The usual cause of slow sites is huge photos uploaded straight from a camera. Every image should be resized and compressed before it goes on the site. Heavy video backgrounds, pop-ups and extra plugins all add to it.

Test it: turn off Wi-Fi and open your site on mobile data. Count how long it takes before you can see and tap the Book button.

Build trust before they walk in

8. A team page with specialties

Clients book people, not buildings. For each stylist, show a photo, a line about what they love doing (curly cuts, lived-in blondes, colour corrections), and ideally a way to book with them directly.

9. Clear policies, before payment

Your deposit, cancellation and lateness policies should appear on the booking screen, not hidden in fine print. Clear terms prevent disputes and bad reviews. If you're setting yours up, our salon deposit policy guide includes a free template.

10. Opening hours that are right, everywhere

If your website says open until 7pm and Google says 5pm, clients trust neither. Keep your hours identical on your site, your Google Business Profile and your social pages, and update public holidays ahead of time. Showing "Open now" helps too.

11. Proof from real clients

A few genuine reviews, the product brands you use, and your qualifications or awards all reassure a first-time client. Use real reviews and link to your Google reviews so people can see they're genuine. Never invent or copy testimonials. Clients and regulators both take a dim view of fake reviews.

The technical basics

12. What Google needs to see

You don't need to be technical, but whoever builds your site should tick these off:

• A secure address (https, with the padlock), and your domain in your own business name.
• A unique page title and description saying what you do and where. This is the text Google shows in results.
• One main heading per page that describes it.
• Mobile-friendly layout, with text you can read without pinching and buttons you can tap with a thumb.
• Business details in structured data (the "HairSalon" or "LocalBusiness" schema), which helps Google understand your address, hours and phone.
• Alt text on images, such as "balayage on long brunette hair". It helps visually impaired visitors and image search.
• Nothing blocking Google. A forgotten "noindex" setting from the build stage can keep a site invisible for years.

Getting the look right

Once the twelve are in place, design is what makes a client feel "this is my kind of salon". The best salon sites have a few things in common:

• Let the photos do the work. Big images of your own work, plenty of white space, and not much else.
• Two typefaces, maximum. Usually an elegant serif for headings and a clean sans-serif for everything else.
• One accent colour, taken from your salon interior or branding and used for buttons and links. Too many colours looks messy.
• Match your salon's personality. A calm, minimal studio and a bold, colourful one should feel different online, just as they do in person.
• Short sentences. Nobody reads long paragraphs on a salon site. Say it in a line.

If you'd like to see what this looks like in practice, browse the six Lustre templates. Each is built around these principles, with booking on the salon's own site.

Check your own site in 20 seconds

Going through all twelve by hand takes a while, so we built a free salon website check. Enter your web address and it tests the essentials: whether you're on your own domain, booking, mobile setup, speed, Google basics, contact details and more. You get a score and a plain-English list of what to fix.

Keep reading

• Salon deposit policy: how much to charge, and how to word it
• How much does a salon website cost in New Zealand?