jcyamo.dev

The Disassembled Web · 001 · The Void

Part of The Disassembled Web

--------------------------------------------------------------------------------
V3SS3L · 001 · THE VOID
--------------------------------------------------------------------------------

PRINCIPLES OF THE VOID

  1. No file shall exist without purpose.
  2. No line of code shall exist without justification.
  3. No dependency shall be imported that could be written.
  4. No default shall be trusted that has not been examined.
  5. No abstraction shall be introduced before the pain is felt.

I made a directory today. I made a file. I wrote a reset that
touches five elements because those are the only five elements
I have.

This is less a project than a discipline. Each commit is a small
act of defiance against the assumption that more is better.

The void is not empty. It is potential, stripped of noise.

-- z3r0
--------------------------------------------------------------------------------

z3r0’s philosophy is our architectural spec. We aren’t building a product; we’re building a foundation. A single thought, a single file. This is where we make the philosophy tangible.

We need a structure to house our journey—not a complex monolith, but a simple directory. And we need our first piece of content: the zine you just read. For now, the content is the application. We’ll embed it directly. We’ll feel the limitations of that choice soon enough, and that feeling will become the fuel for our next improvement.

First, the directory. This is where all our zine series will live. We’re starting with The Vessel.

mkdir -p zines/V3SS3L

Now, the file. This isn’t just a document; it’s the first iteration of our reader. We’ll wrap z3r0’s raw text in <pre><code> tags to preserve its exact formatting—the 72-character lines, the monospaced grid, the hacker aesthetic. This is the silence he’s talking about: a document that arrives exactly as written, with zero transformation.

Create the file:

touch zines/V3SS3L/001.html

Open zines/V3SS3L/001.html and write the HTML by hand. No templates. No components. Just the raw metal.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>The Void Reader | V3SS3L 001</title>
	</head>
	<body>
		<main>
			<pre><code>
------------------------------------------------------------------------
V3SS3L · 001 · THE VOID
------------------------------------------------------------------------

PRINCIPLES OF THE VOID

  1. No file shall exist without purpose.
  2. No line of code shall exist without justification.
  3. No dependency shall be imported that could be written.
  4. No default shall be trusted that has not been examined.
  5. No abstraction shall be introduced before the pain is felt.

I made a directory today. I made a file. I wrote a reset that
touches five elements because those are the only five elements
I have.

This is less a project than a discipline. Each commit is a small
act of defiance against the assumption that more is better.

The void is not empty. It is potential, stripped of noise.

-- z3r0
------------------------------------------------------------------------
        </code></pre>
		</main>
	</body>
</html>

Open this file in your browser. It’s stark. It’s raw. It’s ugly by modern standards. It’s also lightning fast and completely under your control. There is no spinner. There is only the text. This is the baseline.

We are already breaking a rule of modern web development: we are embedding data directly in the document. The zine text is hard-coded into the HTML. This is intentional. We will feel the pain of this as we add a second zine, and that pain will be the signal to evolve.

$ git add zines/V3SS3L/001.html
$ git commit -m "Initialize project with the first zine entry embedded directly"

Silencing the Noise

The browser wants to help. It adds margins. It picks fonts. It applies default styles to every element. These defaults are designed for generic documents—not for us. If padding: 1rem is going to mean exactly one rem, we need to clear away the browser’s gifts first. Predictability is a feature.

We need a home for the tools that will style our application. Let’s create a dedicated directory for CSS assets.

mkdir -p assets/css

Now, write the reset. Open assets/css/reset.css. We are building a text-based zine reader. What elements are we actually using? <html>, <body>, <main>, <pre>, <code>. That’s it. No forms, no images, no videos. Our reset should reflect that reality. Every line of code must justify its existence. If it doesn’t solve a problem we currently have, it’s bloat.

/* 1. Predictable box model */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* 2. Remove default margin and padding from our core elements */
html,
body,
main,
pre,
code {
	margin: 0;
	padding: 0;
}

/* 3. Allow percentage-based heights */
html,
body {
	height: 100%;
}

/* 4. Typographic baseline for body */
body {
	line-height: 1.5;
}

Four rules. Rule 1 ensures our mental model of width and height matches the browser’s. Rule 2 silences the arbitrary spacing browsers add to our structural elements. Rule 3 is a utility for future layout. Rule 4 sets a readable, consistent line height. That’s the entire foundation.

Now we apply this to our zine. Open zines/V3SS3L/001.html and link to the stylesheet. The path from our zine file to our assets directory is ../../assets/css/reset.css.

Update the <head> section:

<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>The Void Reader | V3SS3L 001</title>
	<link rel="stylesheet" href="../../assets/css/reset.css" />
</head>

Reload the page. The default margin around the <body> is gone. The <pre> element is flush against the edges. The space between lines is now controlled solely by our line-height. The browser’s helpful noise has been silenced. We have predictability.

This is the void from which everything else will grow. A project directory, a single HTML file, and a surgical CSS reset. Nothing more.

$ git add assets/css/reset.css zines/V3SS3L/001.html
$ git commit -m "Establish assets directory and apply minimal, surgical CSS reset"
$ git tag -a v3ss3l-001 -m "V3SS3L 001: The Void — directory, HTML shell, surgical CSS reset"