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 StrategyDesign SystemsFront-End CraftMotionPerformanceTypographyUXWeb Design

01.

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
02.

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
03.

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
04.

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
05.

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
06.

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
07.

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
08.

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
09.

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
10.

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
11.

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
12.

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
13.

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
14.

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
15.

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
16.

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
17.

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
18.

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
19.

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