KAYA Thai Massage — Website for KAYA Thai Massage — Kyiv spa salon
The client came to us with a ready-made design by <a href="https://www.behance.net/stan_shap" target="_blank">Stanislav</a>. We have collaborated with more than 20 designers, and his approach is definitely top-tier. He doesn't just draw a pretty picture; he actually thinks through the responsive layout for all screens and the logic of each element. Our task was to carefully translate this design into code. We delivered pixel-perfect markup, ensured fast loading speeds, wrote clean code, and laid the foundation for multilingual SEO. We thank KAYA for their trust.
Challenge
Starting conditions and the task: • A high-quality finished design — every element is worked through, responsive behaviour is defined for all breakpoints • Pixel-perfect implementation required, no compromises — the client and designer expect exact match to the mockup • Multilingual site (uk + en + ru) with full SEO for a local business in Kyiv • The site must be fast on mobile — most guests book from their phone • Complex interactivity: smooth scroll, galleries, paired animations, video • Everything has to work stably both in Chrome and in Safari (where Lenis smooth scroll has issues)
Solution
⚡ Performance (LCP-driven) • Critical CSS inline, app.min.css preloaded with fetchpriority="high" • Preload of LCP image (hero-poster) with responsive imagesrcset (mobile/desktop) • Preload of critical fonts: Manrope SemiBold/Regular + EB Garamond Italic • WebP as primary format + JPG fallback via <picture> • Lazy-load Fancybox — only loaded on first click on data-fancybox • DNS-prefetch + preconnect to Google (map) and Instagram 🎨 Pixel-perfect markup • Semantic HTML5 without unnecessary divs • Modular CSS following the Stanislav design system • Animations on GSAP 3 + ScrollTrigger — motion matches what the designer intended • Lenis smooth scroll with conditional disable in Safari (unstable there) • Swiper for services and reviews sliders • Custom logic for map iframe interaction (Lenis pauses while the cursor is over the map) 🔍 SEO + AI accessibility • Schema.org HealthAndBeautyBusiness with full data (address, phone, openingHours, geo) • Hreflang uk / en / ru, canonical on every language version • Open Graph + Twitter Cards with the right size (1200×630) • llms.txt — machine-readable description of the business for AI search engines (ChatGPT, Perplexity, Gemini) • robots.txt + sitemap.xml ♿ Accessibility • Semantic tags, ARIA labels, skip navigation • Correct heading hierarchy h1 → h2 → h3 • format-detection="telephone=no" — no auto phone formatting 🛡️ Security • .well-known/security.txt • Clean URLs, no extensions
Result
The result — a working multilingual top-level site. • Pixel-perfect match to Stanislav mockups • 3 languages (uk + en + ru) with proper hreflang • Schema.org HealthAndBeautyBusiness — Google understands this is a Kyiv spa • llms.txt — ChatGPT, Perplexity and Gemini can recommend KAYA in their answers • GSAP animations + Lenis smooth scroll with Safari fallback Full cycle from code to production: • Consulted the client on choosing and purchasing hosting and a domain • Handled publication and production server setup ourselves • Real Lighthouse metrics will be added after the client publicly launches
