Journal

Observations on craft, code, and the details that matter.

Writing about the decisions behind the work — typography, systems, performance, and the quiet discipline of building things well.

AccessibilityCase StudiesContent StrategyConversionDesign SystemsDesign TokensFront-End CraftMotionPerformancePortfolioProcessTypographyUXWeb Design

01.

Case Study Layouts That Convert in 2026: A Studio Template You Can Reuse

Most portfolio case studies bury the work under walls of process. Here is the layout structure that actually moves visitors toward enquiry.

Case StudiesWeb Design
02.

Design System Governance for Small Teams: The Minimum Structure That Prevents Drift

Small studios do not need design ops. They need three habits that prevent their system from drifting into inconsistency.

Design SystemsProcess
03.

Design Tokens for Small Studios: What to Tokenise (And What to Leave Alone)

Most token systems are over-engineered for studio-scale work. Here is the minimum viable set and why adding more usually makes things worse.

Design SystemsDesign Tokens
04.

Motion with Restraint, Revisited: The 2026 Motion Budget for Fast Sites

Two years on from our original motion philosophy piece. Here is the updated budget: what changed, what stayed the same, and why restraint still wins.

MotionPerformance
05.

Dark Mode for Brand-led Sites: When It Helps, When It Hurts, How to Ship It Cleanly

Dark mode is expected by visitors but poorly implemented on most brand sites. Here is when to build it, when to skip it, and how to do it properly.

Front-End CraftWeb Design
06.

Experimental Navigation Without Accessibility Debt: A 2026 Reality Check

Every studio wants distinctive navigation. Most experimental nav patterns break for keyboard and screen reader users. Here is how to push the design without creating debt.

AccessibilityWeb Design
07.

Reduced Motion, Not Reduced Quality: prefers-reduced-motion Patterns That Still Feel Premium

Respecting motion preferences does not mean gutting the experience. Here are patterns that feel considered in both states.

AccessibilityMotion
08.

WCAG 2.2 for Brand Sites: The 2026 Fix List (Focus, Targets, Dragging, Authentication)

WCAG 2.2 added new criteria that catch brand sites off guard. Here is the fix list for the four that matter most: focus appearance, target size, dragging, and authentication.

AccessibilityWeb Design
09.

Type Systems for the Modern Web: How to Build a Scale That Survives Redesigns

Most type systems break the first time the content changes. Here is how to build a scale that holds up through redesigns, new pages, and real content.

TypographyDesign Systems
10.

Web Fonts in 2026: Variable Fonts Without CLS (Yes, It's Possible)

Variable fonts save HTTP requests and file size. But they still cause layout shifts if loaded carelessly. Here is the 2026 approach that eliminates the tradeoff.

TypographyPerformance
11.

SVG Logo Delivery in 2026: Inline vs Sprite vs Component, and What Breaks in the Wild

There are three common ways to deliver SVG logos on the web. Each has real tradeoffs in 2026, and the 'correct' choice depends on context more than opinion.

Front-End CraftPerformance
12.

Next.js Images for Portfolios: Visual Stability Without Killing Art Direction

Next.js image handling is built for generic web apps. Portfolio sites need different tradeoffs. Here is how to configure it without losing visual control.

Front-End CraftPerformance
13.

Image Weight on Portfolio Sites: The 2026 Compression Workflow That Holds Up

Compression is not a one-off task. Here is the 2026 workflow that keeps portfolio images sharp, small, and maintainable across projects.

PerformanceFront-End Craft
14.

AVIF vs WebP vs JPG in 2026: A Decision Tree for Portfolio Photography

AVIF, WebP, and JPEG each have a place in 2026. Here is the decision tree for portfolio photography, with real compression numbers and implementation patterns.

PerformanceWeb Design
15.

The 2026 Portfolio Page-Weight Benchmark: What Studio Sites Weigh

Studio portfolio sites tend to be heavy. The median home page weighs over 3MB. The best come in under 800KB. Here is what the fast ones do differently.

PerformanceWeb Design
16.

Field Data vs Lab Data: The 2026 Studio Guide to Reading Performance Like a Grown-Up

Lab data tells you what you changed. Field data tells you whether it mattered. Here is how to use both without fooling yourself.

PerformanceFront-End Craft
17.

CLS on Minimal Sites: The Quiet Layout Shifts Most Studios Miss

Minimal sites look stable. Under the surface, font swaps, image loads, and late-injected elements cause layout shifts that CLS catches and users feel.

PerformanceWeb Design
18.

LCP for Brand Sites: The 2026 Hero Image and Type Loading Checklist

LCP on brand sites is almost always a hero image or a heading rendered in a web font. This checklist covers both, with specific thresholds and fixes for 2026.

PerformanceTypography
19.

INP in 2026: Why Your Site Feels Janky Even When It Looks Fast

INP replaced FID for good reason. Here is how to find and fix the interactions that make portfolio sites feel sluggish, even when the initial load is fast.

PerformanceFront-End Craft
20.

Core Web Vitals for Portfolio Sites in 2026: A Pass-Fail Playbook for LCP, INP, and CLS

Most portfolio sites fail at least one Core Web Vital. Here is the 2026 playbook for passing all three without gutting your design.

PerformanceWeb Design
21.

Why Minimal Sites Still Need Structure

Stripping a site back to its essentials exposes every structural decision. Minimal design demands more architectural thinking, not less.

Web DesignTypography
22.

Accessibility for Brand Sites

Brand sites often treat accessibility as an afterthought. Building it into the design process from the start produces better experiences for everyone.

AccessibilityWeb Design
23.

SVG Logos and Asset Pipelines

Managing SVG logos across a production pipeline requires more discipline than most teams expect. The format is powerful but demands consistent handling to avoid asset sprawl.

Front-End CraftPerformance
24.

Image Weight on Portfolio Sites

Portfolio sites depend on imagery for impact, but unchecked image weight destroys the performance that makes that impact possible. Balancing the two is a core design skill.

PerformanceWeb Design
25.

Type Systems for the Modern Web

Typography on the web requires a systematic approach that balances aesthetic intention with technical constraints. Here is how to build type systems that scale.

TypographyDesign Systems
26.

Motion with Restraint

The best web animations are the ones users barely notice. Motion should guide attention, confirm actions, and smooth transitions—not perform for its own sake.

MotionFront-End Craft
27.

Design Systems for Small Studios

Design systems are not just for enterprise teams. Small studios benefit from systematic design thinking, but the system needs to fit the team's scale and workflow.

Design SystemsFront-End Craft
28.

Case Study Layouts That Convert

The layout of a case study page determines whether visitors read deeply or bounce quickly. Structure, rhythm, and hierarchy make the difference.

Case StudiesWeb Design

End of entries

More writing is on the way. In the meantime, explore our work.

Contact us