Oblikovanje besedil je nepogrešljiv del vsake spletne aplikacije. Izbor prave pisave vpliva ne le na berljivost, temveč tudi na celoten videz vaše spletne strani. Družine pisav igrajo pri tem odločilno vlogo, saj zagotavljajo, da je vaša spletna stran dosledno prikazana na različnih napravah in sistemih. V tem priročniku vam bom pokazal, kako učinkovito definirate družine pisav in kako lahko učinkovito kombinirate različne pisave.
Najpomembnejši vpogledi
Obstajajo neštete pisave, vendar je definicija družin pisav pomembna za doseganje doslednih rezultatov na različnih napravah. Naučili se boste, kako uporabiti lastnost CSS font-family, določiti več pisav in definirati možnosti za nadomestne pisave, da zagotovite, da vaši teksti vedno dobro izgledajo.
Navodila po korakih
Najprej je pomembno razumeti osnove družin pisav. Pisave lahko razdelimo v dve glavni kategoriji: serifne pisave in sans-serifne pisave. Serifne pisave imajo majhne okraske na koncih črk, medtem ko sans-serifne pisave teh nimajo.
Za določitev družine pisav v CSS uporabljate lastnost font-family. Začnite z določitvijo pisave za naslov. Pogosto priporočena pisava za naslove je serifna pisava. V našem primeru izberemo pisavo Droid Serif.
Pri tem navedete več pisav. Najprej se uporablja pisava, ki se prva pojavi na seznamu. Če ta ni na voljo, se uporablja naslednja pisava, dokler ne najdete na voljo pisave.
Za besedila pogosto priporočam sans-serifno pisavo, kot je Droid Sans. Te pisave so pogosto jasnejše in lažje berljive.
Pomembno je, da pisave, ki vsebujejo več besed, postavite v narekovaje. To je potrebno, da se izognete zmedi pri pisavah.
Ko ste definirali pisave, lahko rezultat ogledate v svojem brskalniku. Običajno imate možnost preveriti uporabljene pisave, da vidite, ali je vse pravilno delovalo.
Če ugotovite, da želena pisava ni bila naložena, lahko uporabite Google Fonts. Google Fonts vam ponuja široko izbiro pisav, ki jih lahko enostavno vključite v svojo spletno stran. Potrebno pisavo lahko prenesete neposredno s spletne strani Google Fonts in jo vstavite kot CSS povezavo v svoj HTML dokument.
Tukaj je preprost primer, kako to storite. Pojdite na spletno stran Google Fonts, izberite pisavo in kliknite na gumb povezave, da dobite kodo za vstavljanje.
Zdaj lahko neposredno uporabite svoje pisave iz Googla. Tako imate dostop do številnih lepih pisav, ki morda niso nujno nameščene na uporabnikovi napravi.
Lepe strani tega pristopa je, da Google Fonts lahko tudi predpomni pisave, kar pomeni, da se pri ponovnih obiskih spletne strani nalagajo hitreje. Uporabite to, da izboljšate uporabniško izkušnjo.
Drug vidik, ki je pomemben pri družinah pisav, so možnosti nadomestnih pisav. Imate možnost navesti več alternativ, ki jih bo brskalnik uporabil, če izbrana pisava ni na voljo. To zaščiti vašo spletno stran pred težavami s prikazovanjem.
Prepričajte se, da dobro izberete svoje nadomestne pisave, da zagotovite dosleden ali podoben videz. Na primer, pri serifni pisavi bi lahko kot nadomestne pisave uporabili opcijske pisave, kot sta Georgia ali Times New Roman.
Kot pri vsakem oblikovanju je smiselno eksperimentirati. Preizkusite različne kombinacije, da vidite, katere pisave najbolje sodelujejo in puščajo želeni vizualni vtis.
Sklep - Osnove družin pisav v HTML, CSS in JavaScript
Definicija družin pisav je ključni korak pri oblikovanju vaše spletne strani. Z uporabo CSS font-family in vključevanjem pisav prek Google Fonts lahko zagotovite, da so vaši teksti privlačni in berljivi na različnih napravah. Preizkusite različne pisave in možnosti nadomestnih pisav, da najdete najboljšo kombinacijo za vašo aplikacijo.
Pogosto zastavljena vprašanja
Kako definiram družino pisav v CSS?Uporabite lastnost font-family, ki ji sledi želeno pisavo in opcijske nadomestne pisave.
Ali lahko uporabljam pisave iz Google Fonts?Da, lahko vključite pisave iz Google Fonts tako, da uporabite dano povezavo v -razdelku vaše HTML datoteke.
Kaj so nadomestne pisave?Nadomestne pisave so alternativne pisave, ki jih brskalnik lahko uporabi, če izbrana pisava ni na voljo.
Zakaj so narekovaji okoli pisav potrebni?Narekovaji so potrebni, kadar pisava vsebuje več besed, da se izognete zmedi.
Katero pisavo naj prilagodim za besedilo?Za besedila so sans-serifne pisave, kot sta Arial ali Helvetica, pogosto jasnejše in bolj berljive.
