A site that loads on two bars of signal
This website is a static Next.js export with drawn SVG illustrations instead of photos, so pages stay light on mobile data.
Sajilo IT Creation, Kathmandu / Web development / Design
The problem
Most people who visit this site do it on a phone, on mobile data, often outside Kathmandu. A company that sells software for weak networks cannot have a website that needs a strong one.
We wanted the site to show how we build for clients: fast first, and honest about the conditions it will be used in.
What we built
The site is a static export. Every page is built into plain HTML ahead of time and served as files, with no server working out a response for each visit.
- Static Next.js export. Pages are generated at build time, so hosting is simple and there is little that can go down.
- Drawn SVG illustrations. The skyline, the product scenes and the diagrams are vector drawings in the page, so there are no photographs to download.
- Content in markdown. Blog posts and project write-ups, including this one, are markdown files rendered at build time.
- Light and dark themes. Both use the same illustrations, because the drawings take their colours from the theme.
Why drawings and no photos
Photographs are usually the heaviest thing on a marketing page. A single hero image can weigh more than everything else on the page together.
An SVG drawing is a short piece of text. It stays sharp on any screen, changes colour with the theme and costs very little data. It also meant we could draw our own products at work, which a stock photo cannot do.
Keeping the pages light
A few rules shaped the build:
- Nothing loads from a server at visit time that could have been built ahead.
- Text is readable before any animation starts.
- Motion is added where it explains something, and the page works without it.
- Article content is rendered to HTML at build time, so no markdown library is sent to the browser.
What changed
The site you are reading is the result. Each page is a set of small files that can be served from anywhere, and adding a blog post or a project means adding one markdown file and rebuilding.