De ce este important să optimizezi imaginile?
Am lămurit deja că una dintre principalele consecințe ale faptului că magazinul tău online nu se încarcă la o viteză potrivită din cauza rezoluției și dimensiunii imaginilor este că vizitatorii îți părăsesc site-ul. Așa cum am spus de mai multe ori, utilizatorii nu sunt dispuși să aștepte când știu că există alte site-uri care le pot oferi același conținut mai repede. Un site care se încarcă lent înseamnă o rată de respingere foarte mare. În plus, rețelele 3G și 4G la care se conectează un smartphone nu ating nici pe departe viteza conexiunii de bandă largă de acasă. Țnând cont de asta și de faptul că tot mai mulți utilizatori accesează internetul de pe dispozitive mobile, este esențial să nu ignori viteza de încărcare a imaginilor din magazinul tău. Dar asta nu e tot. Gigantul internetului ia foarte în serios viteza de încărcare a unui site în ceea ce privește poziționarea SEO. După cum probabil îți imaginezi, Google are un timp limitat pentru a-ți accesa site-ul. Asta înseamnă că, cu cât magazinul tău se deschide mai repede, cu atât Google are mai multe șanse să parcurgă un număr mai mare de pagini din magazinul tău online și, astfel, ai mai multe șanse să fii printre primele rezultate din motorul său de căutare. Dar să începem cu începutul…Ce calitate trebuie să aibă imaginile?
Așa cum îți tot spunem, imaginile sunt un element fundamental pentru orice magazin online. De aceea vrem să știi și care sunt parametrii de care trebuie să ții cont atunci când alegi și optimizezi imaginile site-ului tău.Rezoluție
Mai întâi de toate, trebuie să înțelegi că a salva o imagine pentru a o publica pe internet nu este același lucru cu a salva o imagine pentru a o tipări ulterior. Sunt două moduri de a vizualiza o imagine pe suporturi foarte diferite: pe ecran și pe hârtie. De aceea, cel mai important este să verifici într-un program de editare foto (precum Photoshop, Illustrator sau GIMP) că imaginea are o rezoluție de 72 ppi (pixeli pe inch). Cu cât acest număr este mai mare, cu atât calitatea este mai bună. Pentru afișarea pe un site, 72 ppi sunt mai mult decât suficienți, în timp ce pentru tipărirea unui afiș, de exemplu, ar fi nevoie de aproximativ 300 ppi.Format
Cu siguranță, când salvezi o imagine îți apar mai multe formate și ți-ai pus întrebări precum: ce ocupă mai mult, PNG sau JPG? De aceea este important să știi la ce se folosește fiecare format, pentru că unele pot fi mai utile când vine vorba să optimizezi imaginile. În spatele fiecăruia se ascunde o întreagă lume, dar stai liniștit, îți dăm informațiile necesare ca să știi când să folosești unul sau altul:- JPG: Este formatul universal pentru fotografii, pentru că le comprimă cel mai bine fără să piardă tonalitatea sau culorile originale. Prin urmare, este excelent pentru imagini cu multe detalii. În plus, poți modifica calitatea de la 0 la 100. De exemplu, dacă salvezi la o calitate de 80, abia vei observa diferența de claritate, dar o vei observa în dimensiunea fișierului, care va fi cu aproximativ 30% mai mic.
- PNG: Păstrează transparențele, ceea ce îl face cel mai bun format pentru imaginile de brand, precum logourile sau imaginile cu culori plate. Marele lui avantaj este că nu pierde multă calitate la compresie. Dar există diferențe între PNG 8 și 24? Diferența dintre cele două formate este că PNG 8 stochează maximum 256 de culori, în timp ce PNG 24 ajunge la 16 milioane de culori. Îți recomandăm să folosești PNG 8 doar pentru imaginile care nu au nevoie de transparență și au puține culori.
- GIF: Folosește acest format doar atunci când imaginile tale includ o animație. Reține că nu se comprimă la o calitate bună, pentru că animațiile includ mai multe cadre, adică stochează mai multe fotografii.
- WEBP: acest format, dezvoltat de Google acum câțiva ani, oferă imagini de înaltă calitate, dar cu dimensiuni mai mici decât alte formate precum PNG sau JPG. De aceea, pentru că optimizează enorm dimensiunea imaginilor fără a le sacrifica calitatea, este un format foarte potrivit pentru site-uri.
Dimensiuni
De obicei avem tendința să salvăm imaginea la dimensiunea implicită sau chiar la o dimensiune mare, pentru că ne gândim că așa va arăta mai bine pe site. Dar probabil ai observat că calitatea și claritatea imaginilor depind în principal de rezoluția și de formatul în care le exporti. Așa că renunță să-ți salvezi imaginile la dimensiuni mari, pentru că vor crește considerabil ca greutate, fără niciun rost, dacă imaginea va fi afișată mult mai mic în pagină. De aceea îți recomandăm să exporti toate imaginile la dimensiunea reală la care vor fi afișate pe site, adică la dimensiunile pe care le folosești în PrestaShop. Astfel, dacă imaginea va ocupa un spațiu de 50 px x 70 px, ajustează-o la această dimensiune. Așa vei reduce considerabil greutatea fotografiilor fără ca ele să piardă calitate sau să arate pixelate. De ce să ai o imagine mai mare dacă utilizatorii o vor vedea mai mică?Ce dimensiune pentru fotografiile de produs?
În Design > Setări imagini din PrestaShop poți filtra după produse și poți vedea dimensiunea tuturor imaginilor de produs din magazinul tău.
Astfel, de exemplu, dacă cea mai mare imagine de produs pe care o ai este de 1000 px x 1000 px, va trebui să folosești imaginile de acest tip la aceeași dimensiune. Dacă folosești o imagine mai mică în acest caz, va apărea pixelată. Cu alte cuvinte, va trebui să adaptezi fiecare imagine la formatul sau dimensiunea stabilite. Pe de altă parte, în ceea ce privește greutatea acestor imagini, recomandarea este să nu depășească 100 KB, altfel va crește timpul de încărcare al magazinului tău online.
Instrumente pentru optimizarea imaginilor
Îți arătăm o serie de bune practici și instrumente care vor face ca magazinul tău online să se încarce mult mai repede. Dacă ai deja magazinul online creat, primul pas este să verifici viteza de încărcare. Pentru asta îți recomandăm să-l analizezi cu PageSpeed. Este foarte simplu: introduci URL-ul, dai clic pe analizează și vei vedea rezultatele, împărțite în diagnostice și oportunități. În plus, apăsând pe săgețile din dreapta, vei vedea cum se pot corecta aceste erori.
Acum nu mai trebuie decât să reduci greutatea acestor imagini și să le înlocuiești, așa că salvează-le pe calculator. După ce le-ai salvat pe toate, folosește un instrument de comprimare a imaginilor. Noi îți arătăm Compresspng și Compressjpg, dar poți folosi oricare altul, pentru că funcționează foarte asemănător și destul de intuitiv. Mai întâi, încarcă imaginile, în funcție de formatul lor, în Compresspng sau Compressjpg, dând clic pe Upload Files. În funcție de imaginile încărcate, comprimarea va dura mai mult sau mai puțin. Când se termină, descarcă-le din Download ZIP. Ai imaginile comprimate! Acum nu trebuie decât să le încarci din nou pe site.
Iar dacă vrei să încarci imagini noi pe site, trebuie doar să le exporti în formatul potrivit și cu o rezoluție de 72 ppi dintr-un program de editare foto. În Photoshop și GIMP trebuie să le salvezi din Salvare pentru web. Îți va apărea un ecran în care poți alege formatul; alege-l pe cel care ți se potrivește cel mai bine, conform celor explicate mai sus. Poți verifica și modifica rezoluția și din Imagine > Dimensiune imagine.
Pe scurt:
Modul pentru optimizarea imaginilor în PrestaShop
Așa cum spuneam la începutul articolului, îmbunătățirea vitezei de încărcare nu este benefică doar pentru utilizatorul care navighează liniștit prin magazinul tău PrestaShop. Google, mereu înfometat de site-uri de calitate, apreciază atât de mult timpul în care se deschide un magazin online încât, dacă se încarcă la o viteză acceptabilă, îl va afișa pe primele poziții. Și ce înseamnă asta? Că dacă ai un magazin online minunat, dar și concurența ta are unul, care în plus se încarcă mai repede, Google îl va poziționa înaintea ta în rezultatele căutării. Știi deja că confortul, transparența și siguranța stau la baza oricărui magazin digital. Bineînțeles că știi, și înțelegem și dificultățile pe care le presupune. De aceea, cu scopul de a-ți prezenta toate alternativele pentru îmbunătățirea vitezei de încărcare, îți propunem varianta cea mai comodă și eficientă. Modulul pentru optimizarea imaginilor în PrestaShop semnat de Línea Gráfica este ajutorul de care ai nevoie ca să transformi magazinul tău PrestaShop într-un adevărat categorie-pană. Acest modul reduce dimensiunea imaginilor de pe site fără să le piardă calitatea, printr-un sistem intuitiv și foarte ușor de folosit:- Alegi procentul de reducere dorit pentru JPG și JPEG.
- Selectezi valoarea de reducere pentru fișierele PNG.
- Selectezi imaginile din magazin pe care nu vrei să le comprimi. Un logo, de exemplu.
Vezi modulul de comprimare a imaginilor!
Dacă căutai un impuls rapid pentru a îmbunătăți viteza și poziționarea site-ului tău, l-ai găsit. Să-ți verifici rezultatele în timp record și să oferi o experiență mai bună nu a fost niciodată atât de accesibil! Iar dacă după toate acestea tot nu știi cum să îmbunătățești viteza de încărcare în PrestaShop, stai liniștit. Am pregătit ghidul definitiv, pas cu pas!Și tu, folosești și alte instrumente pentru a-ți optimiza imaginile? La Línea Gráfica suntem experți în marketing digital și Partner Platinum PrestaShop, așa că, dacă după toate acestea ai nevoie de ajutor la poziționarea magazinului tău, nu trebuie decât să ne contactezi.