Od 0-100 u 6 koraka: Google PageSpeed test i WordPress. Šta sve morate znati da bi postali zeleni

965
0
Podeli:

Napomena: članak je napisan u vreme kada je Google PageSpeed izgledao drugačije i brzina učitavanja sajta je bila samo preporuka. U suštini se ništa nije promenilo, osim činjenice da je brzina učitavanja sajta i mobile-friendly sastavni deo parametara za rangiranje web sajta.

Taman ste napravili divan WordPress sajt po meri klijenta. Još da bacite pogled na  Google PageSpeed test. Osmeh vam je na licu dok ubacujete link do svog sajta, kad ono… “Kao grom iz vedra neba”, stiže informacija da ste duboko u crvenoj zoni.

Auu. Šta je ovo? Nula poena od mogućih 100. Da li je moguće? Kako? Zašto? Uzalud sve.

Ovo zasigurno ne želite da vam se dogodi. Ne brinite, otkrivamo vam prečice koje će Google PageSpeed test primorati da pozeleni od muke.

Ali pre toga znajte da…

Google PageSpeed test će postati zvaničan faktor za rangiranje web sajta

Google želi samo jedno: da najbolji web sajt ima najbolju poziciju, a samim tim i prodaju. Više od 300 faktora (do sada javno poznatih i još par stotina u tajnosti) utiču na procenu Googla o kvalitetu sajta. Što je više faktora uključeno u vaš WordPress sajt imate više šansi da budete na prvoj strani pretrage.

Faktor rangiranja sajta o kome Google, za sada, još razmišlja je brzina učitavanja sajta na mobilnim uređajima. Mobilni telefon je postao uređaj koji se sve više koristi za pretragu, a samim tim postaje i ključni faktor. Prema Google-u, prosečno vreme za učitavanje mobilne verzije web stranice putem 3G mreže je 22 sekunde. Istovremeno, preporučeno vreme iznosi svega 3 sekunde.

Ljudi su nestrpljivi. Oni žele nešto, i to žele odmah, a čike iz Googla to znaju i žele da im pruže. Zato, za pretraživače, bolji rezultati i performanse znače zdrav WordPress sajt koji zadovoljava kupce. Posledica je nagrađivanje višim rangiranjem.

Da, brzina stranice još nije faktor rangiranja, makar ne zvanično, a kada će to biti, još se ne zna. Psssst, ovo znaš samo ti – Google PageSpeed test će to postati u vrlo kratkom roku.

WordPresovska je tuga pregolema

Ok. Pravimo sajt u WordPress-u. Da pogledamo kako se ova platforma nosi sa brzinom učitavanja. Napravili smo test: instalirali smo WordPress na naš test server sa njegovom default temom i dobili ovaj rezultat.

Vau. Ovo je jako dobar rezultat imajući u vidu da je 100/100 skoro nemoguće dobiti.

Obratite pažnju na 5 stavki ispod naslova “Possible Optimizations”. Preporuke Google-a za optimizaciju i ubrzanje učitavanja sadržane su u svakoj stavci kada kliknete na link.

U sledećem koraku smo instalirali našu temu “Lako do znanja”, neophodne pluginove i dodali 5 postova sa slikama.

Pap! Sledi drastičan pad performansi. Ušli smo u crveno, a dodata je još jedna stavka “Optimize images”. Očigledno nismo vodili računa o optimizaciji slika pre upload-a na server. Kao i većina, zar ne? Ali, nije samo to u pitanju.

Google PageSpeed test ne daje informacije o brzini učitavanja već samo preporuke šta bi sve trebalo da uradite kako bi učitavanje bilo brže. Preporučujemo vam dva sajta koji to rade objektivnije i sa mnogo više parametara: Pingdom i GTmetrix.

Šta sve usporava učitavanje WordPress sajta?

6 glavnih faktora koji značajno utiču na brzinu učitavanja, posebno na mobilnim uređajima:

  1. Web hosting – naročito kategorija “shared web hosting” obično se reklamira kao najbolja solucija, neograničenih mogućnosti i pristupačnih cena. Iza ovoga se krije sledeće: na jednom serveru se nalazi veliki broj sajtova koji dele iste resurse. Poređenja radi, kao kada bi ste istovremeno uključili sve aplikacije na vašem računaru, a bavite se grafičkim dizajnom i video produkcijom. Sve se usporilo koliko god jak računar imali.
  2. WordPress konfiguracija – omogućavanje keširanje strana čime se rasterećuje rad samog servera.
  3. Veličina strane – slike koje nisu optimizovane za web (brzi download) značajno usporavaju brzinu učitavanja
  4. WordPress tema – ako je tema loše napisana drastično se smanjuje vreme učitavanja. Zato pročitajte tekst Kako izabrati temu za WordPress
  5. Plugin-ovi – kao i WordPress tema, loše napisani pluginovi mogu, ne samo usporiti, već i oboriti WordPress sajt
  6. Spoljne skripte (external scripts) – reklamni baneri, razni “loaders” i drugi spoljni elementi koji se učitavaju zajedno sa stranicom imaju veliki uticaj na brzinu učitavanja.

Šta smo mi uradili da ubrzamo test sajt Lako do znanja?

Uradili smo sajt na test serveru do kraja. Obratili smo pažnju na svaku sitnicu: optimizacija slika, dodatni CSS, sve smo maksimalno minifikovali.

  1. Web hosting – sajt na kome se nalazi test je “shared web hosting”. Live sajt je takođe postavljen na šerovanom hostingu. Uostalom kao i većina WordPress sajtova u Srbiji. Tu nema faktora na koji možemo uticati sem da promenimo hosting na “managed WordPress hosting” koji je isključivo namenjen i konfigurisan za WordPress sajtove. Međutim visoka cena je najveća mana. Pogledajte strane ponude i biće vam jasno: WP Engine, SiteGround, DreamHost, Pagely. Nemamo informaciju ko pruža ovu vrstu usluge u Srbiji, ali ako je vi imate, podelite je sa nama u komentaru.
  2. WordPress konfiguracija – kada smo uneli sadržaj sajta, instalirali smo Comet Cache U našem slučaju se pokazao kao najefikasniji. Drugim rečima ovde ne postoji univerzalan savet ni jedinstven recept. Isprobali smo WP Super Cache i W3 Total Cache kao i gomilu plaginova za kompresiju HTML-a, CSS-a, Javascripta… Neki od njih su nam i srušili sajt. Dakle oprezno uz napomenu: nikada nemojte probati neki plugin na sajtu koji je živ (live). NIKADA.
  3. Veličina strane – slike smo pre upload-a na server optimizovali u Photoshopu. Znamo da mnogi od vas nisu vični radu sa ovim programom pa možete koristiti i besplatne programe (free trial) kao što je: JPEG Mini – za optimizaciju JPG slika, TinyPNG – za optimizaciju PNG slika. Ukoliko ste malo ambiciozniji, na raspolaganju je i sjajan online program Pixlr Editor ili instalirajte GIMP. Napisan je za Windows, Linux i MacOS operativne sistem. Smatramo da ova tema zaslužuje posebnu pažnju, pa ćemo napisati članak samo o tome.
  4. WordPress tema – O tome kako izabrati premium temu za WordPress je članak koji morate pročitati.
  5. Plugin-ovi – dodaci ili pluginovi koji omogućavaju proširenje funkcionalnosti WordPressa, nikada ne treba instalirati bez prethodne provere na kopiji sajta. Bilo bi dobro da imate instaliran WordPress na vašem računaru (localhost) ili da instalirate test sajt na serveru koji će biti kopija sajta na kome radite. Tu možete do mile volje da ekperimentišete i utvrdite listu pluginova koji su od poverenja. Plugin Autoptimize je na našem test sajtu napravio bukvalno haos. To ne znači da je u pitanju loš plugin, već se sukob stvorio zbog međusobne nekompatibilnosti kodova WordPress teme i samog plugina.
  6. Spoljne skripte (external scripts) – tu ste prilično nemoćni kada je WordPress u pitanju. Najčešće su u pitanju JS biblioteke koje su neophodne za rad same teme kao napr. jQuery, custom JS, Google Analytics, Google Fonts itd. za koje se preporučuje da se učitavaju sa CDN.
    Većina tema ima mogućnost prikazivanja slidera. Međutim, slideri maksimalno usporavaju učitavanje strane.
    Izbacite slidere, uvedite Hero layout. Slajderi na web sajtu značajno usporavaju učitavanje strane, jer je za njihov rad potrebna gomila Javascripta. Prepravljanje koda same teme da bi se izabacio slider ne dolazi u obzir, jednostavnije i sigurnije je da izaberete drugu temu koja će dobro izgledati bez njega.

I na kraju pitanje: jesmo li uradili nešto?

Nakon samo par sati rada poboljšali smo situaciju i ušli u naradžasto. Sa 58/100, sajt je skočio na 71/100. Malo li je?

Kao što vidite samo je jedna preporuka ostala, a ona je vezana za stavku 6 zbog Javascripta koji učitava Google fonts i Google Analytics. Još da smo uključili slider, ne bi bilo ni govora o ovom rezultatu.

Kako izgleda test velikih kompanija: Apple, Adobe, Facebook i Microsoft?

  1. Apple 57/100

  1. Adobe 49/100

  1. Facebook 65/100

  1. Microsoft 67/100

Da li vam je sada malo lakše?

Da zaključimo:

Od pravilnog izbora hostinga, WordPress teme, pluginova, optimizacije slika, i rasporeda sadržaja svake strane zavisi i brzina učitavanja sajta, odnosno rezultat koji je dao Google PageSpeed test. Pažljivo planirajte vaš WordPress sajt i testirajte svaku opciju na kopiji sajta.

Imajte na umu da vaš posao na optimizaciji nikad nije završen. Vaš sajt za mobilne uređaje nikada nije dovoljno brz i vaši klijenti nikada neće doći do vas zbog sporog učitavanja. Nastavite da radite na tome. Sada, sutra i narednog meseca. Pratite vesti da biste videli da li postoje novi načini za ubrzanje vašeg sajta, upišite WordPress kurs u školi Lako do znanja i čitajte naš blog.

Sutra će biti D dan i brzina učitavanja sajta će postati rangirajući faktor, a vi ćete biti potpuno spremni. Vi ćete imati znanje i bićete u prednosti u odnosu na ostale koji ni ne znaju šta im se sprema.

Ljubi vas i voli vaša tetka Špaga.

Podeli:
Zoran Andrić

Ostavi komentar