Brutalisme op het web: proud 2B fout

Net als in kunst en architectuur zijn er in webdesign bepaalde stromingen die komen en gaan. De afgelopen twee jaar heeft brutalisme aan populariteit gewonnen. Een ruige stijl die veel mensen als verrassend of zelfs als lelijk en ongebruiksvriendelijk bestempelen. Wat is het, waar komt het vandaan en zijn deze aantijgingen waar?

Back to basics

Brutalisme heeft zijn intrede gedaan in de architectuur ver voordat er überhaupt websites bestonden. In de jaren 50 was er behoefte aan een bouwstijl die snel woningen opleverde en daarnaast efficiënt en goedkoop was, zonder te veel poespas. Voornamelijk te verklaren aan het grote woninggebrek na de oorlog. Het antwoord lag in beton of ‘béton brut’, het Franse woord waaraan de stijl zijn naam te danken heeft.

Tussen de jaren 50 en 70 rezen grote betonnen blokken uit de grond, die te herkennen zijn aan de focus op functie en de drang naar simpliciteit. Door terug te gaan naar deze basis werd er afstand gedaan van de meer decoratieve stijlen van voor die tijd. Dit betekent overigens niet dat het een eentonige stijl was; beton was perfect geschikt om de meest grote en bijzondere vormen mogelijk te maken.

Foto door Pierre Châtel-Innocenti op Unsplash

Brutalisme in webdesign verzet zich hiertegen en neemt afstand van de best practices en vaste patronen. Er wordt ook wel gezegd dat het teruggrijpt naar de basis van websites zoals in de jaren 90; websites met meer vrijheid, onafhankelijk van third party resources en die enkel doen waarvoor ze gemaakt zijn. Vergelijk het met minimalisme, maar dan met een brutaal randje.

“Brutalism Isn't the Absence of Modernity. It is the absence of a modern aesthetic. It merely shows what is normally hidden beneath the gleaming facade.” Brian Haferkamp

Kenmerken van brutalisme in webdesign 

De focus op functie en de drang naar verandering brengt enkele eigenschappen met zich mee waaraan een brutalistische website makkelijk is te herkennen.

Gewaagde kleurenschema’s, afbeeldingen en lettertypen

De donkere tonen van beton zijn terug te vinden in veel brutalistische websites. Kijk bijvoorbeeld naar de bovenstaande website van Payinterns.nyc, die erg trouw blijft aan het grauwe karakter van brutalisme. Maar dit betekent niet dat brutalisme in webdesign kleurloos is. Er wordt juist geëxperimenteerd met allerlei kleuren waarvan je zou denken dat je die nooit samen op dezelfde website tegenkomt. Het redesign van Dropbox en de one-pagers van Anton Reponnen zijn mooie voorbeelden. Opvallend is vooral het gemis aan gradients en gebruik van effen kleuren, bij voorkeur web safe colors.

Hetzelfde geldt overigens voor lettertypen. In brutalisme wordt het gebruik van systeemfonts aangemoedigd. Niet alleen omdat het een extra HTTP-request bespaart tegenover online lettertypes, maar ook omdat deze fonts door hun degelijkheid niet voor niets zijn uitgekozen als systeemfont. Zie bijvoorbeeld Hacker News en Onym.co.

Tot slot mogen afbeeldingen niet achterblijven in de focus op functie. In plaats van aan de slag te gaan met filters en andere bewerkingen, worden afbeeldingen ruw gebracht zonder te lang stil te staan bij de onderliggende connecties tussen andere afbeeldingen of de website in zijn geheel. Dit is goed te zien op de websites van Derek Man Lui en Chrissie Abbot.

Minimalistisch en geen mooimakerij

Dat alles recht voor z’n raap is, komt niet alleen terug in de kleuren, lettertypen of afbeeldingen van een website. Ook de code is tot op het bot minimaal. Ingevoegde CSS-stijlen, code die niet inspringt, standaardmark-up, simpele tekstmenu’s en HTML-tabellen zijn geen bijzonderheden. Dé verzamelaar op het gebied van brutalisme, Brutalist Websites, geeft het goede voorbeeld.

Dit minimalisme heeft tot gevolg dat brutalistische websites er op het eerste gezicht niet altijd even mooi uitzien, maar stiekem eigenlijk best wel functioneel blijken. Ze zijn makkelijk te navigeren, vaak van nature responsive, laden lekker snel en je aandacht wordt niet weggenomen van wat belangrijk is. Misschien werken brutalistische websites zelfs wel conversieverhogend? Grote namen als Yeezy Supply en Balenciaga durven de gok in ieder geval te wagen.

Brutaal randje

Een minimalistische broncode betekent niet altijd een minimalistische website. Door de drang naar heterogeniteit zijn brutalisten niet bang om te experimenteren en de websitegebruiker te verrassen. Tekst die (deels) wordt overlapt door grote afbeeldingen zie je bijvoorbeeld regelmatig terug. En net als in de architectuur wordt er gespeeld met grootse vormen, perspectief en grappige hover-effecten.

Soms gaat het een stap verder en komt in de tekst de grote mond tevoorschijn. Of er worden uitzonderlijke stappen gevraagd van de websitebezoeker. Zo is het verplicht om eerst je internetconnectie te sluiten om een webpagina van Chris Bolin te zien en moet je op de website van Tristan Chambers wel heel erg je best doen om te navigeren.

Chris Bolin & Tristan Chambers

Semi-brutalisme

De combinatie van de bovenstaande kenmerken kan (opzettelijk of niet) leiden tot ‘bijzondere creaties’ waarbij de gebruiksvriendelijkheid in het geding komt en de functie ver te zoeken is. Het is dan ook niet gek dat brutalistische websites vaak slachtoffer zijn van satire en grote afgunst. Er zijn zelfs websites opgericht die de stijl belachelijk maken.

Of je het een vrijbrief vindt voor slecht design of juist helemaal fantastisch, brutalisme heeft in ieder geval het homogene websitelandschap in korte tijd weten te beïnvloeden. Misschien is deze vernieuwende stijl wel helemaal niets en zien we snel een terugslag naar de vaste patronen en best practices. Of zullen juist steeds meer merken hun eigen draai hieraan geven? Grote merken als Dropbox, Bloomberg en The Outline beginnen voorzichtig de karakteristieken van deze stijl te omarmen en proberen een balans te vinden tussen de best practices en esthetiek die je bijblijft. Een soort semi-brutalisme.

Wat de toekomst ook brengt, het kan in ieder geval nooit kwaad om een opvallend alternatief te hebben voor het vertrouwde websitelandschap van vandaag.

Hoe zit het met jouw brutale uitbarstingen? Laat hieronder een linkje achter naar jouw laatste creaties!