STREŽNIK, kjer stran gostuje. TEMPLATE spletne strani. VSEBINA posamezne strani.

Optimizacija spletnih strani je pomembna že nekaj let, s prihodom Core Web Vitals pa je postala bistveno bolj organizirana. V nekaj sekundah lahko dobite informacije: kateri deli strani delajo dobro, kateri slabo, seznam možnih izboljšav (celo v obliki prioritet, ker različno vplivajo na končno oceno).

Pomembno pa je vedeti, KJE se izvede posamezne izboljšave.

 

Če naredite CWV analizo neke strani in pogledate priporočila, boste dobili:

  1. Ocene po skupinah (mi najpogosteje spremljamo in izboljšujemo Performance, Best practices, SEO)
  2. Ocene glavnih kazalcev (LCP, FID, CLS...)
  3. Priporočila za izboljšanje

Slika: prikaz rezultatov Core Web Vitals testa. Analiza strani restavracija-mirje.si pred zadnjo optimizacijo (Nov-2021)

Slika: prikaz testa Core Web Vitals za https://restavracija-mirje.si/

 

Priporočila iz tega seznama rezultatov test se lahko naslovi na 3-eh (ločenih in precej neodvisnih) nivojih spletne strani:

  1. Strežnik oz. gostovanje
  2. Template spletne strani
  3. Vsebina posamezne strani

STREŽNIK

Običajna spletna stran se prične na strežniku, ki pripravi odgovor (vsebino) za obiskovalca. Ustreznost delovanja najpogosteje ocenjujemo skozi percepcijo "hitrosti". Bolj natančno gre za čas, v katerem strežnik izvede kodo in pripravi HTML vsebino za prikaz v brskalniku uporabnika. Zmogljivejši kot je strežnik, manj kot je zaseden, bližje kot je obiskovalcu => Krajši je ta čas.
Ima pa strežnik poleg hitrosti odziva še vrsto drugih nastavitev, ki vplivajo na CWV oz. optimiziranost strani. Do teh nastavitev ima običajno dostop le administrator strežnika.

Možnosti za izboljšanje:

 

TEMPLATE

Template strani predstavlja OKVIR, znotraj katerega se prikazuje strani s posamezno vsebino. Ta okvir v splošnem sestavljajo programska koda, CSS in JS datoteke, ki skupaj zagotavljajo funkcionalnosti strani in ustvarjajo splošni prikaz (vizuelno podobo).

Za inštalacijo template-a običajno poskrbi programer ali implementator. Uredniki in lastnik strani običajno imajo možnost dostopa do datotek, ki sestavljajo template (npr. preko FTP), ampak vse bolj pogosto te kode ne urejajo sami in so odvisni od programerjev, ki skrbijo za razvoj in vzdrževanje template-a ter drugih sestavnih delov (npr. plugins).

Možnosti za izboljšanje:

  • Ustrezna struktura HTML (H1-H6, p, title, description...)
  • Sitemap
  • Robots.txt
  • Velikost in oblika skupnih elementov (slike, footer-ji, banner-ji...)
  • Čim bolj optimalna back-end koda (Javascript, PHP, python...) glede na želene funkcionalnosti
  • Front-end koda (Javascript)
  • CSS style za želeni videz strani
  • Ustrezna struktura in umestitev posameznih delov v HTML spletne strani za najbolj optimalen prikaz v brskalniku
  • Nalaganje custom font-ov
  • Uporaba varnih (https) virov
  • Template-based cache mehanizmi
  • ...

 

VSEBINA 

Urednik vsebine (npr. blog objava ali opis artikla) ima vpliv na velikost objavljenih slik, obseg besedila, oblikovanje posameznih delov besedila...

Možnosti za izboljšanje:

  • Optimalna HTML koda vsebine
  • Optimalno velike slike glede na napravo uporabnika
  • Mobile-responsive design
  • Optimalno nalaganje slik glede na položaj na strani in zaslonu
  • ...



Dobro je vedeti

Končno oceno optimiziranosti strani (in s tem uporabniško izkušnjo) je mogoče izrazito pokvariti na vsakem od navedenih nivojev.

Če strežnik potrebuje 3 sek ali več za pripravo odgovora, je nivo optimizacije vaše vsebine skoraj brezpredmeten. Uporabniki (in Google) imajo pač radi hitre strani.

Če uporabljate shared gostovanje: Kompromis, ki ga je potrebno sprejeti pri uporabi tega je, da določenih stvari nimate na voljo oz. nimate dostopa za njihovo urejanje. V takšnih primerih ste že na tem mestu nekoliko omejeni pri tem, katere dele optimizacije sploh lahko naslovite.

Dober template (optimiziran, "lean", hiter, vzdrževan, nadgrajevan) je predpogoj za optimizirano stran. Pogosto so za poslabšanje krive naknadne inštalacije pluginov in widgetov (npr. Wordpress), včasih pa je precej kriva že core-template koda (npr. Magento) Troubleshooting teh primerov je izredno zahteven in za manjša podjetja je pogosto najbolje zamenjati Template.

Kako pokvarite stran z neustrezno vsebino? V glavo objave vnesite 4K veliko sliko (po možnosti celo .bmp formata, shranjeni v Windows Paint-u) in sploh ni pomembno, kakšen template imate oz. na kakšnem strežniku gostuje stran. Poizkusite naš demo, po možnosti s telefonom. :-) Ena takšna slika v glavi objave je znižala Performance oceno za 20 točk in potisnila priporočila glede uporabljenih slik do konca Screenshot.

CWV rezultat testa z zelo neustrezno sliko za vsebino

Google včasih za #geekhumor skrije kakšne zadeve v ozadje. Za takšne primere slabih slik bodo orodja za testiranje optimiziranosti strani kmalu verjetno vgradila emoji



Za dobro, sploh pa odlično optimizacijo spletne strani, je pomembno sodelovanje vseh 3 sodelujočih: urednika vsebine, programerjev template-a in server administratorja. Običajno je nekaj kompromisov glede končnega videza. Praktično vedno pa je za opazno boljši rezultat potrebno več znanja in dela.



Napisal:
Vladimir Mijatović