Skip to content

Reef

Subscribe
English,

Reef Notes

Notes from a small web studio

We build websites for a living and write down what we learn: what actually made a page faster, why a typeface fell apart on Android, how a rough quote became a signed contract. The notebook, not the portfolio.

FeaturedTypography

A type scale you can defend

Ratios are easy to pick and mostly wrong. A scale earns its place when every step has a job on a real page: five sizes, a measure that holds at 320 and at 1440 pixels, and clamp() written so a designer can read it out loud.

Tomas Abaroa6 min read

Latest notes

The most recent entries, newest first. Everything older waits in the archive.

  • Performance

    Measuring what the reader actually feels

    Lab tools measure a robot on fibre. Field data measures your readers on a bus. Here is the smallest honest setup we could build: three metrics, one endpoint, no third party script, and the week our two sets of numbers disagreed by two and a half seconds.

    Noor Benali6 min read
  • Studio

    What a good brief looks like

    Most projects that went wrong were already wrong on page one. This is the brief we now refuse to start without: who decides, what already exists, what counts as done, and the three questions that reveal a budget before anyone has to say a number.

    Mara Lindqvist6 min read
  • Design

    Dark mode is a content problem

    Inverting a palette is an afternoon of work. The hard part is everything the palette does not control: photographs, screenshots, charts, embedded video, and the one brand colour that stops meaning anything once the background goes dark.

    Tomas Abaroa5 min read
  • Craft

    Content collections are a contract, not a folder

    A schema that fails the build is worth more than a CMS that lets anyone publish a broken page. What we validate in Astro, what we deliberately leave alone, and the three rules that keep a Zod schema from slowly turning into a second CMS.

    Mara Lindqvist5 min read
  • Typography

    The real cost of a web font

    A variable font is not automatically cheaper than two static weights, subsetting saves less than people think, and the expensive part is usually the fallback nobody designed. What a typeface actually costs, measured in bytes, requests and reflow.

    Tomas Abaroa6 min read
  • Performance

    A performance budget that survives contact with a client

    A budget is not a Lighthouse score and it is not a Slack message. Here is the one we now write into the contract: four numbers, the device they are measured on, and the sentence that decides what happens when someone asks for a video header in week nine.

    Noor Benali6 min read

Four threads we keep pulling

Every post belongs to exactly one topic, so a thread can be read end to end without wading through the rest.

Who writes here

Two people, both still shipping client work. Each byline leads to everything that person has published.

  • Mara Lindqvist

    Founder and web developer

    Mara opened the studio in 2016 after eight years in agencies, and still writes most of the HTML that ships. She is happiest on the boring parts of a project: naming, data modelling, and the contract clause nobody wants to read.

    3 posts
  • Noor Benali

    Performance engineer

    Noor joined from a retail platform where a hundred milliseconds had a price tag attached, and brought the habit of measuring before arguing. She owns the studio's field data pipeline and the uncomfortable meeting where we show clients what their site does on a five year old phone.

    2 posts
  • Tomas Abaroa

    Interface designer

    Tomas designs in the browser, which is a polite way of saying he redraws his own comps three times before anyone sees them. He runs the studio's type and colour decisions, and keeps a spreadsheet of every contrast ratio we have ever argued about.

    3 posts

About

The studio behind the notes

One builds, one designs, both write. Three or four projects a year, and everything we learn on them ends up here.

One email, once a month

A short digest of what we published and what we got wrong. No tracking pixel, no drip sequence, one click to leave for good.

One email a month. Unsubscribe from any of them.