Poboljšanje učinka vaše internet prodavnice

Vašu internet prodavnicu čini niz funkcija, kao što su kôd teme, aplikacije, slike, video-snimci, vrteške, fidovi društvenih mreža i analitika. Ove funkcije mogu poboljšati iskustvo posetilaca i proširiti mogućnosti vašeg sajta.

Međutim, svaka funkcija koju dodate u svoju internet prodavnicu može da utiče na učinak vaše prodavnice. Neke funkcije mogu usporiti vaš sajt ili stvoriti neočekivana ponašanja koja mogu uticati na korisnička iskustva.

Učinak veba se fokusira na optimizaciju korisničkog iskustva. Trenutno, učinak veba se fokusira na tri glavne oblasti koje su takođe obuhvaćene u okviru metrike Core Web Vitals:

  • Brzina učitavanja koja se meri na osnovu Najvećeg iscrtavanja sadržaja (LCP)
  • Stabilnost rasporeda koja se meri na osnovu Kumulativnog pomeranja rasporeda (CLS)
  • Odziv na korisničke interakcije koji se meri na osnovu Interakcije do sledećeg iscrtavanja (INP)

Optimizacija učinka veba znači da je veća verovatnoća da će vaši kupci ostati na vašem sajtu i ostvariti konverziju.

Optimizacije za vašu internet prodavnicu

Vaša internet prodavnica ima ugrađenu veb optimizaciju. Veb optimizacija je takođe ugrađena u sve nove funkcije. Nije potrebno da radite ništa posebno da biste iskoristili prednosti sledećih funkcija:

  • Vaša internet prodavnica se hostuje na brzim, globalnim serverima i ne ograničava propusni opseg vaše prodavnice. Status svoje Shopify prodavnice možete da proverite na stranici Shopify Status.
  • Vaša internet prodavnica ima mrežu za isporuku sadržaja (CDN) kojom upravlja Cloudflare i koja obezbeđuje brzo učitavanje vaše internet prodavnice širom sveta. CDN status možete da proverite na Cloudflare statusnoj stranici.
  • Da bi se obezbedila brza vremena učitavanja, slike se automatski optimizuju pomoću CDN-a za slike. U kombinaciji sa vašim kodom teme, CDN za slike može da pruži najbolji format slike, kome je takođe promenjena veličina i koji je komprimovan kako bi se zadržala mala veličina datoteka.

Faktori koji utiču na učinak veb-sajta

Za Shopify prodavnice, sledeće stavke su najveći faktori koji utiču na učinak veb-sajta:

  • Tema vaše internet prodavnice
  • Aplikacije koje ste instalirali
  • Svaki dodatni kôd treće strane koji ste ručno dodali u prodavnicu, uključujući menadžere oznaka i oznake unutar njih

To znači da bi trebalo da se fokusirate na sledeće kako biste poboljšali učinak svog veb-sajta:

  • Koristite ažuriranu, optimizovanu temu. Cela Horizon porodica tema i Online Store 2.0 teme kompanije Shopify su besplatne i optimizovane za učinak veb-sajta. Pored toga, mnoge druge teme trećih strana su takođe optimizovane za učinak veb-sajta. Možete da pregledate najnovije podatke o učinku tema.
  • Ako vaša tema nudi prelaze između stranica ili druge animacije, uporedite učinak veb-sajta pre i posle njihovog aktiviranja. Animacije mogu usporiti stranice.
  • Izbegavajte dodavanje previše odeljaka u šablone stranica u okviru teme. Veliki broj odeljaka na stranicama može smanjiti učinak veb-sajta.
  • Ako imate kolekcije sa velikim brojem proizvoda u njima, razmislite o aktiviranju paginacije da biste ograničili broj proizvoda koji se učitavaju u isto vreme.
  • Procenite instalirane aplikacije i kôd trećih strana kako biste se uverili da stvaraju dovoljno vrednosti da nadoknade potencijalne gubitke u učinku.
  • Proverite svoj menadžer oznaka kako biste uklonili sve nekorišćene ili manje važne oznake. Saznajte više o najboljim praksama za oznake i menadžere oznaka.

Alatke za testiranje

Možete da koristite sledeće alate da istražite učinak svoje internet prodavnice:

  • Izveštaji o veb-učinku: Shopify izveštaji o veb-učinku koriste funkciju Core Web Vitals za merenje iskustva stvarnih korisnika sa vašom internet prodavnicom.
  • PageSpeed Insights: Možete da pokrenete sopstvene izveštaje koristeći Google PageSpeed Insights za prikaz detaljnijih metrika za stranice u svojoj prodavnici.

Razumevanje preporuka za učinak od trećih strana

Alati trećih strana za skeniranje učinka mogu da predlože promene za poboljšanje brzine vaše prodavnice. Međutim, Shopify je već primenio mnoge od ovih preporuka ili se one ne odnose na Shopify prodavnice.

Optimizacije koje su već uključene u Shopify

Vaša Shopify prodavnica automatski uključuje sledeće optimizacije učinka:

Mreža za isporuku sadržaja (CDN): Shopify obezbeđuje CDN svetske klase bez dodatne naplate, čime se osigurava brz globalni učinak. Svi resursi se isporučuju pomoću HTTP/2, što smanjuje opterećenje u poređenju sa starijim protokolima.

Keširanje pregledača: Shopify podešava keširanje pregledača za resurse koji se mogu keširati na jednu godinu, što je maksimalno moguće trajanje. To znači da će posetioci koji se vraćaju u vašu prodavnicu iskusiti kraće vreme učitavanja.

Gzip kompresija: Shopify koristi gzip kompresiju za CSS, JavaScript, dokumente i stranice kako bi se smanjio propusni opseg i skratilo vreme učitavanja. Opcija Keep-alive je takođe omogućena za preuzimanje više datoteka.

Optimizacija slika: Shopify automatski komprimuje JPG slike pomoću naprednih algoritama, uspostavljajući ravnotežu između kompresije i vizuelne privlačnosti. Slike se često isporučuju u WebP formatu radi bolje kompresije i bržeg učitavanja.

Minifikacija datoteka: Shopify automatski smanjuje CSS i JavaScript datoteke kada ih vaš izlog zatraži, čime se smanjuje veličina datoteka bez uticaja na funkcionalnost.

Kada se preporuke trećih strana ne primenjuju

Alati trećih strana za skeniranje mogu da predlože promene koje nisu relevantne za Shopify prodavnice:

  • Konfiguracije na nivou servera: Preporuke u vezi sa podešavanjem servera, HTTP zaglavljima ili smernicama za keširanje su već optimizovane u okviru Shopify infrastrukture.
  • Implementacija CDN-a: Predlozi za dodavanje CDN-a su nepotrebni jer Shopify standardno uključuje CDN visokog učinka.
  • Podešavanja kompresije: Preporuke u vezi sa omogućavanjem kompresije su već primenjene na celoj Shopify platformi.

Primena relevantnih preporuka

Fokusirajte se na preporuke koje se odnose na specifičan sadržaj i funkcije vaše prodavnice:

  • Optimizacija slika: Pobrinite se da otpremljene slike budu odgovarajuće veličine i da koriste preporučene formate.
  • Procena aplikacija: Razmislite da li instalirane aplikacije pružaju dovoljnu vrednost da nadoknade bilo kakav uticaj na učinak.
  • Optimizacija teme: Odaberite teme optimizovane za učinak i ograničite broj odeljaka na šablonima stranica.

Rešavanje problema sa sporim učitavanjem stranica

Ako se vaša prodavnica sporo učitava, pratite ove korake da biste identifikovali i rešili problem:

Korak 1: Potvrdite problem

  1. Sami testirajte brzinu učitavanja svoje prodavnice sa različitih uređaja i internet veza.
  2. Zamolite druge da testiraju vašu prodavnicu kako biste potvrdili da nije reč o lokalnom problemu sa vašom internet vezom.
  3. Koristite alate za testiranje kao što je PageSpeed Insights da biste dobili specifične metrike učinka.

Korak 2: Identifikujte uzrok

Proverite ima li previše aplikacija: Previše aplikacija koje učitavaju resurse u vašem izlogu može da uspori učinak. Pregledajte instalirane aplikacije i uklonite sve koje nisu neophodne za prodaju.

Pregledajte velike slike: Stranice sa brojnim slikama visokog kvaliteta mogu se sporo učitavati. Optimizujte slike ili smanjite broj prikazanih slika. Saznajte više o preporučenim veličinama slika.

Identifikujte spore skripte: Ako se vaš sajt zamrzne kao prazna stranica pre nego što se učita odjednom, koristite alatke za programere u pregledaču da biste identifikovali skripte koje se sporo učitavaju. Obratite se programeru aplikacije ili teme radi rešenja.

Korak 3: Preduzmite akciju

Uklonite nepotrebne aplikacije: Deinstaliranje aplikacije ne uklanja automatski njen kôd iz vaše teme. Možda ćete morati da se obratite programeru aplikacija za kompletna uputstva za uklanjanje.

Optimizujte slike: Koristite odgovarajuće formate datoteka (JPG za fotografije, PNG za grafiku sa transparentnošću) i promenite veličinu slika tako da odgovara njihovoj veličini prikaza.

Procenite učinak teme: Razmislite o prelasku na temu optimizovanu za učinak ako vaša trenutna tema uzrokuje značajna usporavanja.

Dobijte podršku u vezi sa učinkom internet prodavnice

Ako koristite besplatnu Shopify temu, onda će Shopify podrška možda moći da vam pomogne u osnovnim poboljšanjima učinka.

Ako koristite temu treće strane i potrebna vam je pomoć, onda morate da se obratite programeru svoje teme, da angažujete Shopify stručnjaka za veb-učinak ili da angažujete Shopify partnera za učinak i brzinu sajta. Saznajte više o angažovanju Shopify partnera.

Ako vaš problem sa učinkom potiče od aplikacije, onda možete da se obratite programeru te aplikacije.

Ako imate razvojni tim ili agencijskog partnera, onda im se takođe možete obratiti za dalju pomoć.

Tehničke informacije i resursi za rešavanje problema

Ako ste programer koji želi da poboljša učinak Shopify izloga, teme ili aplikacije, onda možete da pregledate sledeće resurse za svaku Core Web Vitals metriku. Saznajte više o najboljim praksama za učinak za Shopify teme.

Brzina učitavanja

Najveće iscrtavanje sadržaja (LCP) meri brzinu učitavanja na osnovu toga koliko brzo najveći element na ekranu postaje vidljiv. Vreme do prvog bajta (TTFB) i prvo iscrtavanje sadržaja (FCP) su prateće metrike koje vam pomažu da bolje razumete odakle potiče osnovni uzrok problema. Možete saznati više o otklanjanju grešaka koje su česti uzroci sporog učitavanja u Shopify Liquid izlozima.

Vizuelna stabilnost

Kumulativno pomeranje rasporeda (CLS) meri vizuelnu stabilnost na osnovu toga koliko se sadržaj neočekivano pomera tokom učitavanja. Za detaljniji pregled otklanjanja grešaka za CLS, pročitajte Kako optimizovati kumulativno pomeranje rasporeda (CLS) na Shopify sajtovima.

Interaktivnost

Interakcija do sledećeg iscrtavanja (INP) meri interaktivnost na osnovu toga koliko je vremena potrebno stranici da postane responzivna na većinu korisničkih radnji. Na primer, radnje korisnika kao što je klik na link ili dugme.

Ako je vaš INP loš, u prodavnici verovatno imate previše JavaScripta iz koda teme, koda aplikacije ili koda treće strane, odnosno menadžera oznaka. Pokušajte da rešite najveće probleme. Saznajte više o 3 načina da pronađete najveće prepreke u JavaScriptu za učitavanje stranice. Ako i dalje imate problema sa INP-om, saznajte više pomoću resursa na lokaciji web.dev.