29Sep

    Web Fonti un kā tos izmantot interneta vietnēs

    Vēsturiski ir iegājies tā, ka tīmekļa vietnes fonti tiek ņemti no lietotāja mašīnas, nevis servera kā tas ir gadījumā ar bildēm un video. Tīmekļa vietnes izstrādātājs vienkārši norāda kuru fontu izmanto, un tālāk jau pārlūkprogramma to pieprasa no lietotāja datora. Diemžēl mums ir daudz un dažādas operētājsistēmas, kuras nāk ar dažādiem fontiem, tāpēc parasti izmanto tā saucamos web safe fontus, kuri atrodami gandrīz visās operētājsistēmās un to dažādās versijās (sk. sarakstu).

    Arial

    Arial Black

    Comic Sans MS

    Courier New

    Georgia

    Impact

    Tahoma

    Times New Roman

    Trebuchet MS

    Verdana

    Jāatzīmē gan tas, ka dažādas operētājsistēmas vienu un to pašu fonu var attēlot nedaudz savādāk , tāpat arī sarakstā atrodamie fonti ir atrodami gandrīz visās Windows versijās, tomēr priekš citām operētājsistēmām var nākties piemeklēt līdzīgu fontu. Piemēram, Trebuchet MS uz Mac ir Helvetica, tādēļ deklarējot fontu izmanto izmanto fontu steku

    font-family: 'Trebuchet MS', Helvetica, sans-serif;

    Tātad, ja uz lietotāja datora nebūs atrodams Trebuchet MS, tad tika meklēta Helvetica, ja ari šis fonts nebūs atrodams, tiks izmantot standarta sans-serif fonts.

    Kā izmantot nestandarta fontus webā?

    Tomēr pasaule nestāv uz vietas, dizaineriem vienmēr ir bijusi vēlme izmantot savādākus fontus kā citiem. Viens variants ir tekstu , kas rakstīts nestandarta fontā, pārveidot par bildi vai “Flash” elementu. Diemžēl šāda taktika nav īpaši draudzīga meklētājprogrammām, jo tās nespēj noindeksēt šādu tekstu. Nākamais variants ir izmantot “Cufon” tehnololoģiju, izmantojot javascript. Šinī gadījumā teksts ir indeksējams, bet lietotājs to nevar iezīmēt, līdz ar to šāds teksts nav īpaši piemērots paragrāfa elementiem.

    Kāds ir risinājums?

    CSS3 versija apraksta @font-face elementu, kur tīmekļa vietnes izstrādātājs norāda, kur fonts atrodas uz servera un tālāk jau pārlūkprogramma pati ielādēs šo fontu. Jauno fontu var izmantot dažādos HTML elementos, deklarējot tāpat kā līdz šim ar CSS font-family elementu. Izklausās gan vienkārši, bet diemžēl arī šim risinājumam ir trūkumi. Pirmkārt, tikai pašas jaunākās pārlūkprogrammas atbalsta vienoto fontu formātu “WOFF”. Otrkārt, problēma, ka dažādās operētājsistēmās ar dažādām pārlūkprogrammām teksts attēlojas savādāk, vēl arvien pastāv. Lai risinātu vismaz pirmo problēmu, var izmantot dažādus fontu formātus vai arī izmantot kādu no fontu hostinga servisiem, kuri piedāvā atrisināt šo problēmu. Viens no populārākajiem risinājumiem ir typekit.com, savukārt populārākais bezmaksas risinājums ir google.com/webfonts.

    Ja nu tomēr ir vēlme fontu hostēt uz sava servera, tad ļoti daudz, augstas kvalitātes bezmaksas fontus var lejupielādēt no Fontsquirrel.com, ja nu šeit nav atrodams vajadzīgais fonts, var izmantot maksas fontu bibliotēkas kā Fontspring.com vai Fonts.com. Šeit jāatceras, ka iegādājoties fontus, ļoti svarīgi ir nopirkt fontu ar tādu licenci, kas atļauj to izmantot tīmekļa vietnēs.

    Pašās beigās gribu piebilst, ka viss iet uz priekšu un attīstās, tagad arī mobilie pārlūki atbalsta vairākus CSS3 elementus un gan jau arī font-face kļūs par ierastu dizaina elementu, tādēļ iesaku visiem izstrādātājiem jau tagad izmēģināt CSS3 web fontus.

    Pieraksties Jaunumiem!

    Pieraksties Jaunumiem!