Rob's web

Letter variabelen

Lettertype

Bij het kiezen van lettertypes moeten we vergeten welke lettertypes er door applicatie software kan worden toegevoegd en ons beperken tot de lettertypes die door elk OperatingSysteem wordt geleverd. We hebben dan nog maar een kleine keuze. Ook dienen we het media waarop de pagina wordt afgebeeld in acht te nemen.

Webdesign is iets totaal anders dan grafische design waarbij de ontwerpen zelf alles in de hand heeft. De webmaster weet niet op welk medium met scherm de pagina getoond wordt en wat deze kan of wat de toekomst in het verschiet heeft.

Lettertypefamilies

Lettertypes worden in families gekozen. Het is namelijk niet zeker dat de font die U wilt tonen op de computer van de gebruiker aanwezig is. Zeker voor handheld toestellen geldt dit.

We bepalen het lettertype met font-family.

Een voorbeeld van een font-family is font-family: Verdana, Arial, Helvetica, sans-serif. Dit zijn schreefloze lettertypes. De browser kiest ze van links naar recht.

Voor beeldschermen leest een sans-serif type het prettigste. Dit is de meest gangbare keuze voor schermweergave.

Voor de printer is font-family: Georgia, "Times New Roman", Times, serif een betere keus. Times is voor gebruik als krante lettertype ontworpen om een compacte tekst te kunnen maken, maar is op het scherm met zijn lage resolutie niet geschikt bij resoluties kleiner dan 16 pixels. Georgia is als schermlettertype een beter alternatief.

Voor niet proportionele lettertypes gebruiken we font-family: "Courier New", Courier, monospace. Deze family wordt alleen gebruikt als we source-code in een webpagina weergeven ter verduidelijking.

Het gebruik van cursive en fantasy types wordt afgeraden.

Fontnamen met spaties erin zoals Times New Roman dienen tussen aanhalingstekens te staan.

Bij body {font-family:"Times New Roman", Times, serif; .....} gebruiken we dubbele aanhalingstekens. Bij style="font-family:Georgia, 'Times New Roman', Times, serif" worden enkel aanhalingstekens gebruikt omdat de font-family al tussen dubbel aanhalingstekens staat.

Ook webdings en dingbats lettertypes om afbeeldingen te maken horen niet thuis op een webpagina. Maak gifjes voor deze afbeelding en gebruik die.

Het standaard lettertype van de meeste browsers is Times New Roman.

Core fonts

Hieronder een lijst met de font-size: 13px.

Lettergrootte

De grootte van het lettertype bepalen we met font-size.

De beste keuze met de Verdana family is 13px, dus krijgen we font-size: 13px.

Het is ook mogelijk om de grootte met sleutelwoorden aan te duiden, maar deze zijn niet ondubbelzinnig gedefiniert, zodat de grootte het beste in pixels worden benoemd.

Letterstijl

Met font-style kunnen we een tekst cursiveren. Voor het cusief zetten van tekst kun je italic of oblique gebruiken, op het scherm zien ze hetzelfde eruit. Normal zet de tekst weer recht.

Het lettertype Tahoma is niet cursief te zetten.

Lettertypegewicht

Met font-weight kunnen we tekst vet afdrukken.

Om een tekst af te drukken is font-weight:bold de beste keuze.

Letterbreedte

Om een tekst breder of smaller te maken gebruiken font-stretch.

Zoals boven te zien is werkt dit niet. Het is hetzelfde probleem als bij de gewichten van een font.

Variant

Met font-variant kunnen we kleine hoofdletters waar we normaal gewone letters gebruiken.

Font

We kunnen ook eigenschappen samenvoegen met font. Hierbij moeten dan minimaal de size en family genoemd worden.