Sintaksa fonta i obitelji
Tipografski dizajn je kritički važan dio uspješnog dizajna web stranica. Stvaranje web stranica s tekstom koji je lako čitljiv i koji izgleda sjajno je ciljevi svakog profesionalca za web dizajn. Da biste to postigli, morat ćete moći postaviti određene fontove koje želite koristiti na svojim web stranicama. Da biste odredili vrstu pisma ili obitelj fontova na web-dokumentima, koristit ćete svojstvo stila fonta i obitelji u vašem CSS-u.
Najjednostavniji font-obiteljski stil koji možete upotrijebiti uključuje samo jednu obitelj fontova:
p {font-family: Arial; }Ako ste ovaj stil primijenili na stranicu, svi stavci bi se prikazali u obitelji "Arial". To je sjajno i budući da je "Arial" poznat kao "web-safe font", što znači da većina (ako ne i svih) računala bi ga instalirala, možete se odmoriti prilično lako znajući da će se vaša stranica prikazati u željenom slovu ,
Pa što će se dogoditi ako se font koji odaberete ne može pronaći? Na primjer, ako ne upotrebljavate "sigurni web-font" na stranici, što čini korisnički agent ako nemaju taj font? Oni čine zamjenu.
To može rezultirati nekim vrlo smiješnim stranicama. Jednom sam otišao na stranicu na kojoj je moje računalo potpuno prikazivalo u "Wingdings" (skupini ikona) jer moje računalo nije imalo font koji je programer odredio, a moj preglednik je napravio vrlo loš izbor u tome što bi font trebao koristiti kao zamjenu. Stranica je bila posve nečitljiva za mene! Ovo je mjesto gdje font stack dolazi u igru.
Odvojite više obiteljskih slova s zarezom u staklu fonta
"Font stog" je popis fontova koje želite koristiti na stranici. Stavili biste svoj izbor fonta u skladu s vašim željama i razdvojiti ih svaki s zarezom. Ako preglednik nema prvu obitelj fontova na popisu, pokušat će drugi, a zatim treći i tako dalje dok ne pronađe onaj koji ima na sustavu.
font-obitelj: Pussycat, Alžir, Broadway;U gore navedenom primjeru preglednik će najprije potražiti font "Pussycat", a zatim "alžirki", a zatim "Broadway" ako nijedan od ostalih fontova nije pronađen. To vam daje veću vjerojatnost da će se koristiti barem jedan od odabranih fontova. To nije savršeno, zbog čega još možemo dodati na svoj font (čitajte!).
Koristi Generic Fonts Last
Na taj način možete stvoriti font stog s popisom fontova i još uvijek nemate nijedan koji preglednik može pronaći. Očigledno ne želite da se vaša stranica pokaže nečitljivima ako preglednik čini loš izbor za zamjenu. Srećom, CSS ima i rješenje za to: generic fonts .
Uvijek biste trebali zaustaviti svoj popis fonta (čak i ako je popis jedne obitelji ili samo sigurni fontovi na webu) s generičkim fontom. Postoji pet koji možete koristiti:
- rukopisni
- fantazija
- monospace
- bez vitica
- crtica
Dva gore navedena primjera mogu se promijeniti na:
font-obitelj: Arial, sans-serif; font-obitelj: Pussycat, Alžir, Broadway, fantasy;Neka imena obiteljskih slova su dvije ili više riječi
Ako je obitelj fontova koju želite koristiti je više od jedne riječi, onda ga trebate okružiti oznakama s dvostrukim navodnicima. Dok neki preglednici mogu čitati obitelji fontova bez navodnika, može doći do problema ako je razmak prazan ili zanemaren.
font-obitelj: "Times New Roman", serif;U ovom primjeru možete vidjeti da je naziv fonta "Times New Roman", koji je više riječi, sadržan u navodnicima. To govori pregledniku da su sve tri ove riječi dio tog imena fonta, za razliku od tri različita slova s jednim riječima.
Izvorni članak Jennifer Krynin. Uredio je 12/2/16 Jeremy Girard