SE

A boutique hotel website where guests request a stay directly

Caravanserai Marrakech is the website of Caravan Serai, a boutique hotel and spa in the Marrakech palm grove. I developed it so guests can send a booking request on the hotel's own site, and so every restaurant, spa treatment, event and activity has its own page that can answer its own Google search.

Developed at the Trafic Genius agency, where I was full-stack developer (2024–2025).

The Caravanserai Marrakech website
Caravanserai Marrakech, live at caravanserai-marrakech.com

The client

Caravan Serai is a boutique hotel and spa on the edge of the Marrakech palm grove (La Palmeraie), inspired by the old caravanserais where travellers rested on their way across the desert. Besides its suites, it runs a Moroccan restaurant and a French one, a hammam and spa, and hosts weddings, seminars and private events, with activities such as yoga, hiking and cycling, and billiards.

What they needed

A hotel like this sells much more than nights. A couple planning a wedding doesn't type the hotel's name into Google; they search for a wedding venue in Marrakech. Someone else searches for a hammam, and a third person for a French restaurant. One home page can't answer all three searches, so each of those offers needed a page of its own.

Guests also needed a short way to ask for a stay on the hotel's own site: pick the dates and a suite, leave a phone number and an email, and let the hotel confirm. A request made there is a direct booking, with no platform in between.

What I built

  • A booking request form

    Arrival and departure dates, the suite (each one listed with its price), the number of adults, a name, a phone number and an email, plus a box to accept the non-refundable policy. It has its own page and also appears on most other pages, so a guest reading about the hammam can book from there.

  • Two restaurants and the menu

    The Moroccan and the French restaurant each have their own page, and the full menu has one too, dish by dish with prices in dirhams.

  • One page per spa treatment

    Hammam and massages, hair removal, body care, and hands and feet each get a page, with the treatments and their prices.

  • Events and activities

    Weddings, seminars and private events have a page each, and so do yoga, hiking and cycling, and billiards. A search about weddings has a page about weddings to match it.

  • Contact and directions

    A contact form, the phone number and email, check-in and check-out times, and a Google map to find the hotel.

  • Set up for search

    Built with Next.js, so the text of every page is in the HTML that Google reads. Each page has its own title, description and canonical link, all pages are listed in a sitemap, and the site is hosted on Vercel.

What it lets them do

Guests can request a stay straight from the site, and every restaurant, treatment and event has its own page for search.

Today a guest finds on the site a page for exactly what they want, whether a hammam, a wedding venue or a French dinner, and can send a booking request during the same visit. The hotel gets the dates, the suite, the number of adults and the guest's phone and email, and confirms the stay itself. The sitemap lists 17 pages, and every restaurant, treatment, event and activity is one of them.

Need something like this?

Other projects