Colophon
How this site is built.
The same methods we use for clients, written down so you can check them.
The name
Madar (مدار) is Arabic for orbit. Ops stands for Online Presence Studio. Put together: the studio that builds the thing your business orbits around online. That is why the home page opens on an orbit of the sites we have built.
Build
| Pages | Static HTML, generated by a small Node script from one content file in two languages. No framework, no runtime dependencies. |
|---|---|
| Languages | English at /, Arabic at /ar/, with hreflang, full right-to-left mirroring and separate Arabic type. |
| Caching | Scripts and styles carry a content hash and are cached as immutable, so returning visitors never get a stale file. |
| Hosting | Netlify |
Type and colour
| Display | Schibsted Grotesk, weight 600 |
|---|---|
| Text | IBM Plex Sans · IBM Plex Sans Arabic · IBM Plex Mono |
| Fonts | Self-hosted WOFF2, preloaded per language |
| Palette | #11151C graphite · #F3F1EC paper · #9C5F2A copper |
The orbit
The home page model is three.js with a physically based material on each panel, an image-based environment for reflections, soft shadows and AgX tone mapping. Each panel is a real screenshot of a site we built. It loads after the page is readable, renders only while something moves, pauses when scrolled away, and on phones waits for your first touch, showing a still until then.
Accessibility
We build to WCAG 2.2 AA: visible focus, 44 pixel tap targets, linked form errors, a focus-trapped menu and reduced motion respected everywhere. Every word of content is in the HTML, so the site reads without JavaScript. Press / on any page to jump anywhere with the keyboard.
What it does not have
No tracking scripts, no cookie banner, no loading screen, no autoplay sound and no custom cursor.
Start a project
Put your business at the center.
Tell us about your business in one short call. A first version follows within a week.
Start a project Riyadh