Kako ubrzati WordPress sajt s korisničkog aspekta?

Pridružite nam se u WordPress Speed Up grupi gdje vam u ubrzavanju vaših WordPress stranica pomažu mnogi međunarodni i domaći WordPress stručnjaci i volonteri: https://www.facebook.com/groups/wordpressspeedup/

Glavne poruke:
- web stranice se rade za ljude, vaše potencijalne klijente
- morate pronaći dobru ravnotežu između sadržaja, dizajna,
korisničkog doživljaja i brzine web sajta
- nemojte biti opsjednuti brzinom web sajta (a posebno s rezultatima brzine stranice!)
- sve dok poboljšavate iskustvo posjetitelja, postići ćete vaše poslovne ciljeve
.... i naravno, brzina je važna, veoma!

Transcript

1. FreelancersTools.com FreelancersTools.com Kako ubrzati WordPress sajt s korisničkog aspekta? Pripremio
2. FreelancersTools.com FreelancersTools.com Uvod  Pokazat ćemo vam kako ubrzati WordPress stranice sa korisničkog aspekta, korištenjem nekih od jednostavnih, ali efikasnih tehnika i alata, tzv. „quick-win-ova“.  Ono što ubrzava (ili usporava) web sajt je slučajna hrpa ugađanja, savjeta i promjena. To je mnoštvo malih stvari koje uvelike utječu na potencijalne klijente i tražilice.  Vidjet ćete na primjeru kojim besplatnim web alatom i na koji način identificirati najveće probleme s brzinom na vašem sajtu te načine kako iste otkloniti  Kratko ćemo vas upoznati sa Premium alatom za ubrzanje sajtova, Swift Performance, s kojim možete obaviti veliku većinu poboljšanja vašeg sajta, u najkraćem mogućem roku. 2
3. FreelancersTools.com FreelancersTools.com Sadržaj 1. Zašto je brzina stranice važna? 2. Što utječe na brzinu stranice? 3. Koliko brzo je dovoljno brzo? 4. Kako mjeriti brzinu stranice? 5. Kako možete poboljšati brzinu stranice? 6. Swift Performance plugin 7. Zaključak (ukupno: 30 slajdova) 3
4. FreelancersTools.com FreelancersTools.com 4 1. Zašto je brzina stranice važna?  Brzina stranice mjeri brzinu učitavanja sadržaja na stranici.  Brža web stranica (tj. brže učitavanje stranica) pruža bolji doživljaj korisniku.  Brže je bolje jer će spora web stranica negativno utjecati na sljedeće: • Brzina stranice utječe na promet i prikaz stranica - Sporije vrijeme učitavanja web sajta znači manje posjetitelja na pojedinačnim stranicama vašeg web sajta - Sajtovi s prosječnim brzinom učitavanja od 2 sekunde prikazuju prosječno 8,9 stranica, dok oni s brzinom učitavanja od 7 sekundi prosječno iznosi samo 3,7 stranice. • Brzina stranice utječe na društvene medije - Znate li što zaista poboljšava dijeljenje sadržaja i lajkanje istog? Ako vaši posjetitelji zapravo vide sadržaj stranica. - Sporo učitavanje web sajta: sve što je sporije od 2-3 sekunde - čini posjetitelje nestrpljivima
5. FreelancersTools.com FreelancersTools.com 5  Brzina stranice utječe na prihod / prodaju - Što je bolji korisnički doživljaj, veća je prodaja. - Brzina stranice utječe na korisnički doživljaj i komunikaciju  Brzina stranice utječe na oglašavanje web sajta Vrijeme učitavanja landing stranice: - Ako se vaša landing stranica predugo učitava kada netko klikne na vaš oglas, najvjerojatnije je da će osoba odustati i napustiti web sajt - "Ovo nepoželjno ponašanje može signalizirati Googleu da je korisnički doživljaj landing stranice loš, što može negativno utjecati na poredak oglasa. Zato želite postići da vrijeme učitavanja landing stranice bude brzo” (iz Adwords Support)  Brzina stranice utječe na brend vaše tvrtke - brzina vašeg web sajta može utjecati na percepciju i odanost kupca vašem brendu 1. Zašto je brzina stranice važna?
6. FreelancersTools.com FreelancersTools.com 6 2. Što utječe na brzinu stranice? ? a) “klijent”/web preglednik  Klijent, obično web preglednik, kontaktira server  Kad server odgovori preglednik mora prikazati tražene informacije  Ako je web stranica loše kodirana ili strukturirana onda preglednik ima problema s prikazivanjem stranice i dolazi do usporavanja pregleda stranice b) Server  Server dobiva upit od klijenta/web preglednika i prikazuje traženo  Mora kreirati sve stranice koje vidite, obraditi obrasce, proizvode i usluge, upravljati potencijalnim klijentima i obaviti sve ostalo  Ako je server spor, onda je sve usporeno. Ubrzajte server i sve će biti brže. Za ubrzati server tj. namjestiti njegove postavke potrebno je stručno znanje. c) Protok informacija  Kroz cijev (tj. ‘bandwidth’) se isporučuje sve što server kreira.  Kada server odgovori na zahtjev preglednika, odgovor prolazi kroz cijev. Što više stvari prolazi kroz cijev, to je sporiji protok.
7. FreelancersTools.com FreelancersTools.com 7 3. Koliko brzo je dovoljno brzo?  prihvatljiva brzina web sajta za Desktop je između 2-3 sekunde, a poželjna brzina je oko 1 sekunda (gotovo polovica korisnika Interneta danas očekuje da se web sajt učita za 2 sekunde ili manje)  40% posjetitelja napuštaju web sajt ako im treba više od 3 sekunde da se učita  prihvatljiva brzina za mobitele je između 4-5 sekunde  75% mobitel korisnika napušta web sajt ako im treba više od 5 sekundi da se učita  1 sekunda kašnjenja u brzini učitavanja web sajta može rezultirati smanjenjem kupovine od 7%
8. FreelancersTools.com FreelancersTools.com 8 4. Kako mjeriti brzinu stranice? ? Prvo pravilo optimizacije brzine na webu: uvijek mjerite i provjerite više od početne stranice, također mjerite brzinu i drugih stranica na sajtu!  Optimizacija brzine stranice može biti priličan izazov, ali srećom, postoje alati na mreži koji olakšavaju naše živote i savjetuju nam što da radimo kako bismo poboljšali brzinu našeg web sajta.  Preporuke besplatnih alata za provjeru brzine stranice: a) Pingdom Website Speed Test (on-line alat) b) Gtmetrix (on-line alat) c) WebPageTest (on-line alat) d) Page load time (Google Chrome dodatak) Postoje i drugi kvalitetni alati, ali ovo su neki od najpopularnijih.
9. FreelancersTools.com FreelancersTools.com 9 a) Pingdom Website Test brzine (on-line alat)  Brzo testiranje brzine web sajta. Super jednostavno. Izvrsno za impresionirati (ili deprimirati) klijente.  Dobijete sažetak svih podataka  S Pingdom-om imate mogućnost testirati brzinu stranice na 3-4 različite lokacije. Rezultati su različiti za svaku lokaciju, što pokazuje da je geografsko mjesto gdje je server smješten važno. Pingdom waterfall analysis How to use Pingdom Speed Test tool b) Gtmetrix (on-line alat)  Daje vam detaljnije informacije o tome koje su stvari optimizirane i koje nisu  Sve što treba optimizirati je navedeno i ocijenjeno na skali od 0-100. Popis je poredan po važnosti, pa ako pratite zadatke od vrha do dna i optimizirate one koji nemaju 100% bodova, biti ćete na dobrom putu da ubrzate WordPress web sajt što je brže moguće.  Pamti povijest testova brzine sajta A Deep Dive Into the GTmetrix Speed Test Tool 4. Kako mjeriti brzinu stranice?
10. FreelancersTools.com FreelancersTools.com 10 c) WebPageTest (on-line alat)  Još jedan odličan alat za provjeru brzine web sajta s dosta dodatnih opcija u odnosu na predhodne alate, za naprednije korsnike  Postoji više lokacija za odabir za testiranje brzine web sajta, može se odabrati brzina Interneta, možete omogućiti / onemogućiti nekoliko opcija preglednika i testirati određene uređaje  Za svaki web sajt radi se 3 testa i detaljno prikazuju rezultati  Omogućuje prvo i ponovljeno praćenje učitavanja sajta tako da možete usporediti koliko se brzo sajt učitava Testing your site with WebPageTest d) Vrijeme učitavanja strane (Google Chrome ekstenzija)  Mjeri vrijeme učitavanja stranice i prikazuje je na alatnoj traci preglednika Chrome 4. Kako mjeriti brzinu stranice?
11. FreelancersTools.com FreelancersTools.com 11 Google PageSpeed Insights alat Preporuka za izbjegavanjem korištenja istog jer:  neprecizno mjeri brzinu vašeg web sajta kada je riječ o tome kako ga vaši posjetitelji vide diljem svijeta  ne daje nikakve rezultate brzine, umjesto toga daje popis stvari koje biste trebali poboljšati te skoring rezultate za koje ne znate odakle su došli  njegov rezultat se ne temelji na stvarnim brzinama web sajta, već na "stvarima za koje Google vjeruje da biste trebali optimizirati” Ne smijete biti opsjednuti sa savršenim skoring rezultatom i trebate usredotočiti pažnju na korisničko iskustvo vašeg web sajta. Ako vaši posjetitelji dobiju brzu stranicu koja je jednostavna za korištenje, onda je to odlično. P.S. Nisu sve Google preporuke/alati „Sveto pismo” 4. Kako mjeriti brzinu stranice?
12. FreelancersTools.com FreelancersTools.com 12 Pingdom test brzine sajta (1) 4. Kako mjeriti brzinu stranice?
13. FreelancersTools.com FreelancersTools.com 13 Pingdom test brzine sajta (2) 4. Kako mjeriti brzinu stranice?
14. FreelancersTools.com FreelancersTools.com 14 5. Kako možete poboljšati brzinu stranice? A) Osnove / Preduvjeti za brze web sajtove: 1. Kvalitetan i brz hosting 2. Optimizirana i „lagana” WordPress tema 3. Izbor pluginova B) WordPress postavke za ubrzavanje vašeg web sajta C) Optimizirajte slike D) Izvršite optimizaciju baze podataka E) Ažurirajte svoje pluginove, temu i WordPress F) Koristite pluginove za optimizaciju učitavanja G) Za naprednije: 1. Upotrijebite CDN (Content Delivery Network) 2. Ažurirajte PHP verziju web sajta na 7.x
15. FreelancersTools.com FreelancersTools.com 15 NAPRAVITE BACKUP VAŠEG SAJTA PRIJE POČETKA OPTIMIZACIJE!
16. FreelancersTools.com FreelancersTools.com 16 A) Osnove / Preduvjeti za brze web sajtove: 1. Kvalitetan i brz hosting Bez obzira što odaberete, postoje određeni čimbenici koje morate razmotriti prije nego što se odlučite za određeni hosting:  Cijena – odabir najjeftinijih opcija obično nije dobra ideja. Znate kako izreka kaže: "dobivate ono što plaćate". Ako želite da vaš web sajt raste i generira prihode, neophodna je kvalitetna investicija kako bi se jamčilo brzo učitavanje sajta kao i 100% radno vrijeme poslužitelja  Ograničenja / tehničke specifikacije - kada pokrenete web sajt kao e-trgovinu ili web sajt bogat sadržajem i videozapisima, morate se prijaviti za hosting sa RAM-om, velikim prostorom na disku i velikom snagom obrade podataka kako biste zadovoljili svoje potrebe 5. Kako možete poboljšati brzinu stranice?
17. FreelancersTools.com FreelancersTools.com 17  Podrška – hosting tvrtke koje nude podršku za 24/7 podršku su odličan izbor, jer ako vaš web sajt neočekivano padne, želite biti u mogućnosti razgovarati s nekim kako bi riješio problem, bez obzira koliko je trenutno sati  Recenzije – provjerite što ostali govore/pišu o pojedinom hostingu. Svjedočanstva vam mogu pomoći da otkrijete o kakvom je hostingu riječ. Pogledajte ReviewSignal i provjerite što drugi kažu o pojedinom hostingu koji vas zanima.  Naša preporuka je SiteGround shared hosting: njihovi poslužitelji s SSD diskovima su vrlo brzi, veoma sigurni, s naprednim integriranim uslugama (backup, napredno cachiranje, staging, CloudFlare CDN, itd.), posebno u GoGeekovom hosting paketu koji trenutno koristimo. 5. Kako možete poboljšati brzinu stranice?
18. FreelancersTools.com FreelancersTools.com 18 2. Optimizirana i lagana WordPress tema  Koliko god želimo misliti da su sve teme jednake, istina je da nisu. Mnoge teme dolaze s nepotrebnim kodom koji vašoj temi daje višak funkcionalnosti koje nikada nećete koristiti.  Mnoge WordPress teme su pretrpane funkcijama. Vaš je cilj da odaberete jednostavnu i laganu temu koja pruža dizajn koji je potreban za vaš web sajt.  Prije instalacije nove teme na vašem WordPress sajtu, provjerite demo teme koristeći jedan od gore navedenih alata za testiranje brzine. Rezultati će pružiti uvid u to koliko je kvalitetna određena tema.  Naša preporuka su sljedeće teme: X Theme i X Theme Pro. 5. Kako možete poboljšati brzinu stranice?
19. FreelancersTools.com FreelancersTools.com 19 3. Izbor pluginova Koristiti mnogo pluginova na sajtu je u redu, sve dok su isti kvalietno kodirani. Evo nekoliko korisnih savjeta za upravljanje pluginovima na WordPress sajtu:  Procijenite potencijalne pluginove prije nego ih instalirate na vašem web sajtu. Sa WP Speedster besplatnim alatom možete analizirati učinke stotina pluginova na brzinu sajta što će vam pomoći da odlučite koje pluginove trebate izbjeći  Testirajte vaš web sajt. Prije instaliranja novog plugina, testirajte sajt pomoću alata za testiranje brzine. Nakon instalacije ponovno ga testirajte. Ako vaš web sajt uspori, pronađite drugi, optimiziraniji, plugin. 5. Kako možete poboljšati brzinu stranice?
20. FreelancersTools.com FreelancersTools.com 20  Pažljivo birajte pluginove. Svaki put kada dodate plugin na web sajt, on šalje zahtjeve serveru kako bi ispravno funkcionirao. Pokušajte upotrijebiti jedan plugin koji izvodi više funkcija (kao što je Swift Performance plugin) umjesto upotrebe nekoliko pluginova. Nemojte koristiti pluginove koji su zastarjeli jer predstavljaju sigurnosne rizike i mogu uzrokovati probleme na vašoj web stranici te usporenje iste.  Koristite plugin Query Monitor: to je plugin za otkrivanje problema za osobe s naprednijim znanjima / iskustvom.  4 glavna pitanja pri odabiru pluginova za vaš web sajt: • Izvodi li složene operacije? • Učitava li mnogo skripti? • Povećava li broj upita u bazu podataka na svako učitavanje stranice? • Obavlja li zahtjeve prema vanjskim aplikacijama? Ako je većina odgovora na gore navedena pitanja DA, trebali biste izbjeći taj plugin i pronaći alternativu. 5. Kako možete poboljšati brzinu stranice?
21. FreelancersTools.com FreelancersTools.com 21 B) WordPress postavke za ubrzavanje vašeg web sajta  u Discussion onemogućite odabir opcije "Allow link notifications from other blogs (pingbacks and trackbacks)”  u Discussion označite opcije " Break comments into pages "  u Discussion odznačite opciju „Show Avatars”  u Discussion odaberite “For each article in a feed, show: Summary” instead of “Full Text” i smanjite “Blog pages show at most” na 8 ili 6  onemogućite XML-RPC (to je samo još jedna dodatna radnja koju vaš server mora odraditi. Vaš server je dovoljno opterećen.)  Tražite od servera da onemogući hotlinking (drugi web sajtovi se služe vašim slikama izravno s njihovih URL-ova na vašem web sajtu umjesto da ih prenesu na vlastite servere) 5. Kako možete poboljšati brzinu stranice?
22. FreelancersTools.com FreelancersTools.com 22 C) Optimizacija slika  Jednostavne stvari kao što je sažimanje slika mogu imati ogroman utjecaj na performanse web sajta jer smanju brzinu tako da server ne može dovoljno brzo prenijeti podatke, a korisnik ih ne može pregledati. To su među najlakšim promjenama koje možete napraviti kako biste povećali brzinu.  Odaberite pravi format slika – najpopularniji formati slika za mrežnu (online) upotrebu su JPEG i PNG. Možete puno uštedjeti na veličini slikovne datoteke odabirom ispravnog formata slike. Trebali biste upotrijebiti:  .jpg format za fotografije i slike s puno boja  .png format za slike s ograničenim bojama (npr. loga) i transparentne slike 5. Kako možete poboljšati brzinu stranice?
23. FreelancersTools.com FreelancersTools.com 23 Smanjenje & kompresija vaših slika: a) Prije podizanja slika na WordPress sajtu: Možete optimizirati slike pomoću jedne od sljedećih aplikacija za optimizaciju slika:  FileOptimizer za sve tipove slika  RIOT za sve tipove slika  JPEGmini za .jpeg slike (naša preporuka)  PNGGauntlet za .png slike  GIF Optimizer za .gif slike b) Za vrijeme podizanja & poslije podignutih slika na WordPress sajtu: Možete optimizirati slike pomoću jednog od sljedećih pluginova za optimizaciju slika:  Imagify Image Optimizer ili  EWWW Image Optimizer & Imsanity 5. Kako možete poboljšati brzinu stranice?
24. FreelancersTools.com FreelancersTools.com 24 D) Izvršite optimizaciju baze podataka  Kada izradite ili izbrišete postove, izbrišete komentare, promijenite opcije WordPress-a, instalirate / deinstalirate dodatke ili teme, vaša baza podataka može se prepuniti sa "ostacima" i mora se redovito čistiti.  Čišćenje baze podataka na redovnoj bazi oslobađa vas od drafta, spam komentara, ostataka tablica, i tako dalje. Također se preporučuje da izbrišete neiskorištene slike, teme ili pluginove i ispravite prekinute veze. Inače se vaš web sajt može usporiti.  Postoji mnogo pluginova u WordPress Plugin Repository koji čiste WordPress bazu podataka. Preporučujemo 2 kvalitetna plugina koja koristimo:  WP-Optimize: učinkovit alat za automatsko čišćenje vaše WordPress baze podataka  Plugins Garbage Collector: skenira vašu WordPress bazu podataka i prikazuje tablice izvan osnovne instalacije WordPressa  Drugim riječima, čišćenje vaše baze od beskorisnih ili suvišnih informacija izvrstan je način za ubrzavanje „teških” web sajtova. 5. Kako možete poboljšati brzinu stranice?
25. FreelancersTools.com FreelancersTools.com 25 E) Ažurirajte svoje pluginove, temu i WordPress  Održavanje WordPressa, ažuriranje tema i pluginova ne samo da vam daje pristup najnovijim značajkama, već vam omogućuje da iskoristite razne prednosti za poboljšanje brzine sajta.  Morate obavezno ažurirati na najnovije verzije WordPress sajt, teme i pluginove. Ako to ne učinite, web sajt može biti usporen i nepouzdan zbog čega će biti izložen sigurnosnim prijetnjama. F) Koristite pluginove za keširanje i optimizaciju učitavanja  Koristeći keširanje, vaš web sajt privremeno sprema kopije web sadržaja kako bi zadovoljio zahtjeve korisnika iz spremljenih kopija. Keširanje je učinkovito za ubrzanje vašeg web sajta.  Optimizacija učitavanja sajta - minimizira ukupnu veličinu stranice i broj HTTP zahtjeva: • Uklonite nepotrebni niz upita iz CSS, JS i slikovnih datoteka • Predučitajte DNS • Zaobiđite Google Analytics • Sporo učitavanje za slike, Iframes & skripte 5. Kako možete poboljšati brzinu stranice?
26. FreelancersTools.com FreelancersTools.com 26 • Minificirajte HTML, JavaScript i CSS • Komprimirajte CSS • Spojite skripte • Asinhrono učitajte javascript datoteke • Onemogućite Heartbeat • Onemogućite Emojis • itd.  Dva kvalitetna plugina koja mi koristimo i preporučujemo za ubrzanje sajtova:  Swift Performance (relativno novi plugin za keširanje & optimizaciju web sajtova)  WP Rocket (najpoznatiji Premium plugin za keširanje web sajtova) 5. Kako možete poboljšati brzinu stranice?
27. FreelancersTools.com FreelancersTools.com 27 G) Za naprednije korisnike Ažurirajte PHP verziju sajta na 7.x  Besplatna optimizacija web sajta (koje nudi svaki pristojan hosting) je nadogradnja PHP-a na verziju 7.x.  Ako vaš WordPress sajt koristi PHP 5.6 ili stariji onda se morate obratiti vašem hostingu i zatražiti da ga ažuriraju na najnoviju stabilnu PHP verziju  PHP 7 je, u usporedbi sa starijim verzijama, veliko poboljšanje kada je u pitanju brzina i performanse i prilično je jednostavno prebaciti se na njega, stoga iskoristite njegove prednosti. Koristite Content Delivery Network (CDN)  CDN je mreža servera koji se nalaze u različitim dijelovima svjeta i poslužuje najbliže korisnike  CDN: • je dobar za web sajtove s velikim medijskim datotekama i / ili prometom diljem svijeta • nije uvijek potreban za web sajt s prometom iz jedne geografske regije • može ga biti teško pravilno postaviti 5. Kako možete poboljšati brzinu stranice?
28. FreelancersTools.com FreelancersTools.com 28 6. Swift Performance plugin
29. FreelancersTools.com FreelancersTools.com 29 7. ZAKLJUČAK Sažetak najvažnijih koraka u ubrzavanju WordPress web sajta:  Redovito testirajte vaš web sajt pomoću alata za testiranje brzine kako biste pratili brzinu web sajta u različitim vremenima. Preporučujemo: Pingdom & Page load time  Uložite u kvalitetan hosting koji može podnijeti količinu prometa vašeg web sajta. Preporučujemo: SiteGround hosting  Odaberite optimiziranu temu samo sa funkcijama koje su vam potrebne. Preporučujemo: X Theme & X Theme Pro  Pažljivo izaberite pluginove koji smanjuju opterećenje servera. Preporučujemo: WP Speedster  Očistite svoju bazu podataka od nepotrebnih podataka koji opterećuju vaš web sajt. Preporučujemo : WP-Optimize
30. FreelancersTools.com FreelancersTools.com 30  Smanjite i komprimirajte slike koje podižete na vaš web sajt. Preporučujemo: Imagify Image Optimizer  Ažurirajte vaše pluginove, teme i WordPress (kao i web sajt PHP verziju na 7.x)  Uvijek keširajte & optimizirajte vaš web sajt. Preporučujemo: Swift Performance NAPOMENA: nisu svi alati prikladni za ubrzavanje svih web sajtova - to ovisi o složenosti samog web sajta. I za kraj:  web stranice se rade za ljude, vaše potencijalne klijente  morate pronaći dobru ravnotežu između sadržaja, dizajna, korisničkog doživljaja i brzine web sajta  nemojte biti opsjednuti brzinom web sajta (a posebno s rezultatima brzine stranice!)  sve dok poboljšavate iskustvo posjetitelja, postići ćete vaše poslovne ciljeve  .... i naravno, brzina je važna, veoma!  7. ZAKLJUČAK
31. FreelancersTools.com FreelancersTools.com 31 Hvala! FreelancersTools.com/ Ivica Delic Pripremio Ako imate bilo kakva pitanja u vezi ubrzavanja web sajtova pridružite nam se u WordPress Speed Up grupi na Facebook-u