Bilingual brand website
An architecture and modular manufacturing group needed a website that matched the standard of its brand and served clients at home and abroad. Large imagery, uncompromising sharpness, and both languages visible to search engines.
- Industry
- Architecture and modular manufacturing
- Scope
- Design build · Front end · Multilingual · SEO · Performance
- Stack
- React · TypeScript · Vite · GSAP · Build-time prerendering · Multi-size WebP srcset
Challenge
Uncompromising image quality
Full-screen architectural photography is the heart of the brand. It had to stay sharp on 5K displays without sending oversized files to phones.
Two languages, equal weight
Both the English and Chinese versions had to be indexed, and switching language had to keep visitors on the same page.
Faithful to the design
Twelve Figma artboards, with every typeface, colour and weight matched, adapted to every screen from phones to ultrawide monitors.
Approach
- 01
Images sized to how they are displayed
We calculated the rendered width of every image from the page layout and generated multiple WebP sizes, so each browser picks the right one for its screen and pixel density.
- 02
Per-language URLs, prerendered
Each language has its own URL, and every page is prerendered to static HTML at build time, so search engines index the full content without running JavaScript.
- 03
Structured translation management
A bilingual glossary and a missing-translation register ensure only approved copy goes live. No page-wide machine translation.
- 04
A fluid type system
Three consistent type sizes scale smoothly between the design baseline and wide screens, preserving the design’s proportions everywhere.
Results
- 12
- design artboards built as fully responsive pages
- 45/47
- page images delivered at 2× sharpness on 5K displays
- 49.7 MB
- of unused image assets removed from the build
- 2
- languages, every page prerendered to static HTML
At the client’s request, their name and logo have been withheld.
Tell us your plans for going global
Message us on WeChat or call, tell us about your products and target markets, and receive a website plan within 3 business days. Free, with no obligation.
Scan to add us