Ledande: Utrymmet är lika viktigt som ord
En nyckelkomponent till vilken webbdesign som helst är typ. Val av teckensnitt, storlekar och färger kan vara en stor del av hur du skisserar din webbplats. Precis lika viktigt som brevformerna själva är avståndet mellan de bokstäverna och särskilt den ledande som används i textblock.
Ju mer typ du använder desto viktigare blir ledningen. Bakom teckensnitt och storlek är det en av de viktigaste faktorerna att överväga när man tittar på hur läsbar typ är.
De ledande specifikationerna du använder för en logotyp eller en stänkskärm kan vara mycket annorlunda än den ledande som används för typen i ett blogginlägg.
Andra designelement påverkar också hur du ska använda ledande. Storleken på typ, bredd på kolumner och jämn bakgrundsfärg kan hjälpa dig att göra kloka ledande val.
Hur du använder ledande märkbarhet kommer till spel för stora textblock.
Vad leder?
Ledande - uttalad ledding - är avståndet mellan linjer av typ. Ledande mättes traditionellt i punkter (precis som teckensnitt). Termen härstammar från gammal brevpresse, när typ sattes för hand. Blyremsor placerades mellan linjer av typen för att hålla allt i perfekt anpassning.
Sedan adventen av digital publicering har ledande ofta blivit förvirrad med linjens höjd. Linjans höjd är hela rymden från en baslinje - det imaginära planet där bokstäver som "a", "x" och "n" sitter - till nästa. Ledande är däremot utrymmet från botten av ett brev på en rad, till toppen av ett brev på nästa: det är bokstavligen linjens höjd minus texthöjden.
I digital typografi, särskilt webtypografi, används termen ledande och linjens höjd ofta utbytbart. I CSS är det till exempel inget ledande värde, vi använder istället linjens höjd.
Ledande var en gång ett fysiskt, mätbart värde, det används nu mest som koncept: det visuella intrycket av rymden mellan två linjer.
Hur ledande används i ett textblock kan påverka läsbarheten. Det finns en fin linje mellan typen som är för nära varandra och för långt ifrån varandra. Varken extrem kan vara tuff på läsarens ögon. Ledande handlar om att ändra typets densitet. Nyckeln är att förstå vilket meddelande du tänker för din typ att förmedla och matcha ledande i enlighet därmed.
Ingen perfekt lösning
Det finns ingen perfekt, magisk formel för att bestämma hur mycket ledande du behöver. En kombination av faktorer är inblandade - typstorlek, färg, önskad effekt och viktigast avläsbarhet.
Som en allmän regel är utgångspunkten för ledningen vanligen densamma som punktstorleken på teckensnittet du använder. Vissa program, speciellt webbläsare, tar det lite längre och ställer in standarden som leder lite högre än punktstorleken, vanligtvis med en standard på 120 procent. Så block som innehåller 10-punkts text skulle ha 12-punkts ledande.
Denna filosofi fungerar bra för stora textblock, till exempel blogginlägg, som använder vanliga typsnitt utan extravaganta uppstigningar, nedstigningar eller ligaturer på blekta, neutrala bakgrunder (tänk svart typ på vitt eller beige). Du har en känsla av att alla textlinjer går samman medan du lägger till i tillräckligt mycket utrymme som det är lätt på ögonen.
Textblock är enklaste att läsa när ledande är bredare än ordavstånd. Denna andel kommer att hjälpa ögat att röra sig över sidan och sedan ner, efter det naturliga flödet av avstånd från mörkt till ljus.
Den här "normala" linjens höjd känns också lämplig för saker som kräver mycket läsning. Det är den standard som används av många webbplatser och tryckta publikationer.
Håll det ordentligt
Starkt eller negativt, ledande sker när linjer av typen är närmare än punktens storlek. Till exempel, om din typ är stor med 14 poäng, skulle någon ledning under 14 poäng anses vara snäv, även om den inte visas för nära avstånd på skärmen.
Stram ledning kan skapa en känsla av tvång. Det kan också användas för att skapa kaos. Å andra sidan kan strängare ledning användas som en metod för att sammanföra bitar av typen eller för att skapa en tydlig organisationssensor. I många år i tryck och på nätet har nyhetsorganisationer använt några av de snävare ledande specifikationerna för kroppstyp. I tryck var detta för att spara utrymme; På nätet är det att upprätthålla känslan av trovärdighet och utseendet i samband med organisationerna och deras printpartners.
Tänk på fall och bokstäver som sitter ovanför och under x-höjden när du ställer in specifikationer för linjens höjd. När du arbetar i alla kepsar finns det ingen uppstigning eller nedstigning, så du kanske finner det nödvändigt att strama linjeavståndet, till exempel tekniken som används av Regenerate Music Co. Detsamma gäller för teckensnitt som har kortare uppstigningar och nedstigningar.
Typ som används i större storlekar, till exempel rubriker eller logotyper, kan ibland också dra nytta av stramare ledning.
Slappna av
Lös eller positiv, ledande lägger till avstånd så att ledaren är större än den punktstorlek som används för typen. Till exempel, om din typ är uppdelad i 14 poäng, skulle något utrymme på 15 poäng eller mer anses vara lös. Med vissa typsnitt kan avståndet kanske inte se ut på skärmen trots att det är klassificerat så.
Löst ledande kan göra en sida ljus och luftig. Det är ett tidtestat trick för designers att bara lägga till ledande när typen känner för tjock eller tung på sidan. Ledande som är för lös kan dock vara svårt att läsa och följa om mycket text används. Det är bäst reserverat för få ord.
De flesta designers tenderar att använda lösare som leder till huvudkroppstypen på bloggar och för andra stora textblock. Lös, men inte för lös, ledande kan vara lätt att läsa och följa. Det kan göra att mindre text verkar något större än den är och hjälper till att balansera extremt långa rader av text. Notera användningen av ledande på bloggen A List Apart, den större typsnittet för kroppen använder en spec medan den mindre typen i den högra sidofältet är mycket lösare, vilket gör den mindre typen lättare att följa och balansera den med de andra elementen på sidan .
Många designers väljer också lossare ledande när man använder sans serif typsnitt. Det kan vara ett särskilt bra alternativ när man arbetar med teckensnitt med överdrivna blomningar eller ligaturer. Det extra utrymmet gör att bokstäverna kan andas utan överlappning.
Löst ledande är också ett viktigt övervägande om du planerar att använda massor av fet, färgad typ eller typsnitt med tunga vikter. Bloggess blogg använder en kombination av färg, djärv och kepsar på hela webbplatsen, vilket ger positivt ledande ett nödvändigt läsbarhetsverktyg. I det här fallet hjälper lös ledande också till att dra i ögonen mot de viktiga delarna av texten, som är färg och fet.
Bakgrundsfärger och ledande
Färg och kontrast är särskilt viktiga när du väljer en linjehöjd.
På mörka bakgrunder kan du använda lite mer ledande än du kanske på en ljusare bakgrund för att hjälpa till att lindra en känsla av massa. Mörka färger kan lägga vikt på din design som kan stram ledande, men väljer att använda bara en eller den andra kan du skapa mer balans.
Detsamma gäller vid användning av typ av färg. Färger, andra än svarta och mörka grays, kan lägga till olika mängder av vikt på din design. Beroende på bakgrundsfärgen kan en del text till och med få blöda ut på bakgrunden - det händer för vissa människor, särskilt när man läser rött bokstäver på en vit bakgrund. Tillägget av ledande kan hjälpa till att göra dessa typer av text mer läsbara.
Ändra bredder och ledande
Responsiv design gör förståelsen ledande (och typ i allmänhet) ännu viktigare.
Med olika skärmupplösningar och former måste typspecifikationer anpassas så att en webbplats förblir läsbar. Eftersom texten krymper (eller växer) på skärmen måste ledaren anpassa sig i enlighet därmed.
Kom ihåg att hålla linjens höjdprocent i åtanke när du gör dessa justeringar. Eftersom typen blir mindre för mobila och andra småskärmsenheter. Överväg att öka linjens höjd med 20 procent över vad du använde för fullskalig design. Den ökade ledningen bör hjälpa läsbarheten när den är kopplad till mindre typ.
Så när du bestämmer ledande specifikationer för din webbplats behöver du flera uppsättningar av trösklar: En för din grundläggande webbdesign, en för medelstora enheter som iPad och andra tabletter och en för mobiltelefoner. Var och en kan ha en annan uppsättning proportioner som används för text till linjehöjd.
Slutsats
Nu när du är beväpnad med en mängd olika ledande tips och verktyg, var börjar du?
Det finns ingen checklista. Din bästa satsning är att ta en titt på typen och se hur det känns (använd det goda gammaldags ögontestet). Låt det sitta en stund och kom tillbaka till det igen senare. Känner du fortfarande på samma sätt om texten? Känner du känslan av den känsla du har i åtanke för din webbplatsdesign?
Observera att detta är mest effektivt när textblocket innehåller faktisk kopia istället för platshållare. Du vill få en realistisk syn och platshållare alternativ innehåller ibland udda antal bokstäver som inte används allt som ofta är i reell kopia.
Lek med det. Visa din textdesign till någon annan för extra åsikter. Fråga dem hur de känner till det.
Se också till att para ditt textblock med resten av elementen i designen. Det här kanske inte är det första steget, men ibland sätter allt ihop kan skapa oavsiktliga effekter. Se till att det passerar ögontestet igen.