Skip to content

Commit

Permalink
Refine colophon content and streamline explanation of site architecture
Browse files Browse the repository at this point in the history
  • Loading branch information
matttrent committed Nov 16, 2024
1 parent 547d6d8 commit 3df9765
Showing 1 changed file with 7 additions and 9 deletions.
16 changes: 7 additions & 9 deletions src/content/notes/colophon.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -7,20 +7,18 @@ modifiedAt: 2024-11-10
---
import Sidenote from "@components/Sidenote.astro";

The publishing term *colophon* is a statement in a containing information about the publication of the book. In the early days of personal webpages, most sites were custom built or assembled from the parts bin, the term was adopted for the "how I made this" section of someone's site. And so that tradition continues here.

I've always built my own website. Partly because I want control over how the things I create are both presented and distributed. And partly because it's a good motivator to learn things I wouldn't encounter in my normal line of work, such as the Javascript ecosystem. Here's what I've done for this iteration.
The publishing term *colophon* is a statement in book a containing information about the publication of the book. In the early days of personal webpages, most sites were custom built or assembled from the parts bin, the term was adopted for the "how I made this" section of someone's site. And so that tradition continues here.

### Build

The site is built using the [Astro](https://astro.build/) framework. I'm not really qualified to weight its pros and cons. My go-to guy for everything frontend, [Sam Breed](https://sambreed.dev/), uses it for his site and that's good enough reason for me. While I'm not versed in frontend frameworks, it does seem sensibly put together and connects a number of ideas I'm vaguely aware of being good things into a single package.
The site is built using the [Astro](https://astro.build/) framework. I'm not really qualified to weight its pros and cons. My go-to guy for everything frontend, [Sam Breed](https://sambreed.dev/), uses it for his site and that's good enough reason for me. While I'm not versed in frontend frameworks, it does seem sensibly put together and packages a number of ideas I'm vaguely aware of being good things.

Astro [components](https://docs.astro.build/en/basics/astro-components/) have allowed be to build the site out of self-contained chunks that serve one purpose, and reuse them across both the HTML and Markdown portions of the site. And Astro's separation of framework and content is another huge selling point. The majority of the site content is Markdown files, which frees me from having to create them in my coding editor. I'm actually typing this in [Obsidian](https://obsidian.md/), which is much more amenable to writing than VS Code.
Astro [components](https://docs.astro.build/en/basics/astro-components/) have allowed be to build the site out of self-contained chunks that serve one purpose, and reuse them across both the HTML and Markdown portions of the site. And Astro's separation of site content from the framework is another huge selling point. The majority of the site content is Markdown files, which frees me from having to create them in my coding editor.

### Styling
The end result is I'm able to write page this in [Obsidian](https://obsidian.md/), which is much more amenable to writing prose than VS Code, while at the same time being able to easily introduce fairly complex modifications to the layout/style when I want to.

The site style is borrowed from [tufte-css](https://edwardtufte.github.io/tufte-css/), which I carried over from the previous iteration of this website. I've been a fan of his books and their layout and typography since I first encountered them. The aesthetic feels like modernization of that of the classic academic texts like *Principia Mathematica* and *On the Origin of Species*, and having a style that more closely resembles a printed page than a chromed website appeals to me.
### Styling

I'm a huge proponent of Tufte's [sidenotes](https://edwardtufte.github.io/tufte-css/#sidenotes) in particular. I think parenthetically and often want to say something about<Sidenote>Wooooo sidenotes</Sidenote> or related to the thing I'm actually saying. Sidenotes accomplish this in a way much more elegant than footnotes, which hardly work on printed pages and not at all on lengthy webpages.
The site style is borrowed from [tufte-css](https://edwardtufte.github.io/tufte-css/). I've been a fan of the layout and typography of his books since I first encountered them. The aesthetic feels like modernization of classic academic texts like *Principia Mathematica* and *On the Origin of Species*, and having a style that more closely resembles a printed page than a chromed website appeals to me.

While the site retains the appearance of the original stylesheet, it's been disassembled and reassembled under the hood. While building the site components, I pulled the CSS apart and distributed the pieces. In the process I based the overall layout on a CSS grid, which gives me much more latitude to create interesting layouts for photo-heavy pages.
I'm a huge proponent of Tufte's [sidenotes](https://edwardtufte.github.io/tufte-css/#sidenotes) in particular. I think parenthetically and often want to say something about<Sidenote>Wooooo sidenotes</Sidenote> or related to the thing I'm actually saying. Sidenotes accomplish this in a way much more elegant than footnotes, which hardly work on printed pages and not at all on lengthy webpages.

0 comments on commit 3df9765

Please sign in to comment.