Casita Amarilla is an hourly hotel for adult couples at Carrer de Pàdua 83 in Barcelona, with rooms from €30 and booking handled by phone. Its old WordPress site hid practical information inside an ageing desktop layout: a poor fit for someone comparing rates or checking availability from the street. We first replaced it with prerendered pages and later evolved the delivery into a server-rendered React site on Netlify. The current product serves 20 language routes, keeps rates and opening hours explicit, and puts the booking call within reach across the journey.
Client work. Clutch Developer built and runs the website, publishing workflow, marketing measurement and reporting tools. The hotel and its customer service belong to Casita Amarilla.
What we delivered
- A 20-language website. Spanish, Catalan and English sit alongside 17 further locales, each on its own URL path with language detection, a persistent visitor choice, localized metadata, hreflang links and a generated sitemap. The current application renders complete HTML on the server through TanStack Start and Netlify.
- A phone-first booking path. Persistent call actions, clear opening hours, room pages, location guidance, FAQs and a rates view keep the information needed before a call close to the booking button. The phone number is a real
tel:link rather than decorative copy. - A controlled WordPress migration. Redirect rules map the old page, post and media routes to live destinations, while canonical URLs and sitemap checks protect the move from an established domain to the new language structure.
- Consent-aware measurement. GA4 and Google Ads tags load only after consent. The site records defined events for call clicks, forms, language changes and blog reading, and also maintains aggregate first-party counters without storing an IP address, user agent or visitor identifier.
- Source-controlled content and reporting. AI-assisted workflows help prepare and review multilingual blog copy, but posts still ship as versioned source through the normal build. Private reports and a documented weekly routine bring website, search, advertising and call data into one operational view.
Designing around the call, not around page views
The primary conversion is a phone call that confirms availability. That gives the interface a strict priority order. Before calling, a visitor needs the current price, the opening hours, the address and enough room information to decide. After that, the site should get out of the way. The booking action therefore appears in the header and in a persistent mobile control, and the same destination is reused across home, rates, rooms, location, FAQ and article pages.
Rates were the densest part of that path. Prices depend on duration and day, while opening hours change across the week. The implementation centralises those facts, derives the current rate band in Barcelona time and presents a compact summary on small screens before the full table. Dedicated checks compare rate summaries, the current-state banner, opening hours and booking links so a copy edit cannot quietly leave two pages quoting different conditions. The location flow does the same practical job, with public-transport and parking guidance leading back to the call.
Publishing and measurement are part of the product
The blog is a source-controlled feature rather than a separate publishing system. AI-assisted tooling can draft or translate an article, but the resulting copy lives beside the application, passes language and scope checks, and ships through the same build as rates and room pages. That makes a post reviewable before release and keeps links, metadata, dates and translated variants tied to the code that renders them. It also avoids giving an automated writer a direct, opaque route into production.
Twenty languages create a larger maintenance problem than a language switcher suggests. A route can carry the correct language code while a fallback paragraph, FAQ answer or image description remains in Spanish or English. The delivery therefore includes generated locale catalogs and checks for blog scope, redirects, language detection and bundle content. The visible result is simple—a visitor chooses a language and the choice persists—but the important constraint is keeping every shared fact aligned when prices, hours or booking instructions change.
Measurement follows the same rule. Google tags are disabled until the visitor accepts analytics, then named events distinguish a call tap from a form submission or a completed article read. Aggregate first-party counters cover basic page and action totals without identifying a visitor. The reporting layer combines those signals with Search Console, Google Ads and historic server data, while documenting where datasets cannot be compared directly. A weekly operating checklist turns that evidence into review work without presenting an ad click as a confirmed reservation.
Scope and project role
The finished scope is broader than a redesign: public pages, 20 locale routes, the WordPress migration, call and form flows, consent handling, blog publishing, analytics instrumentation and private reporting. The contact route distinguishes a reservation from a general enquiry and can deliver through a configured mail provider; if server mail is unavailable, the browser prepares the same request in the visitor's email app. It does not replace reception or decide whether a room is available. The website prepares a visitor for the call, carries the right context into that moment and measures the digital steps that can be measured. Casita Amarilla remains responsible for prices, availability, customer service and the stay itself.
This project moved from a fast prerendered launch to a server-rendered application as the operational surface grew, while preserving the same product goal: clear information and a short path to a booking call. Websites covers the public build and migration; Automation & integrations covers the controlled content and reporting workflows around it.
Evidence and limitations
The retained mobile captures show the home, rates, rooms and blog pages; the live site exposes its language routes and phone booking links. This verifies the public implementation and published content, not call volume, booking conversion or occupancy. Casita Amarilla controls availability, reservations and customer service.