Brutalist web design


The major guidelines of the Brutalist web design 1 are:

Content is readable on all reasonable screens and devices

πŸ‘ This guideline is followed by this site. The vast majority of the pages work with all major browsers, implement a responsive design. They also work with Javascript disabled as described in site details. It even works with unreasonable browsers, screens and devices, such as Internet Explorer 6 (2001) and NCA Mosaic 2 (1993).


It also works with the Kristall2 lightweight browser, a browser for HTTP(S)/Gemini/Gopher without JS/CSS/WASM support.


This is achieved, generally, by using the following:

  • Use of headings and subheadings to help break up content and make it easier to scan and read.
  • Lists to organize information
  • Examples and illustrations to helpt clarify complex concepts.
  • Consistent formatting. This directly related to other points, sucn as uttons, yperlinks, ecorations, etc.

πŸ‘ This guideline is followed by this site. Buttons and hyperlinks (textual and TOC links) are the only way to navigate content (except for standard browser navigation, i.e. back button)

😬 Not really followed. Hyperlinks are highlighted, rather than underlined.

πŸ‘ This guideline is now mostly followed by this site. Hyperlinks look like hyperlink and buttons look like buttons, though.

The back button works as expected

πŸ‘ This guideline is followed by this site. This site does not implement routers, history hijacking, etc. Hyperlinks and browser navigation are the only way to get around.

View content by scrolling

πŸ‘ Vertical scrolling, specifically.

Decoration when needed and no unrelated content

πŸ‘ This guideline is followed by this site. Decoration is judicious and mostly through colour. No splash images too.

Performance is a feature

πŸ‘ Performance is an important concern.

  • An area of work is image optimisation, since this the heaviest part of the site
  • Javascript is minimal and the goal is to decrease dependence on it, not increase.