← journal

The Web’s Grain


Gaston Bachelard: “We begin in admiration and end by organizing our disappointment.”

The first thing to notice about this page is that it is fluid—it adapts to the width of the viewport to fill it up.

The page’s fluidity leads to the second thing to notice: the page is vertical.

Elements get stacked like a layer cake by default, and it make sense—vertical stacks are much easier to adapt across all kinds of screen sizes, because you don’t have layout issues to manage with more or less space across. You simply keep the elements the full width.

Most of the solidified techniques about our practice come from the natural ways of the web that have been there since the start. The answer is right there in front of us, in the website itself, and each step we take away from its intentions makes our creations weaker.

call “bicycle bear websites.” Why? Because my response to both is the same.

“Listen bub,” I say, “it is very impressive that you can teach a bear to ride a bicycle, and it is fascinating and novel. But perhaps it’s cruel? Because that’s not what bears are supposed to do. And look, pal, that bear will never actually be good at riding a bicycle.”

Back to the zen koan—if we see the mountains as mountains and rivers as rivers, these are the sites that try to be different, yet end up swimming up stream and climbing uphill.

every material has a grain, including the web.

We use flat colors and simple gradients, because they’re lightweight, easy to draw with CSS

Sites have large horizontal stripes of content, because of the vertical bias

We use text as interface, because the nuanced but significant differences in technology’s abstractions are difficult to communicate visually.

Ambient, atmospheric, blurred, or tinted photographs become background images, because we can’t quite be sure how it will be cropped across different viewports.

And big type is overlaid on top of these images because every client simultaneously wants big images and big type.

We use photography with props, because software is abstract and hard to embody, so we show it on a device in a related context to have it seem like the product that it is.

What would happen if we stopped treating the web like a blank canvas to paint on, and instead like a material to build with?

It is control versus discovery, uniformity versus multiplicity.

Edgelessness is in the web’s structure: it’s comprised of individual pages linked together, so its structure can branch out forever.

Edgelessness applies to the screens that show the web, because they offer an infinite canvas that can scroll in any direction for however long.

Edgelessness speaks to the diffusion of device and viewport sizes.

the edgelessness of the web tears down the constructed edges in the company. Everything is so interconnected that nobody has a clear domain of work any longer—the walls are gone, so we’re left to learn how to collaborate in the spaces where things connect.

Our words make it seem that we’re designing how elements break down, but really, we should be focusing on how they build up

Technology only adds more—it is never this or that; it is always this and that.

More technology only amplifies the problems created by an abundance of it.

In pursuit of convenience, we have opened the door to unscrupulous influence.

My wish is simple: I desire a technology of grace, one that lives well within its role.