from Hacker News

Guidelines for Brutalist Web Design (2018)

by CaesarA on 5/2/23, 3:54 AM with 116 comments

  • by baumgarn on 5/2/23, 9:34 AM

    This is not really what brutalism is about. Brutalism in architecture is often very playful and indeed more like a poetry and celebration of the raw materials and structure, not at all about the pure functionality absence of any aesthetic as formulated in that text. Brutalist buildings often neglect functionality in favour of architectural idiosyncracies. Like for example Trellick Tower: the elevators are in a separate tower outside the building and only serve every third floor. Brutalism celebrates raw form over function, and mostly people really don't enjoy living in these buildings.

  • by gidorah on 5/2/23, 7:55 AM

    For a bit of a laugh, I wrote a Brualist ecommerce platform called Bruce https://bruce.huginn.uk/

    I worked for an ecom company (in finance) and we were looking at replatforming. I wondered two things: how hard is it to write an ecom store, and could it be much more performant.

    I suppose main problem with going too brutal would be that many people would find it hard to trust.

  • by rbanffy on 5/2/23, 6:56 AM

    The British government has issued a visual design system for their government websites that embraces this philosophy (in their case, for accessibility and speed more than aesthetics).

    https://design-system.service.gov.uk/

  • by atoav on 5/2/23, 6:43 AM

    As a webdesigner this is something I subscribe to, with one exception: websites where falling out of the norm in a certain way is part of the point that needs to be communicated (e.g. an artist portfolio).

    The ML in HTML stands for "markup language". Too many frameworks produce garbage markup, which is why for typical CMS systems I write my own themes that use HTML as it was intended to be used.

    One of my favourite German hacker/nerd blogs uses more or less the browsers defaults for ages now and it is so blazingly fast that it is my regular "does the internet work"-website: https://blog.fefe.de/

  • by Poppys on 5/2/23, 8:42 AM

    | "Only the act of design can make the content less readable"

    I disagree with this, HTML in it's raw rendered state is not pleasant to read. You have to apply some rules (or specify the rules in your browser) to get the text to a state where it is pleasant to read.

  • by Semaphor on 5/2/23, 6:37 AM

    The only successful submission of this was in 2018 with 312 comments: https://news.ycombinator.com/item?id=17478133

  • by bediger4000 on 5/2/23, 4:26 AM

    Only links and buttons respond to clicks, and buttons look like buttons - finally! Flat design is moronic, and this smartphone thing of magic zones to stroke is awful.

  • by jevgeni on 5/2/23, 7:47 AM

    Shameless plug, but I've designed my own website as a love-letter to the honest, content-first design of very early 90s: https://jevgeni.tarassov.ch/

  • by hjkl0 on 5/2/23, 2:36 PM

    Someone else already commented about how this has nothing to do with brutalist architecture.

    But it also has nothing to do with brutalist websites.

    There’s really no relation between this list of guidelines for brutalism and between sites that actual people would describe as brutalist.

    That term has been kicking around for a few years now. Personally, I always felt it a very evocative definition for these kinds of sites:

    https://brutalistwebsites.com/

    A few other key words that come to mind are “artsy”, “experimental”, perhaps “post-modern”. And also “barren”, “self-important”, “hostile”.

    What the guidelines in this article have in common is not that they lead to brutalist websites, it’s that the lead to good websites.

    So why hijack a confusing term?

  • by drooopy on 5/2/23, 8:46 AM

    I miss the times when this was considered the standard for web design.

  • by self_awareness on 5/2/23, 8:46 AM

    I find brutalist architecture, designs and aesthetics as a regression in design. I really hope this trend will end someday.

  • by mock-possum on 5/2/23, 5:55 PM

    It's a fun exercise, from my (hazy) memories of college lectures, Brutalism is roughly:

    - structural elements aren't obscured by decoration - infrastructure (cabling, conduits, piping, ductwork, etc) is likewise 'left exposed' - building materials also left unadorned - physical shapes are building-blocky, not 'finished' - visual design elements are strictly utilitarian, or incidental to materials

    I've gotta say while I mostly agree with the author, this article's "A website's materials aren't HTML tags, CSS, or JavaScript code" claim really rubs me the wrong way right off the bat - the structural elements are absolutely HTML and CSS and JS. HTML is the physical architectural structure, CSS is the visual treatment, and JS is the infrastructure that allows interactivity.

    If anything, default browser styles would seem to be the nearest we've got to "HTML (structural elements) aren't obscured by decoration (CSS)." No rounded corners, no drop shadows, no parallax. Which makes "The default visual appearance of a button is often unpleasant or clashes with the visual language of the site" - I think under Brutalism, the clash would essentially be accepted as a hazard of "building materials left unadorned." Maybe you could sneak it in under "visual design elements are strictly utilitarian," as visual design is an incredible tool for usability

    Leaving the infrastructure (JS) out in the open is a little trickier, though I guess you could point to open sourcing your codebase and not obfuscating your production code so it's easily reviewable in the Dev Tools as a way to satisfy that ideal. Static HTML sites also seem like they'd be a little more in line with Brutalism than SPAs I suppose.

  • by gambiting on 5/2/23, 9:34 AM

    Honestly, without irony - this is peak web design for me.

  • by every on 5/2/23, 3:02 PM

    Works nicely on lynx[1] and does exactly what it says on the tin[2]...

    [1] https://en.wikipedia.org/wiki/Lynx_(web_browser)

    [2] https://en.wikipedia.org/wiki/Does_exactly_what_it_says_on_t...

  • by agys on 5/2/23, 9:16 AM

    While I agree with the sentiment (and motivation) the layout (and hence the readability) suffers: the hierarchies are off (for example the gigantic "Colophon" at the end), section titles too big and there is visual noise due to "permalink" scattered around, etc. All this could still be fixed without adding elements or styles but just by choosing the correct weights and slightly better rules.

  • by sputter_token on 5/2/23, 5:25 PM

    Does anyone have any examples of baroque web design?

  • by SPBS on 5/2/23, 1:52 PM

    Don't agree that links should be underlined. When there are a lot of links, underlining them makes the paragraph look very messy and hard to read [1]. Wikipedia for example does not underline its links. Just keep them blue.

    [1] https://ux.stackexchange.com/a/7068

  • by johnchristopher on 5/2/23, 1:26 PM

    I am all for the design proposals here and I wish the web looked more like that.

    But:

    > A website is neither an application nor a video game. It is for content, and so its design must serve that purpose.

    No, a website is for selling something, anything, to someone, anyone. So on most sites it follows that design is built/tortured to achieve this goal.

  • by everybodyknows on 5/2/23, 4:40 PM

    At least on my iPad's Safari, the below is presented in blue on a black background, barely readable due to long-understood asymmetries in the human retina's response to color:

    > Content is readable on all reasonable screens and devices.

    The site fails to meet its own stated design criteria.

  • by JohnFen on 5/2/23, 5:36 PM

    Brutalist web design is, I think, the best web design. Or at least, it's the sort that I find works the best for me. One of my problems with most modern web design is that it's so full of unnecessary visual fluff and frippery.

  • by crooked-v on 5/2/23, 7:36 AM

    Is it really brutalist if nothing is visibly and unappealingly weather-stained?

  • by andrewstuart on 5/2/23, 6:46 AM

    I thought brutalist went design was about a visual aesthetic.

  • by ajcp on 5/2/23, 3:24 PM

    | "A website is not a magazine, though it might have magazine-like articles. A website is not an application, although you might use it to purchase products or interact with other people. A website is not a database, although it might be driven by one."

    This feels overwrought. A website is a collection of documents (webpages). That's it. A document is just a vehicle to store and/or transmit information. They can be made to be pretty and engaging to make that information easier to consume.

  • by alfor on 5/2/23, 9:30 AM

    In the same way as this was a mistakes for building (beauty matter) it is too for website. We human respond to more than the "content" or raw function of things. We have an emotional connection with everything. The visual cues, the color, the composition all affect how you are perceive and use a product or house. The brutalist look shout to other this place is about business/information, I despise beauty and think it’s a waste of time.

  • by tough on 5/2/23, 5:14 PM

    Currently, "basement" exemplifies the pinnacle of brutalist website design.

  • by onewheeltom on 5/2/23, 4:16 PM

    Whatever it is called, I like it. I would love to stop seeing “click here” hyperlinks

  • by rodolphoarruda on 5/2/23, 4:51 PM

    Is there a similar approach to this for web applications UI/UX?

  • by anthk on 5/2/23, 3:53 PM

    If your web doesn't work under Dillo, it's not brutalist.

  • by sebastianconcpt on 5/2/23, 2:47 PM

    Brutal honesty here: My eyes! Waiting for this trend to go extinct.

    That guide and website is the least worst I've see in this style, but the general brutalist web-design makes me want to turn off the computer.

  • by arpa on 5/2/23, 6:57 AM

    Yes, please.

  • by cultureswitch on 5/3/23, 10:38 AM