Casita Amarilla ist ein Stundenhotel für erwachsene Paare in der Carrer de Pàdua 83 in Barcelona, mit Zimmern ab 30 € und telefonischer Buchung. Die alte WordPress-Website versteckte praktische Informationen in einem in die Jahre gekommenen Desktop-Layout. Das passte schlecht zu Menschen, die unterwegs Preise vergleichen oder die Verfügbarkeit prüfen. Zuerst ersetzten wir sie durch vorgerenderte Seiten; später entwickelten wir die Auslieferung zu einer serverseitig gerenderten React-Website auf Netlify weiter. Das heutige Produkt stellt Routen in 20 Sprachen bereit, zeigt Preise und Öffnungszeiten deutlich an und hält den Buchungsanruf über den gesamten Weg hinweg erreichbar.
Kundenprojekt. Clutch Developer hat die Website, den Veröffentlichungsablauf, die Marketingmessung und die Berichtswerkzeuge gebaut und betreibt sie. Hotel und Kundenservice gehören Casita Amarilla.
Was wir geliefert haben
- Eine Website in 20 Sprachen. Spanisch, Katalanisch und Englisch stehen neben 17 weiteren Sprachversionen, jeweils unter einem eigenen URL-Pfad, mit Spracherkennung, dauerhaft gespeicherter Auswahl, lokalisierten Metadaten, hreflang-Links und einer generierten Sitemap. Die aktuelle Anwendung rendert mit TanStack Start und Netlify vollständiges HTML auf dem Server.
- Ein auf das Telefon ausgerichteter Buchungsweg. Dauerhaft erreichbare Anrufaktionen, klare Öffnungszeiten, Zimmerseiten, Anfahrtsinformationen, FAQ und eine Preisübersicht halten die vor dem Anruf benötigten Angaben nahe bei der Buchungsschaltfläche. Die Telefonnummer ist ein echter
tel:-Link und kein dekorativer Text. - Eine kontrollierte WordPress-Migration. Weiterleitungsregeln führen alte Seiten-, Beitrags- und Medienpfade zu aktiven Zielen. Kanonische URLs und Sitemap-Prüfungen schützen zugleich den Umzug einer etablierten Domain in die neue Sprachstruktur.
- Messung mit Einwilligung. Tags für GA4 und Google Ads laden erst nach der Zustimmung. Die Website erfasst klar definierte Ereignisse für Anrufklicks, Formulare, Sprachwechsel und Bloglektüre und führt außerdem aggregierte eigene Zähler, ohne IP-Adresse, User-Agent oder Besucherkennung zu speichern.
- Versionsverwaltete Inhalte und Berichte. KI-gestützte Abläufe helfen beim Vorbereiten und Prüfen mehrsprachiger Blogtexte; veröffentlicht werden die Beiträge dennoch als versionierter Quelltext über den normalen Build. Private Berichte und eine dokumentierte wöchentliche Routine führen Website-, Such-, Anzeigen- und Anrufdaten in einer operativen Ansicht zusammen.
Am Anruf ausrichten, nicht an Seitenaufrufen
Die wichtigste Conversion ist ein Telefonat, in dem die Verfügbarkeit bestätigt wird. Daraus folgt eine klare Reihenfolge für die Oberfläche. Vor dem Anruf brauchen Besucher den aktuellen Preis, die Öffnungszeiten, die Adresse und genügend Zimmerinformationen für eine Entscheidung. Danach soll die Website nicht im Weg stehen. Die Buchungsaktion erscheint deshalb im Header und in einer dauerhaft sichtbaren mobilen Steuerung. Dasselbe Ziel wird auf Start-, Preis-, Zimmer-, Lage-, FAQ- und Artikelseiten wiederverwendet.
Die Preise waren der dichteste Teil dieses Weges. Sie hängen von Aufenthaltsdauer und Wochentag ab, während die Öffnungszeiten im Wochenverlauf wechseln. Die Implementierung hält diese Angaben zentral, leitet anhand der Barcelona-Zeit die aktuelle Preisstufe ab und zeigt auf kleinen Bildschirmen vor der vollständigen Tabelle eine kompakte Zusammenfassung. Eigene Prüfungen vergleichen Preiszusammenfassungen, den Hinweis zum aktuellen Zustand, Öffnungszeiten und Buchungslinks. So kann eine Textänderung nicht unbemerkt zwei Seiten mit unterschiedlichen Bedingungen hinterlassen. Auch der Lagebereich erfüllt eine praktische Aufgabe: Hinweise zu öffentlichen Verkehrsmitteln und Parkmöglichkeiten führen zurück zum Anruf.
Veröffentlichung und Messung sind Teil des Produkts
Der Blog ist eine versionsverwaltete Funktion und kein getrenntes Redaktionssystem. KI-gestützte Werkzeuge können einen Beitrag entwerfen oder übersetzen. Der fertige Text liegt jedoch neben der Anwendung, durchläuft Sprach- und Umfangsprüfungen und wird mit demselben Build wie Preise und Zimmerseiten ausgeliefert. Damit lässt sich ein Beitrag vor der Veröffentlichung prüfen; Links, Metadaten, Daten und übersetzte Varianten bleiben an den rendernden Code gebunden. Ein automatisiertes Schreibwerkzeug erhält außerdem keinen direkten, undurchsichtigen Weg in die Produktion.
Zwanzig Sprachen verursachen mehr Pflegeaufwand, als ein Sprachumschalter vermuten lässt. Eine Route kann den richtigen Sprachcode tragen, während ein Ersatzabsatz, eine FAQ-Antwort oder eine Bildbeschreibung auf Spanisch oder Englisch stehen bleibt. Zur Lieferung gehören deshalb generierte Sprachkataloge und Prüfungen für Blogumfang, Weiterleitungen, Spracherkennung und Bundle-Inhalte. Sichtbar ist nur ein einfacher Ablauf: Sie wählen eine Sprache und die Auswahl bleibt erhalten. Die wesentliche Einschränkung liegt darin, alle gemeinsamen Fakten abzugleichen, sobald sich Preise, Öffnungszeiten oder Buchungshinweise ändern.
Die Messung folgt derselben Regel. Google-Tags bleiben deaktiviert, bis Besucher der Analyse zustimmen. Danach unterscheiden benannte Ereignisse einen Anruftipp von einem gesendeten Formular oder einem vollständig gelesenen Artikel. Aggregierte eigene Zähler erfassen grundlegende Seiten- und Aktionssummen, ohne Besucher zu identifizieren. Die Berichtsebene kombiniert diese Signale mit Search Console, Google Ads und historischen Serverdaten und dokumentiert, wo Datensätze nicht direkt vergleichbar sind. Eine wöchentliche Arbeitsliste macht daraus Prüfaufgaben, ohne einen Anzeigenklick als bestätigte Reservierung darzustellen.
Umfang und Projektrolle
Der fertige Umfang reicht über ein Redesign hinaus: öffentliche Seiten, 20 Sprachrouten, WordPress-Migration, Anruf- und Formularabläufe, Einwilligungssteuerung, Blogveröffentlichung, Analyseinstrumentierung und private Berichte. Die Kontaktroute unterscheidet eine Reservierung von einer allgemeinen Anfrage und kann die Nachricht über einen eingerichteten E-Mail-Anbieter zustellen. Ist serverseitiger Mailversand nicht verfügbar, bereitet der Browser dieselbe Anfrage in der E-Mail-App des Besuchers vor. Das System ersetzt die Rezeption nicht und entscheidet nicht über die Zimmerverfügbarkeit. Die Website bereitet Besucher auf den Anruf vor, trägt den nötigen Kontext dorthin und misst die digital messbaren Schritte. Casita Amarilla bleibt für Preise, Verfügbarkeit, Kundenservice und Aufenthalt verantwortlich.
Als die operative Oberfläche wuchs, entwickelte sich das Projekt von einem schnellen vorgerenderten Start zu einer serverseitig gerenderten Anwendung. Das Produktziel blieb gleich: klare Informationen und ein kurzer Weg zum Buchungsanruf. Websites umfasst den öffentlichen Build und die Migration; Automatisierung und Integrationen umfasst die kontrollierten Inhalts- und Berichtsabläufe darum herum.
Belege und Grenzen
Die gespeicherten mobilen Aufnahmen zeigen Startseite, Preise, Zimmer und Blog; auf der Live-Website lassen sich Sprachpfade und Buchungsanrufe prüfen. Das belegt die öffentliche Umsetzung und die veröffentlichten Inhalte, nicht Anrufvolumen, Buchungsquote oder Auslastung. Casita Amarilla verantwortet Verfügbarkeit, Reservierungen und Kundenservice.