website redesign 2024Q4

I had already started to redesign this site, and wanted a brutally simple and honest site. No javascript gimmicks. Use pure CSS3 for styling. KISS.

It looked fine, and I was ditherintg between setting the copy in courier or computer modern. And even going so far as to have an amber on not quite black color scheme to mimic monochrome displays of yore.

Last month I went to an art exhibition ¹ where one of the exhibits caught my attention for two reasons. Firstly, I could hear it. Somewhere there was the unmistakable sound of a dot matrix printer. Secondly, when I found it², I discovered that the curator had sourced green ruled (“zebra”) continuous feed paper to be used with it. Seeing that dot matrix printer printing on zebra paper, inspiration! I would make my website look like it had been emitted by a dot matix printer on zebra paper.

So, here we are. Q4. And a fresh start for my website.

If you don’t like how it looks, don’t worry. It renders beautifully in your browser’s “Reader Mode” (which is one of the big advantages of KISS).

How

For the designers, and curious, out there:

• The design is implemented in one boring, written-by-hand CSS file. It was passed through css-lint to catch any obvious bloopers.

• The printer font is a locally hosted copy of DepartureMono, which describes itself as “A monospaced pixel font with a lo-fi, techy vibe” which is exactly the vibe I was going for.

• The sprockets at the side of the page is a piece of art that I generated³

• The zebra rules are a graphic that too was generated³ by myself.

• The color scheme is reminiscent of somewhat aged printouts from the mid-1990s. Some artistic licence has been applied because printers at the time only produced black text, or for special purposes, black and red. Three colors are used:

  • black for text
  • red for footnote references and numbering
  • some weird blue/purple color for hypertext links, because blue ink in receipt printers at that time always claimed to print in blue but the result was always this weird result