Liten text 6 sätt att använda det effektivt i webbdesign

En av största trender i webbdesign just nu är super liten. ?Mycket liten? Textelementen har blivit en populär idé, men det är en designtendens som har gjort en viss debatt.

Det råder ingen tvekan om att små textstorlekar kan orsaka vissa läsbarhetsproblem. Men när det är bra kan ett litet block med liten text faktiskt bidra till att skapa en synpunkt och dra användarna till vissa delar av designen.

Följ med oss ​​när vi tittar på den lilla textutvecklingen, med exempel för att ge lite designinspiration.

1. Skapa hierarki och organisation

Medan överdimensionerad text har varit det dominerande alternativet för hemsidor och rubriker på ett tag, finns det ett skifte för att ge mer information på den första skärmen på skrivbordsskärmar. (En orsak till detta kan vara att skärmstorlekarna fortsätter att öka, vilket ger konstruktörer mer duk att arbeta med.)

Det är där? Tiny? Texten kommer in. Genom att använda olika storlekar och proportionerlig skala för typografi skapas ett tydligt visuellt flöde, vanligtvis från stor bokstäver till små. Genom att använda en nivå av liten text - vanligtvis mindre än vanliga kroppstypstorlekar på 14 till 16 poäng - skapar du ytterligare en punkt för användaren att titta på. Liten text, speciellt när den används med andra textstorlekar, kan dra in användaren eftersom den är annorlunda.

Maxime Bonhomme använder liten text i en portföljens webbdesign. De minsta textelementen ger viktiga detaljer om projekt, medan större typ ger en beskrivning av arbetet. Observera hur de små textelementen fungerar delvis på grund av mängden utrymme och kontrakt som omger varje kopieringsblock.

2. Att få dig att se

Ibland är liten text av design där för att du ska titta eller ta en ny blick.
Eftersom det ofta är oväntat eller annorlunda än vad användarna ser på så många andra webbplatser fascinerar designelementet dig.

Mountain Dew, ett varumärke som inte är rädd för att vara edgy, använder en super liten rubrikbehandling. Det gör att du ser ut. Och rubriken passar perfekt in i toppen av X för att skapa ett tydligt ögonrörelsesmönster från åtgärden som rör sig över skärmen med NBA-spelarevideo till rubriken till varumärkesidentifieraren. Även uppmaningen till handling är liten, men det känns inte obekväma för användaren eftersom det känns avsiktligt.

3. Att skapa intressant navigering

Medan många webbplatser har tagit bort navigering från hemsidor helt och hållet till förmån för hamburger / dold stil menyalternativ, kan det med hjälp av liten text vara ett sätt att få några element tillbaka på skärmen utan att känna sig påträngande. Det är en av dessa ebbs och flyter i designmönster, flyttar från en extrem till den andra. (Kommer överdimensionell navigering att vara nästa?)

Att använda liten text i navigeringen kan vara svårt. Det måste vara tillräckligt stort för att läsa och klicka enkelt. Det är viktigt att använda en enkel typsnitt som också är läsbar, eftersom liten text kan vara lite svår för ögonen.

Magic of Lappland hittade en bra mellanklass med små textelement i huvudmenyn. Det finns gott om avstånd runt varje element - vissa även med dubbla däck - och den enkla sans serif i vitt på en mörk bakgrund bidrar till läsbarhet. Det finns också en andra nivå av? Mindre viktigt? liten text ovanför huvudnavigering för resenärer.

4. Till Showcase Space

Liten text fungerar mest effektivt när duken är stor. Kontrasten mellan ett litet element och ett stort utrymme kan vara fantastisk. Stora block av liten text kan krossa och vara svåra att läsa, så håll textelementet kortfattat.

Färgtexten bör också användas med ett tydligt syfte i åtanke. Innan du hoppar in i den här designtendensen, fråga dig själv: Varför använder jag lite text här? Vad bidrar det till betydelsen av min webbdesign?

Om du inte har fasta svar på dessa frågor -? För att jag vill? räknas inte - då bör du överväga något annat.

Moonfarmer gör ett vackert jobb uppvisande utrymme med liten text. Designen använder två nivåer av typografi och massor av bred öppen duk för att skapa en stämning och introducera användarna till innehållet innan de ska klicka eller bläddra. Liten text är bara en av de många detaljerna i designen som drar dig in för att bara stanna och titta. Och med stor kontrast mellan element, finns det ingen oro för läsbarhet.

Designen gör en sak som är viktig att tänka på: Du behöver inte använda liten text överallt. Behandla det som ett speciellt konstelement. Moonfarmer använder liten text på hemsidan och stöter sedan upp samma typsnitt till en mer gemensam storlek under resten av designen.

5. När texten är inte Det viktigaste elementet

Ibland är det viktigaste elementet på skärmen inte bokstäver. Texten kommer sekundärt till ett visuellt element.

Freelance TV är ett perfekt exempel på hur man använder liten text för att hjälpa användare samtidigt som ett annat element kan fungera som den dominerande delen av designen. För det här projektet är videon det viktiga elementet. Liten text fungerar som ett element för att ge ytterligare information och uppmuntra registreringar med ett statiskt textblock som visas oberoende av det avsnitt som finns på hemsidan.

6. Att skapa ett visuellt element

Textelement finns främst för att läsa. Det gör perfekt, logisk mening.

Men ibland fungerar textelement som en del av ett visuellt element, och om de blir lästa eller inte, är det mycket mindre viktigt. (Detta kräver planering och massor av designkonversationer, så ta inte hand om detta koncept på ett infall.)

HTML Burger använder flera lager med liten och liten text. Små text används som en deskriptor med en stor rubrikbehandling. Liten text används inom varje "burger" wrappers för att skapa coola visuella element med lite mer information om vad företaget gör. Det är en designschema som du inte ser väldigt mycket ut och i det här fallet är det imponerande.(Men den här tekniken är ganska svår att dra av, fortsätt med försiktighet.)

Slutsats

Att gå liten eller inte? Det kan vara ett tufft beslut. Medan användandet av liten text kan diskuteras finns det lämpliga användningsområden för liten typografi. För att säkerställa att liten text fungerar i din design, ge den gott om utrymme, använd en typsnitt som är läsbar och använd andra designknappar för att hjälpa användarna att få orden på orden.

Slutligen, om du planerar att experimentera med liten text, använd den sparsamt. Det här är inte en teknik som hjälper ditt barnvagn till en design. Det fungerar mest effektivt med små textblock i avsiktliga placeringar.