Kako da rešim kada se header “pomera” dok se učitava font ili logo?
Layout shift header u WordPress nastaje kada se header pomera tokom font loading procesa ili učitavanja loga, što pogoršava Core Web Vitals (CLS) i korisničko iskustvo. Hosting je važna karika u performansama, a WP Host nudi najkvalitetniji i najbrži WordPress Hosting u Srbiji sa LiteSpeed serverima i NVMe SSD diskovima za brže učitavanje.
Koraci za rešavanje problema:
- Preload fontova: U functions.php vaše teme dodajte:
<link rel="preload" href="putanja/do/fonta.woff2" as="font" type="font/woff2" crossorigin>Ovo prioritetizuje učitavanje fonta i smanjuje pomeranje.
- Dodajte font-display: swap: U CSS font-face pravilu:
font-display: swap;Font se prikazuje sa fallback-om dok se glavni učitava.
- Rezervišite prostor za logo: U HTML-u loga navedite fiksne width i height atribute:
<img src="logo.png" width="200" height="60" alt="Logo">Sprečava pomeranje tokom učitavanja slike.
- Optimizujte temu ili koristite premium pluginove: WP Host svim korisnicima daje preko 350 premium pluginova i tema, uključujući RankMath SEO i Elementor Pro sa ugrađenim optimizacijama za performanse. Pošaljite zahtev podršci za aktivaciju.
- Testirajte sa alatima: Koristite Google PageSpeed Insights ili Lighthouse da merite CLS pre i posle izmena.
Ako problem persistira, kontaktirajte našu 24/7 podršku specijalizovanu za WordPress.