In Ibaraki, on a hillside overlooking Osaka Bay, there is a concrete box. It has no ornament. No stained glass. No bell tower. The walls are bare cast concrete, poured in a single operation so the grain of the wooden formwork remains pressed into the surface like a fossil. The space is severe, deliberately so, and for most of the day it sits in near-darkness.
Then the sun moves. Light enters through a cruciform slit cut into the wall behind the altar, and a cross appears. Not mounted, not gilded, not carved. The cross is made of absence. A gap in concrete, filled with sky. The most powerful element in Tadao Ando’s Church of Light is the thing that is not there.
Ando did not add a symbol. He removed material until the symbol revealed itself. The cross exists because of what surrounds it: the weight and density of the concrete, the deliberate darkness of the interior, the precise angle of light at specific hours. Without the mass, the void has no meaning. Without the void, the mass is just a wall.
This is not minimalism. Minimalism is the reduction of elements. What Ando practiced is something older and more specific. In Japanese, there is a word for it.
The space that is not empty
Mais usually translated as “negative space” or “gap,” but neither translation captures what the word actually means. Ma is the interval between things that gives the things their meaning. The silence between notes that makes music distinguishable from noise. The pause in a conversation that tells you something important is about to be said. The empty alcove in a Japanese room, the tokonoma, whose only function is to hold emptiness.
The tokonoma is instructive. In a traditional Japanese room, one alcove is kept empty or nearly so. A single scroll, a single flower arrangement, a single object. The rest of the alcove is space. Not wasted space. Not space waiting to be filled. Space that is performing a function: directing your attention to the one thing present, and giving that thing room to be experienced rather than merely seen.
Remove the emptiness and the object becomes clutter. Place six objects in the alcove and each one diminishes the others. The emptiness is not the background. It is the active ingredient.
Ma appears across Japanese art, architecture, music, and social ritual because it reflects a particular understanding of how perception works. Attention is not a spotlight. It is a wave. It needs rhythm, alternation between presence and absence, fullness and void. A garden of only rocks is a quarry. A garden of only raked sand is a beach. The interplay between form and emptiness is where meaning lives.
Pine trees in fog
In 1595, Hasegawa Tohaku painted a six-panel folding screen called Shōrin-zu byōbu, Pine Trees. It is now a Japanese National Treasure, housed at the Tokyo National Museum. The painting consists of pine trees rendered in ink wash. Some are dark and close. Others are pale, barely distinguishable from the silk ground. Most of the six panels are empty.
Empty is the wrong word. The panels are filled with fog. The fog is not painted. The fog is the silk itself, untouched, but made atmospheric by the trees that emerge from it and dissolve back into it. The trees need the fog. Without it they are botanical illustrations, precise and lifeless. With the fog they become something you can feel: the cold dampness of a mountain morning, the way objects appear and disappear as you walk through mist, the uncertainty of a world that refuses to fully reveal itself.
Tohaku understood that the emptiness was not a background for the trees. The emptiness was the painting. The trees were accents, the minimal gesture required to activate the void. Without them the silk is blank. With them the silk becomes weather, distance, mood. The relationship between form and emptiness is the entire work.
Four centuries later, this principle has not changed. Only the medium has.
What 40 pixels communicates
Open two browser tabs. In the first, any corporate WordPress site built from a theme. In the second, apple.com. Look at the space between sections.
The WordPress site has 40 to 60 pixels of padding between its content blocks. The heading crowds the paragraph above it. The image pushes against the text beside it. Everything is close, tight, compressed. Not because the designer chose compression, but because no one chose anything. The default was accepted. Space costs money (the page gets longer, the fold moves up), and the instinct was to conserve it.
Apple uses 120 to 200 pixels between sections. Sometimes more. A single product photograph occupies the full viewport with nothing around it. A headline sits in what feels like a field of open air. The scroll distance between elements is significant, deliberate, almost extravagant.
This is not waste. It is communication.
The 40-pixel site communicates scarcity. We have limited attention, limited patience, limited space, so we must cram. Every pixel must justify itself. The result reads like a crowded market stall: everything visible, nothing distinguished, the eye unable to rest on any single element because the next one is already pressing in.
The 200-pixel site communicates abundance. We have space. We have confidence. We believe this one thing we are showing you right now is worth your sustained attention, and we will not interrupt it with the next thing until you are ready. The result reads like a gallery: each piece given its own wall, the viewer invited to dwell rather than scan.
The difference is not aesthetic preference. It is a signal of quality that visitors process below the threshold of conscious analysis. Semir Zeki’s neuroaesthetics research has demonstrated that visual harmony activates the medial orbitofrontal cortex, the brain’s reward circuit, before the viewer can articulate why something feels right. Processing fluency research by Rolf Reber shows that information presented in spacious, high-contrast layouts is judged as more truthful than the same information compressed. The space is not decoration. It changes how the content is received.
The tension of restraint
There is a distinction that matters here, one that separates ma from simple emptiness. Ma is not blank. It is charged. It has tension. The silence between a question and its answer is not the same as the silence in an empty room. The first is full of anticipation. The second is just quiet.
On a screen, this translates to the difference between “minimal” and “sparse.” A minimal site can feel expensive, curated, intentional. A sparse site feels unfinished, like someone ran out of content. Both have the same amount of whitespace. The difference is tension.
Tension comes from relationship. A heading that sits 128 pixels below the previous section creates tension because the eye has traveled through empty space and arrived at something. The journey matters. It creates a micro-rhythm of anticipation and arrival that makes the heading feel more significant than it would if it were 40 pixels below, stepping on the heels of the content above.
Bottega Veneta’s website does this with a precision that borders on silence. Product images float in fields of cream. Text is set small, almost reluctant to speak. The scroll between sections is long enough that you forget you are scrolling and begin to feel like you are moving through a physical space. This is ma applied to commerce. The emptiness is not the absence of content. It is the presence of intention.
Aesop does the same. Sparse product pages, generous negative space, typography that does not compete with the images. The effect is not that there is little to see. The effect is that everything you do see has been selected with absolute deliberation. The space around each element is a frame that says: this matters. Look at this.
The ratio that separates cheap from premium
There is a specific, measurable quality that distinguishes professional web design from template-driven work. It is the ratio between intra-group and inter-group spacing.
Intra-group spacing is the distance between elements that belong together: a heading and its body text, an image and its caption, a form label and its input. These should be close. Proximity signals belonging.
Inter-group spacing is the distance between groups of elements: one section and the next, one content block and another. These should be far apart. Distance signals separation, a new thought, a pause.
In a template site, this ratio is typically 1:1.5 or 1:2. A heading is 16 pixels from its paragraph, and the next section starts 32 pixels below. The eye cannot distinguish between “these elements belong together” and “a new section has begun.” Everything runs together into a continuous flow of undifferentiated content.
In premium work, the ratio is 1:4 or higher. A heading is 16 pixels from its paragraph, and the next section starts 128 pixels below. The difference is unmistakable. Groups are distinct. Sections breathe. The page has structure that the eye can parse without reading a word. You know where one thought ends and another begins because the space tells you.
This is Tohaku’s fog in a stylesheet. The content is the pine trees. The spacing is the silk ground that gives them shape, context, presence. Compress the fog and the trees lose their mystery. Expand it and they emerge with weight.
Why the instinct is always to fill
Every designer and every client has felt the pull. The section looks empty. The page is too long. There is a gap that could hold a testimonial, a feature list, a secondary call to action. The impulse is to fill it. Every pixel of screen was paid for. Leaving it empty feels like leaving money on the table.
This instinct is natural and almost always wrong.
A page crammed with content communicates anxiety. It says: we are afraid you will leave, so we are going to show you everything at once. The visitor reads this, not consciously but viscerally, and it erodes trust. Anxiety is contagious. If the company seems anxious, perhaps there is reason to be.
Generous whitespace communicates the opposite. It says: we are confident that what we have placed here is worth your attention. We do not need to overwhelm you. We can afford to let you look. The visitor registers this as authority. This company knows what it is doing. This company has enough to say that it can choose what not to say.
The irony is that the empty page often converts better than the full one. Not because emptiness sells, but because attention is finite and focus is a gift. A page with one clear message and room to absorb it outperforms a page with five messages competing for the same cognitive real estate. This is not theory. It is what A/B tests consistently show, and it is what mahas articulated for centuries.
Typography needs air
The principle operates at every scale. Not just section spacing but line height, letter spacing, paragraph breaks. Type is an arrangement of marks and the spaces between them, and the spaces are doing as much work as the marks.
Set body text at 1.4 line height and it reads as dense, corporate, slightly oppressive. Set it at 1.7 and it breathes. The same words feel calmer, more considered, easier to absorb. The content has not changed. The air around it has, and that changes everything about how the content is received.
The same applies to content width. Text set at 80 characters per line demands less eye movement than text at 120 characters. The narrower column creates margins, and those margins are not wasted space. They are a frame. They contain the reading experience and prevent the eye from wandering. A book does not use the full width of the page because the page is not the unit of communication. The paragraph is. And paragraphs need boundaries to feel like paragraphs rather than blocks of undifferentiated text.
The distance between the last line of body text and the next section heading is one of the most powerful typographic tools available, and it is the one most often ignored. A template gives this 24 or 32 pixels. Premium work gives it 96 to 128. The larger gap creates a beat, a pause, a moment where the eye rests and the mind processes what it just read before turning to what comes next. It is the literary equivalent of a paragraph break, except the paragraph break is measured in pixels and the reader feels it without seeing it.
What emptiness communicates
The tokonomaalcove is empty so that one object can mean something. Tohaku’s silk is bare so that the pine trees can breathe. Ando’s concrete is solid so that the cross can appear. In each case, the emptiness is not an absence of intent. It is the most intentional part of the composition.
This is what ma teaches, and it has been teaching it for a very long time: the space around a thing is part of the thing. Not background. Not margin. Not padding. Part of its meaning, its presence, its ability to be experienced rather than merely registered.
A website is not a container of content. It is a composition of elements and the intervals between them. The elements get all the attention: the hero image, the headline, the call to action, the product grid. But the intervals are what determine whether the composition feels considered or careless, premium or cheap, confident or anxious.
If an element does not feel like it has too much space around it, it does not have enough. This is not an aesthetic preference. It is how perception works. The eye needs rest to register impact. The mind needs pause to process meaning. Without space there is no rhythm, and without rhythm there is no emphasis, and without emphasis everything blurs into a single undifferentiated surface that the visitor scrolls through without stopping.
The fog is the painting. The silence is the music. The void is the cross.
Give your work room to be seen.