Kako uporabiti tipografijo Elementor za optimizacijo delovanja spletne strani

Rifat Elementor Dec 18, 2023

Tipografija igra ključno vlogo pri delovanju spletne strani. Pisave in elementi besedila na strani zahtevajo dodatne prenose in vire, ki lahko upočasnijo čas nalaganja. Za spletna mesta WordPress, ki uporabljajo priljubljen graditelj strani Elementor , je optimizacija tipografije enostavna tako z brezplačno kot s pro različico.

V tej objavi bomo opisali, kako lahko funkcije Elementorja izboljšajo delovanje spletnega mesta z optimizacijo načina nalaganja in prikaza pisav. Ogledali si bomo brezplačne funkcije, kot so Resource Hints, Inline Font in Font display swap, ki izboljšujejo zmogljivost. Nato bomo raziskali dodatne profesionalne funkcije, kot so pisave po meri in podprti formati pisav, ki dodatno povečajo hitrost.

S pravilno uporabo tipografskih zmožnosti Elementorja lahko izdelate hitro in učinkovito spletno stran, ki hitro služi obiskovalcem, ne da bi pri tem žrtvovali dobro oblikovane besedilne elemente. Delili bomo uporabne nasvete za implementacijo teh funkcij za boljše delovanje. Potopimo se!

Brezplačne funkcije Elementorja, ki izboljšujejo zmogljivost

Elementor ima fantastične vgrajene funkcije za optimizacijo delovanja tudi v brezplačni različici. Te zmogljivosti vam omogočajo, da obiskovalcem ponudite hitrejše in učinkovitejše spletno mesto, ne da bi morali nadgraditi na plačljivi pro načrt. Pokrili bomo ključne funkcije, ki so na voljo brezplačno in neposredno izboljšajo tipografijo in zmogljivost.

Namigi o virih

Funkcija Resource Hints vam omogoča, da določite prioriteto za prenos kritičnih virov pisav. To pomeni, da lahko brskalnikom nakažete, katere pisave je najpomembnejše, da se najprej prikažejo. S strateško izbiro prioritete se izognete privzetemu vedenju brskalnika, ki lahko zakasni dostavo pomembne pisave in povzroči FOUT .

Natančneje, namig za vnaprejšnje nalaganje vira prisili, da se pisave naložijo zgodaj pri nalaganju strani. Nato namig za vir vnaprejšnje povezave vzpostavi zgodnje povezave s ponudniki pisav, kot je Google Fonts, za hitrejšo dostavo. Če jih skrbno konfigurirate za izbrano tipografijo, povečate zmogljivost z zmanjšanjem premikov CLS .

Ustvarite neverjetna spletna mesta

Z najboljšim brezplačnim graditeljem strani Elementor

Začni zdaj

Pisava v vrstici

Omogočanje pisave v vrstici omogoča, da se podatki pisave CSS elementov besedila dodajo neposredno v HEAD namesto zunanje tabele slogov. To zmanjša odvisnost od nalaganja zunanjih virov, da se besedilo na strani prikaže hitro in ostro.

Zmanjšanje števila datotek, ki potrebujejo ločen prenos za oblikovanje besedila, je zelo koristno za hitrost spletnega mesta. Prav tako minimizira FOIT z jasnim nalaganjem besedila, namesto da bi začelo biti nevidno, nato pa se pojavilo. Metoda vdelanega besedila je odličen način, da ohranite zvezdniški videz tipografije in hkrati optimizirate učinkovitost.

Zamenjava prikaza pisave

Mehanizem Font Display Swap, vgrajen v Elementor, vam omogoča pameten nadzor nalaganja pisav. Omogoča vam, da najprej prikažete skupno sistemsko pisavo kot nadomestek, nato pa zamenjate z želeno pisavo po meri, ko jo naložite, da se izognete FOIT. Če želite dodati pisave po meri v Elementor Pro, dodajte naslednjo kodo mapo vtičnika Elementor Pro.

function update_font_display() {

	return 'swap'; // Or any other value.

}
add_filter( 'elementor_pro/custom_fonts/font_display', 'update_font_display' );

Ta funkcija vam omogoča, da označite nadomestno pisavo , kot je Arial ali Times New Roman, da prikažete besedilo takoj ob nalaganju strani. Potem, ko se vaša izbrana modna pisava konča s prenosom, se neopazno zamenja, tako da obiskovalci še vedno brez odlašanja vidijo vašo želeno tipografijo. To prepreči vedenje »nevidno besedilo, nato bliskovito«, ki škodi berljivosti.

Funkcije Elementor Pro za zmogljivost

Medtem ko ima brezplačna različica Elementorja odlične zmožnosti optimizacije, nadgradnja na plačljivi načrt Elementor Pro odklene dodatne uporabne funkcije tipografije za še hitrejše nalaganje strani. Profesionalne funkcije zagotavljajo več prilagajanja in učinkovito nalaganje pisav po meri, prilagojenih vaši blagovni znamki.

Ključna področja, kjer Elementor Pro še izboljša zmogljivost, so pisave po meri in podprti formati pisav. Oglejmo jih podrobneje.

Pisave po meri

Zmogljivost pisav po meri v Elementor Pro vam omogoča pravilno nalaganje in gostovanje edinstvenih pisav blagovne znamke za optimalno dostavo. Brez omogočenih pisav po meri bi morali pisave gostiti ločeno in se nato povezati z njimi – dodali bi dodatne povezave in vire.

Z neposredno integracijo vaših podpisnih pisav v komplet Elementor Pro poenostavite nalaganje pisav. To odstrani zunanje zahteve, zmanjša velikost nalaganja in omogoča določanje naprednih navodil za dostavo, kot je predhodno nalaganje. Obiskovalci bodo vaše strani zaznali kot hitrejše in bolj uglajene.

Poleg tega pisave, ki jih sami gostite, preprečujejo težave, kot so izpadi pri ponudnikih pisav tretjih oseb. Tudi če uporabljate zanesljive vire, kot je Google Fonts, je lokalno vstavljanje pisav učinkovitejše. Elementor Pro je kos težkemu delu, tako da tipografija po meri nikoli ne upočasni stvari.

Podprti formati pisav

Poleg poenostavljene uporabe pisav po meri Elementor Pro podpira več optimiziranih formatov pisav. To vključuje datoteke WOFF, WOFF2, TTF, SVG in EOT, prilagojene posameznim brskalnikom.

Formata WOFF in WOFF2 ponujata napredne zmožnosti stiskanja v primerjavi s starejšimi formati, kot je TTF. To ohranja majhne velikosti datotek za hitrejše nalaganje. Pisave SVG so idealne za sisteme ikon, ki omogočajo natančno nastavljen nadzor in jasen prikaz pri kateri koli velikosti.

Ker Elementor Pro upravlja pretvorbo in streženje vaših pisav v teh optimalnih formatih, zagotavlja vitko, učinkovito dostavo in upodabljanje. Besedilni elementi, ki uporabljajo vaše želene pisave, bodo vsebovali vse informacije, ki jih potrebujete, za čudovito zapolnitev s svetlobno hitrostjo.

Zavijanje

Optimizacija tipografije je ključni način za izboljšanje delovanja spletnega mesta. S pametno uporabo elementorjevih vgrajenih hitrostnih funkcij lahko hitro prikažete besedilo, ne da bi preobremenili vire ali se zanašali na zunanje storitve.

Brezplačne funkcije, kot so Resource Hints, Inline Font in Font Display Swap, omogočajo natančno nastavljeno dostavo virov pisav. In Elementor Pro odklene napredne zmogljivosti, kot so samostojne pisave in uporaba sodobnih formatov pisav.

Ta orodja za tipografijo skupaj naredijo spletna mesta prožna, učinkovita in hitra, ne da bi pri tem ogrozila vizualni dizajn. Če razumete in aktivirate različne možnosti delovanja, lahko ustvarite bliskovito hitro spletno mesto, kjer besedilni elementi zaslepijo in ne zamujajo. Uporabite moči Elementorja za ustvarjanje čudovitih, optimiziranih spletnih mest.

Divi WordPress Theme