Badar HossainUpdated How We Built Melbourne Clean Pro's New Site
The Melbourne Clean Pro site is a Next.js site with a page for every type of space the company cleans and a quote form that names the job. This is how we built it, and why.
Why a page for each type of space?
A medical clinic, a gym and a mosque need different cleans. A single services page would have to talk about all of them at once.
So each service has its own page: offices, medical clinics, gyms, mosques, Airbnb turnovers and end of lease cleaning. Each page lists the tasks for that space and how pricing works for it. The pages are built from one list of services, so adding a new service adds its page too.
How does the quote form work?
The quote form sends each request to the team by email through Resend. The server checks the required fields first.
The subject line names the person and the type of space, such as a clinic or a gym. The team knows what the job is before they open the message.
How do search engines know where the company works?
- Pages share one title pattern, with the company name on every page.
- The company is marked up as a local business in Melbourne, Victoria, so search engines can connect it to its area.
- A sitemap and a robots file list every page.
- The apex domain redirects to one address, so each page has a single URL.
How does the site explain the way the company works?
Commercial clients want to know who will be in their building. The site gives that its own space:
- A why choose us page covers supervisors on every job, daily contract manager visits and police-checked staff.
- The pricing page explains that a final quote follows a free onsite inspection.
- An FAQ page answers the questions the team hears most.
What is it built with?
- Next.js 14, React 18 and JavaScript.
- Tailwind for styling, and Framer Motion for movement.
- Resend for quote emails.
- Vercel Analytics to see which pages people visit.
- Hosted on Vercel.
First published
Badar Hossain is the Co-Founder and Chief Operating Officer of Ravenence, running operations and delivery.
