När och hur man använder minimalism i webbdesign

Låt oss först få en missuppfattning om minimalism ur vägen. Bara för att det finns mindre att se betyder det inte att det är lättare. I själva verket är det helt tvärtom. Ju mindre du har, desto mer tid behöver du spendera för att se till att varje element du har är rätt för pengarna.

När allt kommer omkring, om du har ett trångt gränssnitt och om något är justerat något till vänster om mitten, eller ett teckensnitt som inte är helt optimalt för det du använder, kommer det förmodligen inte ens att märkas bland de andra detaljerna.

Det kommer dock inte att vara sant om du använder en minimalistisk webbdesign, eftersom det inte finns något för ditt misstag eller dåliga val att gömma sig bakom. De kommer att sticka ut i skarpa detaljer – som en neonskylt på ett japanskt hus. Vad det betyder är att om du bara försöker sätta ihop en sida så är minimalism inte rätt väg att gå. Minimalism är till för perfektionisterna, de tvångsmässiga, de laserfokuserade, håll dig uppe-till-tre-på-morgonen-för-att-få-den-titeln-precis-rätt typ av webbdesigner. Om det inte är du så är det inte för dig.

Om det sedan är läs vidare, läs vidare! Nedför kaninhålet går vi.

Negativt utrymme

Låt oss börja med att titta på vad en minimalistisk webbplats kommer att ha mest av – negativt utrymme, även om du kanske känner det som ”bakgrunden”. Förutom att det i minimalistisk design inte är ”tillbaka” alls. Istället är det front and center, där det spelar en avgörande roll, genom att det manipulerar användarens visuella flöde.

Kraften med negativt utrymme är att ju mer du har av det, desto mer kommer allt annat du har på sidan att dyka upp. Det är därför industriella designers ofta använder minimalistiska layouter. På så sätt kommer deras produkter istället för att tona in i allt annat att få den uppmärksamhet de letar efter. Och eftersom det är vad de försöker sälja eller åtminstone visa upp som gör det här tilltalande för dem och alla andra som har statiska föremål att visa, som inredningsarkitekter och fotografer.

Negativt utrymme kan vara ett kraftfullt verktyg för att skapa en oas av lugn, samt för att få användare att inte känna sig överväldigade. Det är därför spa och hälsocenter ofta väljer denna typ av layout.

Observera att negativt utrymme inte betyder att det inte finns något där. Självklart måste utrymmet fyllas med något och även om vitt är ett självklart val är det långt ifrån det enda. Dessutom har olika färger helt olika effekter på användarna, så se till att du spenderar lite tid på forskningen. En sak jag skulle vilja påpeka är att man inte väljer en övermättad färg. Detta är ett grundläggande misstag som många förstagångsdesigners gör. Problemet är att det kan vara ganska smärtsamt för användarna, vilket därför gör en av de stora fördelarna med minimalism ogiltig.

Foton

Om bara en färg är för mycket av det goda finns det naturligtvis möjligheten att ta ett foto av något slag. Naturligtvis, om du väljer en bild, se till att den stämmer med den anda av minimalism som du går efter. Bilden behöver inte vara för upptagen.

Jag menar det på två sätt.

1. Se självklart till att bilden inte är alltför belamrad med föremål eller människor, eftersom detta kommer att besegra hela syftet med din minimalistiska design.
2. Det räcker dock inte, eftersom implikationen av snabb rörelse eller fara är lika kapabel att dra ögat till bilden och bort från huvudelementet som du försöker visa. Faktum är att även uppvisningen av en negativ känsla kan distrahera människor från det du verkligen vill att de ska fokusera på.

Av denna anledning, när du surfar genom minimalistiska webbplatser, kommer du att se många foton med mycket neutrala och statiska bakgrunder. Här är några bra exempel.

Typografi

Du kan klippa ut många saker från din minimalistiska sida, som en menyrad, knappar på sociala medier och annonser, men en sak du inte klarar dig utan är ord. Så småningom kommer du att behöva några. Men hur presenterar du dem? Du bör överväga mycket noggrant vilket typsnitt du bestämmer dig för att använda (och om du bestämmer dig för att göra ditt eget), särskilt eftersom olika typsnitt kommer att framkalla olika känslor och olika sinnestillstånd.

Till exempel serif-teckensnitt (det är de där de snirkliga bitarna sticker ut under och ovanför linjen) läses mer flytande än sans serif-teckensnitt och anses därför vara lättare att förstå. På samma sätt, eftersom instruktionerna är skrivna i renare, ses mer läsbara typsnitt (som Ariel till exempel) som mer begripliga än de som är skrivna i mer förvirrande och jobbigare teckensnittsval, vilket gör att dessa instruktioner anses vara lättare att utföra.

Men läsbarheten är förstås inte det enda som behöver beaktas, man måste också tänka på vilka känslor typsnitten väcker. Ja, det stämmer, olika typsnitt påverkar människor olika, med typsnitt som Times New Roman oftare förknippas med känslor som ”rolig” och ”arg” än Ariel.

Jag varnade dig för att minimalism inte var för svaga hjärtan!

En annan sak att tänka på är vilka typsnitt du använder var, eftersom du självklart inte behöver använda samma typsnitt genomgående. Och eftersom det inte finns något annat som distraherar din publik, om du använder olika teckensnittsstilar och typografier kommer din användare att vara mycket mer benägen att lägga märke till dem.

Detta kan därför vara en mycket effektiv strategi för att få din publik att uppmärksamma specifika områden. Överväg till exempel att skriva den text som du vill att användarna ska läsa först i fet stil, med tjocka streck, medan de delar som ska läggas märke till senare skrivs i mer neutrala teckensnitt. Användarens blick kommer omedelbart att dras till den fetare texten medan den andra texten kommer att konsumeras senare.

Kontrast och positionering

Ett av de mest kraftfulla verktygen som finns tillgängliga för en minimalistisk webbdesigner är kontrast. Om du vill använda kontrast för bästa effekt måste du välja ljusa bakgrunder – vit är det dominerande valet, eftersom detta ger den bästa effekten. Det är därför minimalistiska sidor ofta använder svart på vit bakgrund eftersom dessa skarpa linjer är oerhört visuellt tilltalande. Här är ett bra exempel. Dessutom kan den minsta färgen, som en stänk av gult, vara mycket effektiv. Tänk bara på flickans kappa i Schindlers lista.

En designer kan skapa ett kontrakt med många olika saker, inklusive färg, form, plats, skala och storlek. Om det används på rätt sätt kan det vara otroligt användbart för att leda din användare till de delar som de bör vara uppmärksamma på först (ungefär som jag förklarade i termer av typografi ovan, när jag diskuterade feta kontra mer neutrala texter). Det är dock inte lätt, och för att använda det på bästa sätt är det nödvändigt att ha en grundläggande förståelse för hur användare konsumerar internetsidor.

Studier av ögonrörelser har gett oss stor insikt i var människor tittar först, där de vanligtvis börjar längst upp till vänster och sedan, beroende på om det är mycket text eller inte, antingen skannar sidan i ett ”F” eller ett ”Z”-mönster.

Eftersom din minimalistiska sida inte kommer att vara tung med text, vill du därför ordna de viktigaste aspekterna av din sida i ett Z-mönster, med de saker som dina användare bör lägga märke till först (du är dina menyalternativ) en position mer uppe till vänster på din sida, medan de saker som bör uppmärksammas senare (t.ex. dina upphovsrättsanspråk) kommer ner längre och längre till höger. På så sätt kommer du att göra konsumtionen av din sida mer flytande och mer naturlig.

Hamburgerknappen och andra layouter

Det enda som är viktigt att komma ihåg med minimalistisk design är att bara för att det inte finns mycket att se per sida betyder det inte att det inte finns mycket innehåll överlag; för det mesta är all den informationen bara undangömd i undermenyer och sekundära sidor. Ett populärt (men kontroversiellt) sätt att göra detta på är genom det som kallas ”hamburgerknappen”, eller de tre linjerna som du nu ser överallt, som i krom uppe till höger såväl som på iPhone. Och ja, om du har druckit ett par drinkar ser det ut som en hamburgare (jag hittade inte på namnet).

Personligen är jag inget stort fan då detta går emot mina minimalistiska instinkter. Vad är poängen med att skapa en enkel sida om du sedan ska skapa en rörig meny för att surfa på resten av din webbplats? För mig är en mycket bättre strategi att dela upp din hamburgerknapp i flera menyval som är uppenbara och lätta att förstå och som kommer att engagera dina läsare, men det är i slutändan upp till dig.

En viktig faktor att tänka på när du funderar på om du ska skapa flera menyalternativ eller använda en knapp är hur gammal din publik är. Ju äldre de är, desto mindre bekanta kommer de att vara med denna design och desto mer sannolikt kommer de därför inte att hitta dina undermenyer, vilket kan göra din sida värdelös. Så är din sida främst riktad till millennials? Varsågod och använd den. Betjänar du pensionärer? Det är nog klokt att tänka om.

Visuell stil

Och så är det hur din sida är tänkt att vara upplagd. När du bestämmer dig för att välja en minimalistisk stil måste du välja en layoutstil och sedan hålla fast vid den. Detta beror på att din publik omedelbart kommer att börja göra omedvetna antaganden om hur din webbsida passar ihop och om du sedan bryter mot dessa antaganden kommer dina användare att känna att din sida är ”stökig” och ”oorganiserad”. Det är en dödsstöt för minimalism (och de flesta andra sidor också, ärligt talat).

Av denna anledning måste du välja ett rutnät, vilket i princip betyder kolumnerna där du har delat upp din sida, och hålla fast vid det. Hur många kolumner vill du ha? Hur kommer de att fördelas? Hur mycket negativt utrymme kommer att finnas kvar mellan dem? Dessa är alla viktiga frågor som du behöver svara på innan du ens börjar lägga ut sidan.

Tanken här är inte att bilder inte kan överskrida gränserna för dessa rutnätslinjer. Ofta sprider bilder hela din sida. I det här fallet skulle texten om bilden som presenteras nedan arrangeras i de kolumner du valt. På samma sätt, om du har flera bilder på din sida, bör de följa rutnätet du har skapat så att din sida överlag kommer att se ren och professionell ut.

Är minimalism värt det?

Det beror ärligt talat på vad du försöker göra (och naturligtvis ämnet för din sida). Om du försöker minska ditt arbete, så är som redan sagt minimalism inte något för dig. Om å andra sidan den här typen av layout instinktivt tilltalar dig och passar den typ av produkt du trycker på, så är det vägen framåt.

Saken är den att minimalism kräver en annan kompetens än standarddesign, eftersom du inte bara kan använda vanliga bitar och sätta ihop dem för att skapa en sida. Om du försöker göra det, kommer du att sluta med något som inte är visuellt tilltalande eller så informativt. Det värsta av två världar med andra ord.

Istället kommer du att behöva spendera lite tid på att lära dig hur du undergräver dina grundläggande instinkter som du har plockat upp från tidigare siddesigner du har gjort. Då måste du sätta dig ner och ta reda på vad som är viktigt för din sida.

Och du kommer att behöva ta tag i kontrakt, typsnitt och foton som du aldrig har gjort förut. Det är nästan som att du lär dig ett nytt formspråk. Det kan vara svårt.

Grejen med att lära sig ett nytt språk är dock att det får dig att inse saker om ditt originalspråk som du aldrig lagt märke till tidigare. Och detta är lika sant med att lära sig minimalistisk webbdesign. Själva handlingen att försöka lära sig att designa på detta sätt kommer att få dig att inse saker om design som du aldrig visste förut.

Och det kan mycket väl göra allt svettande och hårt arbete värt det.

Glömde för ögonblicket att minimalistiska sidor helt enkelt är vackra, förstås.