The Potter's First Centering: On the Unseen Effort of a Stable Viewport
Before a potter can raise a single wall of clay, they must first perform the most fundamental, and most difficult, task of their craft: centering. A lump of wet, cold, seemingly inert clay is thrown onto the wheel head. The wheel spins, a chaotic blur. The potter’s hands, wet and steady, apply pressure. It is a battle of opposing forces—the centrifugal energy trying to throw the mass outward, and the potter’s focused will, trying to pull it into a perfect, still column at the heart of the maelstrom. From this struggle emerges a quiet, humming stability. Only then can the real work begin.
This act of centering is the uncelebrated, often invisible foundation for everything that follows. And so it is with the viewport on a web page. We speak of layout shifts and jank, of elements that dance and jump as they load. We treat this instability as a problem to be solved with technical fixes—adding `width` and `height` attributes, reserving space, using `content-visibility`. These are our tools, our wet hands on the spinning wheel. But we rarely stop to appreciate the profound importance of the initial, foundational stability they are meant to achieve: a centered viewport.
A viewport that is stable from the moment it paints is a promise kept to the visitor. It says: what you see now is what you will get. The text will not suddenly leap away from your cursor as an image barges in from the network. The ‘Add to Cart’ button will not become a moving target under your thumb. This stability is not merely a metric to be gamified for a lighthouse score; it is the digital equivalent of a potter’s centered clay. It is the necessary precondition for trust, for focus, for the user to engage with the content we are trying to raise from the raw material of code.
The effort required to achieve this is immense and largely unseen. It happens in the choices we make long before a browser ever renders a pixel. It is the careful choreography of our CSS, the strategic prioritization of our assets, the discipline of our developers to not let an un-sized image or a late-loading font disrupt the delicate balance. Like the potter’s aching shoulders after a day of centering heavy clay, this work leaves no visible mark on the final product. The user only experiences the absence of frustration, the presence of calm.
We pour immense creative energy into what happens within the viewport—the animations, the typography, the imagery. But without that initial, hard-won centering, it is all just chaotic motion. The most beautiful vase, thrown on an uncentered lump of clay, will be fatally flawed, wobbling uncontrollably the moment it is set down. A page that loads quickly but unstably is the same. True craftsmanship, on the wheel or in the editor, begins not with the flourish, but with the foundation. It begins by making the chaos still.
Notes & further reading
A few pages I came back to while writing this: