note

concept

Of Architecture and HTML

How HTML and CSS are spatial languages

Design-y desk. Photo by Mia Baker on Unsplash

Note: This thought is just a concept and thus not fleshed out much at all...

I have been playing around with this idea that HTML and CSS share a lot, or at least as much as coding can, with architectural design. Perhaps this is my architectural background talking. Perhaps others without this background conceive of their mental models differently. But, there's something about HTML, and how it pairs with CSS, that feels spatial in a way that languages like javascript or C# never could. HTML and CSS have a different sort of logic and require a different sort of mental tracking.

Any coding language - HTML, javascript, python, C#, etc - asks you to get to point B from point A. It's a game of arranging building blocks in such a way as to get what you want. That is all the same.

A language like javascript though, it asks you to solve a problem with pure logic. In some ways, you're writing an essay. You're holding onto an idea with language. You're using words to build it up gradually over time so that you can lead an audience to a conclusion. If you miss a piece or try to build the concept without supporting context, the idea might breakdown or it won't hit the same. It's not a perfect analogy of course but that's basically code.

I think the nuance is that, with HTML and CSS, instead of building an idea with words, you're building idea by arranging elements. It's all words on the screen, of course, but the mental model is entirely different. With javascript and C#, generally you just want elements available when you need them. How the text is arranged on a screen, while important to readability, do not necessarily matter to the language as long as they exist. If it exists, you can use it to build your idea, get you where you need to go. With HTML though, existing is not necessarily enough. Relationships matter. Composition matters.

If other languages are like writing an essay, then HTML and CSS are liking designing a space. HTML can be considered like the foundations and structure of a building. It doesn't necessarily define what the end result will look like; you can do a lot of different things within the same shell. However, it does constrict the possible solution space within. That's where CSS comes in. It works within the restrictions of the HTML structure, metaphorically acting as everything from the non-structural spatial makeup down to the hardware specs, to bring the space to life. They work in concert, like the various portions of an architectural design team, informing each other of what is possible and defining where iterative changes need to be made and relationships between elements changed.

I think this is why HTML and CSS always came naturally to me. I feel at home in the relationships and the manipulation of space whereas it took me a moment to re-orient myself within the mental models of javascript and C#. Both are logical but the types of logic are different.


Back to the garden