What It Takes To Design A Brutalist Website

While the definition has yet to be pinned down, a Brutalist website tends to have attributes that deviate from the prevailing design trends and habits of modern web design. Therefore it’s easier to focus on what it shouldn’t be.

1. Not Everything Has To Look Conventional

Making a website visually coarse and unconventional can be a freedom of expression. Like the architectural movement’s namesake, beauty can be found subjectively in its raw and ruthless logic. It carries a certain honesty over designing for the sake of beauty.

This could mean going abstract, incorporating clashing or vibrating colors, extreme typeface styles, awkward spacing and positioning, uncompromising and unwieldy imagery—anything that would feel out of place on a conventional website.

2. Not Everything Has To Be Readable

While obscuring text and hindering legibility would be considered poor UX under normal circumstances, the Brutalist position sees it as an opportunity for effects and layering to take precedence over readability; pushing the limits of what is legible.

Without worrying about what is and isn’t readable, this approach can produce unique aesthetics and user flows that would otherwise be unachievable with conventional practices. Typography can become an art form as appose to simply an object that communicates information. The user can be immersed in the deciphering process.

3. Not Everything Has To Be Intuitive

From a UX perspective, what we determine as intuitive is something that is immediately easy to understand or operate without explicit instruction. Normally, an intuitive UI will help the user execute the action or get the information they need much faster. Intuitiveness, however, is really derived from what users are used to; the hundreds of common patterns on the web that have been drilled into our subconscious on a daily basis.

What Brutalism allows is experimentation and exploration beyond the boundaries of preconceived intuitiveness. Unpredictability can provide an interesting or exciting experience in getting to the information, based on the learning curve required to do it.

4. Not Everything Has To Make Sense

The extent of creativity in abstract design is unmatched because it focuses on feelings instead of logic, and the reaction or emotion one may have prior to getting information. While there may have been intention from the artist, it’s generally left up to the viewer to interpret what it could mean and enjoy the process of it.

Brutalist sites are often in the realm of the abstract. They contain objects or words that are not relatable or discernible in any logical sense, but produce interesting one-off experiences. If it gets an emotional reaction such as humor or surprise, it’s probably worth it.

5. Not Everything Has To Align

Content is easier to interpret and has mathematical visual appeal when there is a system for alignment. It gives a sense of order to a composition and without it, a layout can quickly lose cohesion, consistency and organization. Most modern websites remain consistent with justification rules and use grid systems to help aid horizontal alignment.

Web Brutalism sees misalignment as an advantage—to make broad brush strokes and go with gut instinct on position and spacing. Objects can be optically positioned instead of being aided by grid and ruler. Layouts can feel hand-crafted instead of machine-made. It’s about misaligning objects on purpose without worrying about overlaps or awkward spaces. The content becomes engaging in the sense that it has abstract visual appeal.

6. Not Everything Has To Be Designed

Some Brutalist sites are devoid of any design—just raw HTML with little to no style. They simply leave the system colors, fonts, and dimensions to the defaults of the browser. When we see this format we tend to think that the site is broken and can’t find the CSS file, or that it was designed in 1991. Some sites even make the most minimal of adjustments in style, such as the background color.

Despite it being perhaps the least inspiring aspect of Web Brutalism, what’s interesting about this approach is its honesty—how it strips everything down to a raw format; to the bare-bones of hierarchy and content. You can often tell how semantically well-structured the HTML of a site is when you disable the CSS. It’s about as brutal and raw as you can get on the internet.