Bij het ontwerpen van een website is een van de belangrijkste elementen van een pagina waarmee u wilt werken tekstinhoud. Als je dus een webpagina bouwt en deze opmaakt met CSS, zal een groot deel van die inspanning zich concentreren op de typografie van de site.
Typografisch ontwerp speelt een belangrijke rol bij het ontwerpen van websites. Goed opgemaakte en opgemaakte tekstinhoud helpt een site succesvoller te zijn door een leeservaring te creëren die zowel plezierig als gemakkelijk te consumeren is. Een deel van uw inspanningen om met het type te werken, is om de juiste lettertypen voor uw ontwerp te kiezen en vervolgens CSS te gebruiken om die lettertypen en lettertypestijlen toe te voegen aan de pagina's. Dit wordt gedaan met behulp van wat een "font-stack" wordt genoemd
Font-Stacks
Wanneer u een lettertype opgeeft voor gebruik op een webpagina, is het een goede gewoonte om ook fallback-opties op te nemen voor het geval uw lettertype niet kan worden gevonden. Deze fallback-opties worden gepresenteerd in de "font stack". Als de browser het eerste lettertype in de stapel niet kan vinden, gaat het naar de volgende lettertype. Het zet dit proces voort totdat het een lettertype vindt dat het kan gebruiken, of het heeft geen keuzes (in welk geval het gewoon een systeemlettertype kiest dat het wil). Hier is een voorbeeld van hoe een lettertypestapel eruit zou zien in CSS wanneer toegepast op het "body" -element:
lichaam { font-family: Georgia, "Times New Roman", serif;}
Merk op dat we eerst het lettertype Georgia specificeren. Standaard is dit wat de pagina zal gebruiken, maar als dat lettertype om een of andere reden niet beschikbaar is, vervalt de pagina naar Times New Roman. We voegen die lettertypenaam in dubbele aanhalingstekens, omdat het een naam met meerdere woorden is. Voor namen van letterwoorden met één woord, zoals Georgia of Arial, zijn geen aanhalingstekens vereist, maar voor de naam van meerdere woorden is deze nodig, zodat de browser weet dat al deze woorden de naam van het lettertype vormen. Als je het einde van de lettertypestapel ziet, zou je moeten opmerken dat we eindigen met het woord "serif". Dat is een generieke lettertypefamilienaam. In het onwaarschijnlijke geval dat een persoon geen Georgia of Times New Roman op hun computer heeft, zou de site elk serif-lettertype gebruiken dat het zou kunnen vinden. Dit heeft de voorkeur boven het toestaan dat de site terugvalt naar de lettertypen die het wil, omdat je op zijn minst kunt vertellen welk type lettertype je moet gebruiken, zodat het algehele uiterlijk en de toon van het ontwerp van een site zo intact mogelijk blijft. Ja, de browser zal een lettertype voor u kiezen, maar u geeft tenminste advies, zodat het weet welk lettertype het beste werkt binnen het ontwerp. De generieke naam van het lettertype beschikbaar in CSS zijn: Hoewel er veel andere lettertypeclassificaties beschikbaar zijn in webontwerp en typografie, inclusief slab-serif, blackletter, weergave, grunge en meer, zijn deze 5 hierboven genoemde generieke lettertypenamen degene die u zou gebruiken in een lettertypestapel in CSS. Wat zijn de verschillen in deze lettertypeclassificaties? Laten we kijken! Cursief lettertypen bevatten vaak dunne, sierlijke lettervormen die bedoeld zijn om fancy handgeschreven tekst te repliceren. Deze lettertypen zijn vanwege hun dunne, bloemrijke letters niet geschikt voor grote hoeveelheden inhoud, zoals body-copy. Cursieve lettertypen worden over het algemeen gebruikt voor koppen en kortere tekstbehoeften die in grotere lettergroottes kunnen worden weergegeven. Fantasie lettertypen zijn de enigszins gekke lettertypen die niet echt in een andere categorie vallen. Lettertypen die bekende logo's repliceren, zoals de lettervormen van de Harry Potter- of Back to the Future-films, vallen in deze categorie. Nogmaals, deze lettertypen zijn niet geschikt voor body-content, omdat ze vaak zo gestileerd zijn dat het lezen van langere tekstpassages in deze lettertypen veel te moeilijk is om te doen. monospace lettertypen zijn de lettertypen waarin alle lettervormen even groot en uit elkaar geplaatst zijn, zoals u op een oude typemachine zou hebben gevonden. In tegenstelling tot andere lettertypen met variabele breedten voor letters, afhankelijk van hun grootte (een hoofdletter "W" zou bijvoorbeeld veel meer ruimte innemen dan een kleine "i"), hebben monospace-lettertypen een vaste breedte voor alle tekens. Deze lettertypen worden vaak gebruikt wanneer code wordt weergegeven op een pagina omdat ze er duidelijk anders uitzien dan andere tekst op die pagina. serif lettertypen zijn een van de meer populaire classificaties. Dit zijn lettertypen met de kleine extra ligaturen op de lettervormen. Die extra stukjes worden "schreven" genoemd. Common serif-lettertypen zijn Georgia en Times New Roman. Serif-lettertypen kunnen worden gebruikt voor grote tekst zoals koptekst en lange passages van tekst en body-copy. Sans-serif is de uiteindelijke classificatie waar we naar zullen kijken. Dit zijn lettertypen die niet de bovengenoemde ligaturen hebben. De naam betekent "zonder schreef". Populaire lettertypen in deze categorie zijn Arial of Helvetica. Net als bij serifs kunnen sans-serif-lettertypen net zo goed worden gebruikt in koppen als in de inhoud van het lichaam. Algemene lettertypefamilies
