Voltair Ibiza

Context

An electrical and air-conditioning installer working in luxury villas and apartments across Ibiza, with an emergency call-out service.

People looking for this service on the island usually search in English: foreign owners, villa managers, property administrators. The site had to treat them as the main audience while still existing in Spanish.

Approach

• Canonical English, complete Spanish. English lives at the root and is the default language for search engines; Spanish sits under /es/ with translated URLs, not the same slug with a prefix. Every page links its twin with reciprocal hreflang.
• Emergencies get their own colour. The brand is cobalt, ink and paper. Amber is reserved for emergencies, which have their own page in each language: the alert stands out because nothing else competes with it.
• Motion in CSS only. Scroll reveals use animation-timeline: view() and the hero entrance is keyframes. Zero kilobytes of animation JavaScript, and all of it switches off under reduced motion.
• One conversion goal. “Send a message” in the header and on every page, leading to a form with per-field errors, a honeypot and consent.
• Local SEO and AI search. Electrician structured data with service area and catalogue, FAQs, breadcrumbs and a service entry per page, llms.txt and explicit access for AI crawlers.

What I built

• Static Astro architecture with route-based i18n and translated slugs, no library
• Design system with Space Grotesk, Inter and JetBrains Mono, with amber reserved for emergencies
• Two Preact islands: modal mobile menu and progress bar
• Pure-CSS scroll animations honouring prefers-reduced-motion
• Contact form with accessible validation and SMTP delivery
• CSP with script hashes, no cookies and no local storage
• Structured data, sitemap with per-language alternates and build-time social images
• Structured-data, smoke, axe accessibility and visual regression tests

Outcome

Live on its own domain since October 2026. A site that speaks the client’s language first and moves without loading a single animation library.

A note on this work

Built at Xpandex, where I run the full cycle: design, development, performance, accessibility, technical SEO and deployment.