Leiden: ruimte is net zo belangrijk als woorden
Een belangrijk onderdeel van elk website-ontwerp is type. Het selecteren van lettertypen, grootten en kleuren kan een groot deel uitmaken van hoe u uw site schetst. Net zo belangrijk als de lettervormen zelf, is de spatiëring rond die letters en met name de tekst die in tekstblokken wordt gebruikt.
Hoe meer letters je gebruikt, des te belangrijker wordt het leiden. Achter het lettertype en de grootte is het een van de belangrijkste factoren om te overwegen wanneer u kijkt naar hoe leesbaar type is.
De toonaangevende specificaties die u gebruikt voor een logo of een startscherm, kunnen heel anders zijn dan die van het type dat u gebruikt in een blogbericht.
Andere ontwerpelementen hebben ook een invloed op hoe u het leiden moet gebruiken. De grootte van het type, de breedte van de kolommen en zelfs de achtergrondkleur kunnen u helpen om verstandige, toonaangevende keuzes te maken.
Hoe u het meest gebruikt, komt met name in aanmerking voor grote blokken tekst.
Wat leidt?
Toonaangevende - uitgesproken ledding - is de afstand tussen lijnen van het type. Leiden werd traditioneel gemeten in punten (net zoals lettertypen). De term is ontstaan met letters in oude stijl, toen het type met de hand werd ingesteld. Loodstrips werden geplaatst tussen lijnen van het type om alles in perfecte uitlijning te houden.
Sinds de opkomst van digitale publicatie is het leiden vaak verward met lijnhoogte. Lijnhoogte is alle ruimte van één basislijn - het denkbeeldige vlak waarop letters zoals 'a', 'x' en 'n' zitten - naar de volgende. Toonaangevende, daarentegen, is de spatie vanaf de onderkant van een letter op één regel, naar de top van een letter op de volgende: het is letterlijk de lijnhoogte minus de teksthoogte.
In digitale typografie, in het bijzonder webtypografie, worden termen leidend en lijnhoogte vaak door elkaar gebruikt. In CSS is er bijvoorbeeld geen beginwaarde, in plaats daarvan gebruiken we regelhoogte.
Terwijl leidinggeven ooit een fysieke, meetbare waarde was, wordt het tegenwoordig het meest gebruikt als concept: de visuele indruk van ruimte tussen twee lijnen.
Hoe toonaangevend in een tekstblok wordt gebruikt, kan de leesbaarheid beïnvloeden. Er is een dunne lijn tussen het type dat te dicht bij elkaar ligt en te ver uit elkaar. Beide extreme kunnen moeilijk zijn voor de ogen van een lezer. Toonaangevende heeft alles te maken met het veranderen van de dichtheid van het type. De sleutel is om te begrijpen welke boodschap je van plan bent om jouw type dienovereenkomstig over te brengen en te matchen.
Geen perfecte oplossing
Er is geen perfecte, magische formule om te bepalen hoeveel je moet leiden. Het gaat om een combinatie van factoren: lettergrootte, kleur, gewenst effect en vooral leesbaarheid.
Als algemene regel geldt dat het beginpunt voor het maken van leads gewoonlijk hetzelfde is als de puntgrootte van het lettertype dat u gebruikt. Sommige software, met name webbrowser, gaat wat verder en stelt de standaardwaarde iets hoger in dan de puntgrootte, meestal met een standaardwaarde van 120 procent. Dus blokken met 10-punts tekst zouden 12-punts leidend zijn.
Deze filosofie werkt uitstekend voor grote blokken tekst, zoals blogposts, die gewone lettertypen gebruiken zonder extravagante opklimmende stijgers, afstammelingen of ligaturen op bleke, neutraal gekleurde achtergronden (denk aan zwart op wit of beige). U behoudt het gevoel dat alle tekstregels samengaan en er net voldoende ruimte bij wordt toegevoegd, zodat u het gemakkelijk kunt zien.
Tekstblokken zijn het gemakkelijkst te lezen als de afstand breder is dan de woordafstand. Deze verhouding helpt het oog over de pagina en vervolgens naar beneden te bewegen, waarbij de natuurlijke stroom van afstand van donker naar licht wordt gevolgd.
Deze "normale" lijnhoogte zal ook geschikt zijn voor dingen die veel lezen vereisen. Het is de standaard die door veel websites en gedrukte publicaties wordt gebruikt.
Houd het goed
Strakke of negatieve aanwijzing treedt op wanneer lijnen van het type dichterbij zijn dan de puntgrootte van het type. Als uw type bijvoorbeeld een grootte heeft van 14 punten, wordt elke voorsprong van minder dan 14 punten als strak beschouwd, ook als deze niet te dicht op het scherm wordt weergegeven.
Strakke leiding kan een gevoel van dwang creëren. Het kan ook worden gebruikt om chaos te creëren. Aan de andere kant kan strakkere leiding worden gebruikt als een methode om bits van het type bij elkaar te brengen of om een duidelijk gevoel van organisatie te creëren. Al vele jaren in print en online gebruiken nieuwsorganisaties enkele van de strakste leidende specificaties voor lichaamstype. In print was dit om ruimte te sparen; online is het om het gevoel van geloofwaardigheid en de uitstraling van de organisaties en hun drukpartners te behouden.
Denk aan letters en letters die boven en onder de x-hoogte zitten bij het instellen van de specificaties voor de lijnhoogte. Als u in alle hoofdletters werkt, zijn er geen stijgers of dalers, dus u zou het misschien nodig vinden om de regelafstanden aan te passen, zoals de techniek die wordt gebruikt door Regenerate Music Co. Hetzelfde geldt voor lettertypen met kortere stijgers en descenders.
Type dat wordt gebruikt in grotere formaten, zoals koppen of logo's, kan soms ook profiteren van strakkere afleiding.
Maak los
Loose of positive, leading is spacing toevoegen, zodat de lead groter is dan de puntgrootte die voor type wordt gebruikt. Als uw type bijvoorbeeld op 14 punten wordt gesorteerd, wordt elke spatie van 15 punten of meer als los beschouwd. Bij sommige lettertypen ziet de ruimte er misschien niet los uit op het scherm, ook al is het op die manier geclassificeerd.
Losse lijnen kunnen een pagina licht en luchtig maken. Het is een beproefde truc voor ontwerpers om alleen maar leading toe te voegen wanneer het type te zwaar of zwaar aanvoelt op de pagina. Leidinggeven dat te los is, kan echter moeilijk te lezen en te volgen zijn als er veel tekst wordt gebruikt; het is het best voorbehouden voor een paar woorden.
De meeste ontwerpers neigen naar het gebruik van losser leiden voor het hoofdteksttype op blogs en voor andere grote blokken tekst. Los, maar niet te los, kan leiden gemakkelijk zijn om te lezen en te volgen. Het kan ervoor zorgen dat kleinere tekst iets groter lijkt dan het is en helpt om extreem lange tekstregels in balans te brengen. Let op het gebruik van de hoofdtekst op het A List Apart-blog, het grotere lettertype voor het lichaam gebruikt één specificatie, terwijl het kleinere lettertype in de rechterzijbalk veel losser is, waardoor het kleinere type gemakkelijker te volgen is en het in balans is met de andere elementen op de pagina .
Veel ontwerpers kiezen ook voor een losser begin bij het gebruik van schreefloze lettertypen. Het kan een bijzonder goede optie zijn bij het werken met lettertypen met overdreven bloeit of ligaturen. De extra ruimte laat letters ruimte om te ademen zonder overlapping.
Loose leading is ook een belangrijke overweging als u van plan bent veel vet, gekleurd type of lettertypen met zware gewichten te gebruiken. Het Bloggess-blog maakt gebruik van een combinatie van kleur, vetgedrukte letters en hoofdletters op de hele site, waardoor het een goed leesbare tool wordt. In dit geval helpt losse lijnen ook om de aandacht te vestigen op de belangrijke delen van de tekst, die in kleur en vet zijn.
Achtergrondkleuren en toonaangevend
Kleur en contrast zijn vooral belangrijk bij het kiezen van een lijnhoogte.
Als je donkere achtergronden hebt, wil je mogelijk iets meer leiden dan je zou kunnen gebruiken op een lichtere achtergrond om een gevoel van massa te verminderen. Donkere kleuren kunnen gewicht toevoegen aan uw ontwerp, net als een strakke lijn, maar als u alleen de ene of de andere kiest, kunt u meer balans creëren.
Hetzelfde geldt voor het type van een kleur. Kleuren, andere dan zwarte en donkere grijstinten, kunnen verschillende hoeveelheden gewicht aan uw ontwerp toevoegen. Afhankelijk van de achtergrondkleur, kan sommige tekst er zelfs uitzien als een bloeding op de achtergrond. Dit gebeurt bij sommige mensen, vooral bij het lezen van rode letters op een witte achtergrond. De toevoeging van leiden kan dit soort tekst leesbaarder maken.
Van breedte veranderen en leiden
Responsief ontwerp maakt het begrijpen van toonaangevende (en type in het algemeen) nog belangrijker.
Met verschillende schermresoluties en vormen moeten typevoorkeuren dienovereenkomstig worden aangepast om ervoor te zorgen dat een site leesbaar blijft. Naarmate de tekst krimpt (of groeit) op het scherm, moet de leidraad dienovereenkomstig worden aangepast.
Vergeet niet om de verhoudingen van de lijnhoogte in acht te nemen wanneer u deze aanpassingen aanbrengt. Omdat het type kleiner zal zijn voor mobiele apparaten en andere apparaten met een klein scherm. Overweeg om de lijnhoogte met 20 procent te verhogen ten opzichte van wat u voor het volledige ontwerp hebt gebruikt. De toegenomen voorsprong moet de leesbaarheid bevorderen wanneer deze wordt gecombineerd met een kleiner type.
Dus wanneer u toonaangevende specificaties voor uw site bepaalt, heeft u verschillende drempels nodig: één voor uw basisontwerp van de website, één voor middelgrote apparaten zoals de iPad en andere tablets, en één voor mobiele telefoons. Elk kan een verschillende reeks verhoudingen hebben die worden gebruikt voor tekst tot regelhoogte.
Conclusie
Nu u gewapend bent met een verscheidenheid aan toonaangevende tips en hulpmiddelen, waar begint u?
Er is geen checklist. Je kunt het beste het type bekijken en zien hoe het voelt (gebruik de ouderwetse oogtest). Laat het een tijdje zitten en kom er later weer op terug. Voel je je nog steeds op dezelfde manier over de tekst? Komt het gevoel dat u krijgt overeen met het gevoel dat u voor uw siteontwerp in gedachten hebt?
Merk op dat dit het meest effectief is wanneer het tekstblok een werkelijke kopie bevat in plaats van een tijdelijke tekst. U wilt een realistisch beeld en plaatsaanduidingsopties bevatten soms een oneven aantal letters die niet zo vaak in echte kopie worden gebruikt.
Speel ermee. Laat uw tekstontwerp aan iemand anders zien voor extra meningen. Vraag hen hoe ze erover denken.
Zorg er ook voor dat je je tekstblok koppelt met de rest van de elementen in het ontwerp. Dit is misschien niet de eerste stap, maar soms kan het samenvoegen van dingen onbedoelde effecten veroorzaken. Zorg ervoor dat het nogmaals de oogtest doorstaat.