5 najboljših nasvetov za boljše delovanje z uporabo Googlovih pisav na WordPressu

Rifat WordPress Tutorials Feb 5, 2022

Tipografija spletnega mesta lahko pozitivno vpliva na povečanje konverzij. Izbira in optimizacija ustreznih pisav je ključnega pomena. Google Fonts je priljubljena storitev, saj so dobro oblikovane in lahko standardnim spletnim mestom prinesejo eleganten videz. Kljub temu, tako kot vse drugo na internetu, lahko tudi ti poslabšajo delovanje vašega spletnega mesta, če se ne uporabljajo pravilno. Ta članek bo obravnaval 5 nasvetov za izboljšanje učinkovitosti pri uporabi Googlovih pisav z WordPressom.

Učinkovitost Googlovih pisav z WordPressom

Google Fonts je knjižnica z več kot 1300 brezplačnimi družinami pisav, ki jih je Google omogočil za uporabo na spletnih mestih in v tiskanih izdelkih. Kljub temu, da se uporabljajo na milijonih spletnih mest WordPress, so odličen pristop za izboljšanje videza spletnega mesta. Med njimi boste nedvomno našli edinstven dizajn. Googlove pisave se običajno dodajo na spletno mesto WordPress z uporabo Googlovega CDN. To pomeni, da se ti, kot tudi tipska in slogovna lista, gostijo na strežnikih, ki so najbližji uporabniku.

Googlove pisave, prenesene iz interneta, niso tako hitre kot sistemske pisave (tiste, ki so nameščene v vašem računalniku). Spletni promet s spletnih mest, ki niso vaša, je vključen v hitrost nalaganja. Čas nalaganja Google Pisav ima manjši vpliv na učinkovitost strani kot večja sredstva. Navsezadnje so pisave bistveno manjše od slik. Vendar pa vsaka poizvedba vašega spletnega mesta porabi čas, ko si ga uporabnik ne more ogledati. Posledično je smiselno prilagajanje vaših Google Pisav, da bi povečali zmogljivost nalaganja vašega spletnega mesta.

Na srečo obstajajo različni pristopi, s katerimi lahko izboljšate svojo učinkovitost pri uporabi Googlovih pisav z WordPressom.

Ustvarite neverjetna spletna mesta

Z najboljšim brezplačnim graditeljem strani Elementor

Začni zdaj

Uporabite manj pisav.

Zaželeno je uporabiti čim manj pisave, kolikor je mogoče. Za najboljše rezultate uporabite dva sklopa pisav, ki sta povezana.

Ko govorimo o pisavah, pravzaprav mislimo na družine pisav. Ko pomislimo na pisave, običajno pomislimo na primarno pisavo, vendar pisave vključujejo različne različice, kot so več uteži, poševni tisk, številke in simboli. Ti se imenujejo glifi.

Številne pisave so na voljo v različnih težah, vključno s tankimi, svetlimi, srednjimi, polkrepkimi, krepkimi, ultra krepkimi in drugimi. Vsaka od njih predstavlja drugačno pisavo iz družine pisav. Poleg tega vsaka teža vsebuje ležeče pisavo, ki podvoji število pisav. Ko uporabite to družino pisav, naloži vse njene različice. Ko prideš čisto do tega, je to veliko.

Roboto je na primer danes priljubljena pisava za spletna mesta. V družini je 12 nizov pisav, od katerih vsak obsega 282 glifov. To je 3384 glifov za eno družino pisav, pomnoženih s številom različic pisave, ki jih želite uporabiti. Dodajte Roboto Condensed in Roboto Slab in enostavno je videti, kako bi lahko število pisave, uporabljenih na spletnem mestu, naraslo v nebo. Morda uporabljate na tisoče in tisoče pisav, če uporabljate različne družine pisav.

Namestite Google Font na vaš strežnik WordPress.

Google Pisave je mogoče prenesti in gostiti na vašem strežniku WordPress. Posledično bo tipografija na spletnem mestu obiskovalcu dostavljena z istega mesta kot spletno mesto. Spletnemu mestu ne bo več treba zahtevati datotek pisav z druge lokacije, stran pa se bo za uporabnika hitreje nalagala.

Ko izberete pisavo na strani Google Fonts, se prikaže možnost prenosa. Prenesite družino pisav in jo nato po FTP pošljite v mapo z vsebino/naložitvami. Če jih želite uporabiti, v glavo ne vključite sklicevanja na gostitelja pisav drugega proizvajalca

Upoštevajte to, samo naložite pisave in uteži, ki jih potrebujete. Ne uporabljajte vseh razpoložljivih teže in ležeče pisave. Za vsako pisavo uporabite formate TTF, EOT, WOFF in WOFF2.

Vnaprej naložite Google Pisave

Googlove pisave se pogosto pridobijo iz Googlovega omrežja za dostavo vsebine (CDN). Čeprav je to hiter strežnik, se pisave običajno naložijo pozno v procesu nalaganja spletnega mesta.

Če pride do težave s povezavo in se pisave ne prenesejo, bo stran upodobljena s splošnimi sistemskimi pisavami. Stran se bo nato ponovno upodobila po prenosu pisav. Laično rečeno, se stran naloži z eno pisavo in nato preklopi na drugo. To se imenuje blisk nestiliziranega besedila (FOUT). Čakanje je bolje kot to. Vendar še vedno ni idealno.

Ena od rešitev je prednalaganje pisave. Prednalaganje Google Pisav prav tako skrajša čas nalaganja za približno 100 ms. Razlog za to je, da se DNS, TCP in TLS nalagajo hkrati z datoteko CSS Google Fonts.

Prednalaganje zahteva predhodno povezavo in vključitev povezave za prednalaganje v slogovno tabelo. V glavo spletnega mesta bi dodali družino pisav in slogovno tabelo

Tukaj je primer HTML z uporabo predpovezave CDN Planet:

>headlink rel='preconnect' href='https://fonts.gstatic.com' crossoriginlink rel='preload' as='style' href='https://fonts.googleapis.com/css2?family=Open+Sans|Roboto:wght@300Anddisplay=swap'link rel='stylesheet' href='https://fonts.googleapis.com/css2?family=Open+Sans|Roboto:wght@700Anddisplay=swap'/head

Zamenjajte Roboto, kot tudi vse nastavitve pisave, v prejšnjem primeru s pisavami in parametri, ki jih želite uporabiti.

Uporabite vtičnik za optimizacijo Google Pisav

Vtičniki, tako kot večina stvari v WordPressu, olajšajo optimizacijo Googlovih pisav. Poskrbijo za programsko plat stvari, tako da vam ni treba razmišljati, kako vstaviti kodo.

Na voljo so številni vtičniki, ki vam bodo pomagali optimizirati vaše Google pisave. Ena, ki me vzbudi zanimanje, je OMGF | Lokalno gostite Googlove pisave. Zasnovan je posebej za optimizacijo Googlovih pisav, ki jih že uporabljate. Ta vtičnik, tako kot mnogi drugi vtičniki Google Fonts, vključuje tako brezplačno kot premium izdajo. Brezplačna različica ima samo ročne nastavitve, kar je lahko težko uporabljati. Vendar jih ni težko postaviti.

Ključna razlika pri tej je v tem, da brezplačna različica vključuje različne optimizacije, ki jih lahko uporabi kdorkoli, in ne le olajša uporabo samih pisav. Večina tovrstnih vtičnikov ponuja optimizacijo samo v premium različici. Za najboljše rezultate pa predlagam premium različico. Brezplačna različica vsebuje dovolj optimizacij, da lahko začnete.

Vtičnik predpomni pisave in Google Fonts lahko gostite lokalno. Pisave v vrsti so izbrisane iz glave in se privzeto zamenjajo z lokalnimi pisavami. Pisave lahko vnaprej naložite nad pregibom in preprečite nalaganje določenih pisav in slogovnih listov.

Pisave je mogoče zamenjati ali odstraniti v nastavitvah zaznavanja. To je še posebej priročno po prenovi, da se izognete nalaganju starih virov, ki nikoli ne bodo na voljo vašim uporabnikom.

Poleg tega, če imate hišo brezhibno, vam napredne nastavitve omogočajo, da določite lokacijo predpomnilnika pisav.

Moduli Divi Integracija Googlovih pisav

600 Googlovih pisav je vključenih v vse module Divi, ki zahtevajo besedilo, in so na voljo tako v temi Divi kot v vtičniku Divi, kjer so optimizirani za najboljšo zmogljivost in dizajn. Izberite družino pisav, težo in slog, nato pa ločeno prilagodite velikost, barvo, višino vrstice, razmik med vrsticami in sence za telo in vse velikosti naslovov. Lahko jih tudi prilagodite za določene naprave.

Googlove pisave so predpomnjene in v modul se naložijo samo tiste pisave, ki so resnično uporabljene. To preprečuje, da bi brskalnik naložil nepotrebne različice pisave.

Pri uporabniku General Divi in se niste zavedali, da je to nekaj, kar tema obravnava, ste že poskrbljeni.

Izboljšajte Googlove pisave Nalaganje predpomnilnikov in nalaganje Googlovih pisav v vrstici, da podaljšate čas nalaganja strani in preprečite zahteve za blokiranje upodabljanja. Obstaja tudi nastavitev, imenovana Omeji podporo za Googlove pisave za starejše brskalnike. Ta možnost zmanjša velikost Googlovih pisav, da optimizira čas nalaganja. Pomanjkljivost je, da je podpora za Google Fonts omejena v nekaterih starejših brskalnikih.

Zadnje besede

Vaše spletno mesto najverjetneje v neki obliki že uporablja Googlove pisave. Verjamem pa, da boste opazili razliko, če boste upoštevali teh 5 predlogov za povečanje učinkovitosti pri uporabi Google Pisav z WordPressom. Kljub majhni velikosti lahko neoptimizirane Googlove pisave vplivajo na čas nalaganja in splošno uporabniško izkušnjo vašega spletnega mesta. Obstajajo različne ročne rešitve za optimizacijo vaših Google Pisav, vendar bi morala večina uporabnikov namestiti vtičnik za optimizacijo pisav, kot je OMGF. Seveda je Divi vedno dobra izbira za optimizacijo in upravljanje pisav.

Divi WordPress Theme