The Craft Behind the Code

A website isn't assembled. It's composed.

Published July 2026 · 7 min read

Most websites today are templates with a new logo dropped in. That's assembly, not design. Real craftsmanship shapes typography, motion, and hierarchy on purpose, and it shows up directly in how much people trust you, convert, and are willing to pay for your work. I build personal brand and business websites this way, as an individual freelance web developer rather than an agency running everyone through the same template.

By art, I don't mean decoration. I mean the hours of judgment and care in every choice, the kind you only notice when it's missing.

Why it matters

6 reasons good web design is a business decision

Good design is the reason people trust a site, stay on it, and act on it, long before they'd ever describe it as "good design."

🎯94%

People decide before they read a word

The layout, the type, the spacing. That's the actual pitch, and it lands before your copy ever gets a chance to speak for itself.

(Missouri S&T)
⏱️0.05s

You get milliseconds, not minutes

That's roughly how fast someone judges your site and decides whether to keep scrolling or bounce. There's no second try at a first impression.

(Lindgaard et al., 2006)
🤝75%

Design does a lot of the convincing

Three out of four people judge whether a company is trustworthy from the website alone, before they know anything about the actual service. A sharp site is doing sales work you never see.

(Stanford Web Credibility Project)
📉38%

Ugly costs you customers before they scroll

Over a third of visitors leave the moment a site looks unattractive, regardless of how good the offer underneath it is. You never get the chance to prove them wrong.

💰$100

Good design pays for itself

Forrester Research puts the average return at roughly $100 for every $1 spent on genuinely good design. Most businesses just never run the numbers on it.

(Forrester Research)
🪞Signal

Your site sets the ceiling in people's minds

There's an unspoken rule at play here: whatever your website looks like, sharp or sloppy, people quietly assume that's how you'll handle their actual work too.

The comparison

Composed web design vs. assembled templates

A template gets a business online. A composed site gets a business chosen. Both are websites, but only one is built around you.

What you getComposed SiteTemplateDIY Builder
Built around your content, not a template Yes No No
Typography and spacing chosen with intention Yes Sometimes No
Motion that guides attention, not decoration Yes No No
Performance planned in from the start Yes Sometimes Usually bloated
Core Web Vitals checked before launch, not after Yes No No
Images compressed and served in modern formats Yes Sometimes Sometimes
Hosted on a fast edge network close to visitors Yes Sometimes Depends on the plan
Looks and feels like nothing else in your industry Yes No No
Every detail tested on real devices Yes Sometimes Sometimes
Supports a premium price point Yes No No
My methodology

My web design methodology

"Design as art" means nothing without a process behind it. This is the exact approach every site goes through.

01

Research comes before design

Before a single layout decision, we get on a call. I need to understand your business, not just skim your brand guide, so I know whether the site actually conveys your value proposition instead of just implying it.

02

Typography and rhythm come first

Before anything gets built, I work out how the page should feel: the type pairing, the spacing scale, the rhythm that becomes the site's voice. Everything else is built around that.

03

Your content shapes the layout

I never start from a template. The words and images you give me decide the structure, so nothing gets forced into a box it was never meant to fit.

04

Motion has to earn its place

Every animation is there to guide attention or add a small moment of delight. If it doesn't serve the message, it gets cut before launch.

05

Speed is planned in, not patched on

A beautiful site that loads slowly isn't finished. Performance gets decided alongside every design choice from day one, not fixed afterward.

06

The obsessive polish pass

Hover states, easing curves, spacing down to the pixel. Most sites skip this entirely, and it's usually the part people feel even when they can't say exactly why.

07

Tested on a real phone, in your hand

Design isn't finished at a desktop. Every site gets checked on real phones, since that's where most people will meet your brand.

08

Your feedback shapes the final polish

You review the finished site and flag anything that's off. I refine until it's right, not just technically complete, before the project closes.

The real numbers

The metrics I build around, not just the vibe of "feels fast"

Three of these are Core Web Vitals: the exact numbers Google uses to grade a site's speed, and to help decide where it ranks in search. Every design decision gets checked against them before a site ships. The "measured" numbers below are this site's own, pulled straight from the live PageSpeed report, with the full mobile report as a PDF.

FCPFirst Contentful Paint
Target: Under 1.8sMeasured: 0.4s on this site (desktop)

Measures how long it takes for anything, text, a logo, a background shape, to appear on screen at all. It's the first proof a page is actually loading, before the biggest element (LCP) has necessarily shown up.

How it's kept in range: Critical CSS loads inline instead of blocking on a separate file, fonts are set to swap in without holding up the first paint, and the initial HTML ships fully rendered instead of waiting on client-side JavaScript.

(web.dev reference)
LCPLargest Contentful Paint
Target: Under 2.5sMeasured: 0.5s on this site (desktop)

Measures how long the biggest visible element, usually a hero image or headline, takes to render. It's the metric most people mean when they say a site "feels slow to load," and it's one of the three Core Web Vitals Google uses to rank search results.

How it's kept in range: Every image is compressed and sized before it ships, nothing render-blocking sits in the way of the first paint, and pages are served from the nearest edge server to whoever's visiting.

(web.dev reference)
INPInteraction to Next Paint
Target: Under 200msMeasured: 260ms Total Blocking Time on this site (Lighthouse's lab proxy for responsiveness)

Measures how long a page takes to visibly respond after someone taps a button or link, replacing the older First Input Delay metric in 2024. It's what "feels instant" is really describing, and it's the Core Web Vital most sites fail.

How it's kept in range: Ship only the JavaScript a page genuinely needs, render whole sections as static HTML wherever nothing needs to be interactive, and skip the heavy client-side frameworks that make simple sites feel laggy under load.

(web.dev reference)
CLSCumulative Layout Shift
Target: Under 0.1Measured: 0.012 on this site (desktop)

Measures visual stability: whether things jump around while a page loads, a button you were about to tap moving right as you tap it. Unlike the other metrics here, it's a unitless score, not a time. It's the third Core Web Vital, and usually the easiest one to fix.

How it's kept in range: Every image, video, and embed gets its dimensions reserved before it loads, so nothing shifts once content starts appearing on screen.

(web.dev reference)
TTFBTime to First Byte
Target: Under 0.8s

Measures how fast the server responds the moment someone requests a page, before anything starts rendering. A slow TTFB puts every other metric behind before the page has even started.

How it's kept in range: Every site is deployed on an edge network, so the response comes from a server physically close to whoever's visiting instead of one continent away.

(web.dev reference)
Beyond speed

Fast isn't the only score that matters

A fast site that's inaccessible, insecure, or invisible to search is still a broken site. These are the other categories every build gets checked against, and this site's own scores on each.

100/100Accessibility
Passing: 90+ is "good"

Checks whether a site actually works for people using screen readers, keyboard-only navigation, or who need higher colour contrast: things like proper alt text, labelled form fields, and readable contrast ratios. It matters for real users, and Google treats it as a quality signal too. Worth being honest about: a 100 here means the automated checks pass, not a guarantee, since some accessibility issues only show up with manual testing.

How it's handled: Semantic HTML instead of div soup, every interactive element reachable and labelled for a keyboard or screen reader, and colour contrast checked against WCAG minimums before anything ships.

(Chrome for Developers reference)
100/100Best Practices
Passing: 90+ is "good"

A grab bag of things that separate a professionally built site from a rushed one: no browser console errors, HTTPS everywhere, safe headers against clickjacking and XSS, correctly sized images. Most of it is invisible until something's wrong.

How it's handled: HTTPS and modern security headers on by default via the hosting platform, images served at the right dimensions, and the console kept clean, no swallowed errors, no warnings ignored.

(Chrome for Developers reference)
100/100SEO
Passing: 90+ is "good"

The technical baseline Google checks before it'll even consider ranking a page well: a real title and meta description on every page, crawlable links, a valid viewport tag, structured data that actually validates. Get this wrong and good content never gets the chance to rank.

How it's handled: Every page ships its own title, description, and canonical tag, structured data (JSON-LD) is added and validated, and nothing blocks a page from being crawled or indexed.

(Chrome for Developers reference)
3/3Agentic Browsing
Passing: All 3 checks

A newer category checking whether a site is genuinely browsable by AI agents, not just human visitors, and whether any WebMCP integrations on the page are correct. As more traffic starts coming through AI tools browsing on someone's behalf, this is becoming as real a channel as search.

How it's handled: Content is server-rendered as real HTML instead of hidden behind client-side JavaScript an agent can't execute, so anything reading the page, human or AI, sees the same content.

(Chrome for Developers reference)
Who this matters most for

If perception affects your revenue, this is for you

Some businesses can get away with a generic site. If people are deciding whether to trust or pay you based on what they see, you can't.

Personal Brands & Consultants

Your website is often what decides whether someone books a call at all. A composed site builds trust a template can't fake.

Coaches & Service Providers

Clients are paying for confidence as much as expertise. A site that feels crafted shows you take your own standards seriously before you've said a word.

Startups & Founders

Investors and early customers judge legitimacy fast. A generic template reads as unfinished. A composed site reads as ready.

Premium & Luxury Services

If you charge more, your site has to look like it. People decide what something's worth visually, long before price ever comes up.

Agencies & Studios

Your own website is the one project prospects get to grade you on. It's the clearest proof of what you can do.

Anyone Tired of Looking Like a Template

If your site currently looks like a dozen others in your industry, that's a missed opportunity sitting in plain sight.

FAQ

Common questions

The questions I get asked most when someone's deciding between a template and something built properly.

Isn't a website just picking a nice template?+
A template gets you online, sure. But it's built to work okay for thousands of businesses at once, which usually means it's not built to work great for any one of them. Craft is what closes that gap: shaping the site around your actual content instead of squeezing your content into someone else's layout.
Does design affect how many customers I get?+
Yes, measurably. 94% of first impressions come down to design, and 75% of people judge a company's credibility off the website alone. For a lot of businesses, the site is the first sales conversation, whether you meant it to be or not.
What's the difference between a design-led site and a normal one?+
A normal site asks whether something works. A design-led site asks whether it feels intentional and moves someone toward a decision. You can see the difference in typography, spacing, motion, and all the small details most builders skip because nothing forces them to include it.
Is paying more for craftsmanship worth it for a small business?+
If your website is how people decide whether to trust you, then yes. Forrester puts the return on well-executed design work at around $100 for every $1 spent. It's rarely the biggest line item in a business, but it tends to be doing more work than people give it credit for.
How is your process different from a typical freelancer or agency?+
Design and performance aren't two separate stages for me, they get decided together from the first conversation instead of design-first-optimise-later. I'm based in Sri Lanka and build personal brand and business websites for clients internationally, and since I'm the only person touching design and code, nothing gets lost handing work between teams.
Can a beautifully designed site still load fast?+
It has to, otherwise it isn't well designed, just well decorated. A slow site quietly undoes the trust good design just built. Every site gets checked against real performance targets alongside the visual polish, not after it.
What are Core Web Vitals, and do you optimise for them?+
They're the specific metrics Google uses to grade a site's real-world speed: Largest Contentful Paint, Interaction to Next Paint, and Cumulative Layout Shift. Every site is checked against those numbers, not just eyeballed for whether it feels fast, since they directly affect both user experience and search ranking.

Typography and rhythm, content-first layout, motion that earns its place, Core Web Vitals, accessibility, technical SEO, even how well a page reads to an AI agent. None of it is optional, and none of it gets bolted on after the fact. It's all decided together, for every site, from the first conversation to launch.

Ready for a site that's composed, not assembled?

I build personal brand and business websites with the same care as a craft. Sharp, fast, unmistakably yours, and live in 1–2 weeks.