Cum să remediați încărcarea lentă a imaginilor pe site-ul dvs. - proces în 3 pași
Actualizat: 26 februarie 2019 //
În ultimii 5 ani, dimensiunea unei pagini web medii a crescut treptat, la fel și dimensiunile imaginilor utilizate.
Dimensiunea medie a paginii a depășit recent 3 Mb!
Optimizarea imaginilor este cea mai mare victorie în ceea ce privește viteza site-ului web.
Tipuri de formate de imagine
Iată cele mai populare formate de imagine pentru web:
JPG (cunoscut și sub numele de JPEG)
JPG-urile sunt cel mai popular tip de fișier pentru imaginile de pe web. JPG-urile sunt perfecte pentru fotografii sau imagini complexe care conțin o mulțime de culori, umbre, gradiente sau modele complexe. JPG-urile se descurcă bine cu aceste tipuri de imagini, deoarece JPG-urile au un palet de culori uriaș cu care să lucreze. Au pierderi, sunt slabe la zone cu contrast ridicat, la margini.
PNG (Grafică de rețea portabilă)
PNG-urile au fost create ca înlocuitor pentru GIF-uri în 1996. Sunt cele mai potrivite pentru imagini cu puține culori. Dacă utilizați Adobe Photoshop, probabil că ați avut opțiunea de a salva o imagine ca PNG-8 sau PNG-24.
PNG-8 are o dimensiune mai mică, dar are o paletă de culori limitată de 256 de culori.
PNG-24 nu are restricții privind paleta de culori, dar dimensiunea fișierului va fi mai mare.
PNG-urile sunt adesea folosite pentru logo-uri, deoarece logo-urile necesită de obicei transparență și trebuie să aibă o calitate ridicată.
GIF-urile erau populare în urmă cu mulți ani, utilizate în principal pentru animații. GIF-urile au o paletă de culori limitată de 256 și tind să aibă dimensiuni mai mari.
SVG (grafică vectorială scalabilă)
Deoarece SVG-urile sunt grafică vectorială, acestea sunt de dimensiuni reduse și se afișează frumos pe ecranul retinei. SVG-urile pot fi folosite și în linie în HTML, ceea ce va salva o cerere HTTP. De asemenea, pot fi inserate ca imagini obișnuite.
Optimizarea imaginilor
Reduceți dimensiunea fizică a imaginii (dimensiunea fotografiei)
Puteți vizualiza dimensiunile imaginii deschizând fișierul în Photoshop și vizualizându-l la 100%. Sau puteți, de asemenea, să faceți clic dreapta pe imagine pe Finder (pe Mac) și să vizualizați informații:
Va afișa dimensiunile și dimensiunile imaginii. Fotografia de mai sus arată că această imagine a fost făcută cu un iPhone și are dimensiunea de 3264 x 2448. Este mult prea mare pentru un site web. Majoritatea telefoanelor și a camerelor digitale fac fotografii mari, care au dimensiuni și greutate mari și trebuie reduse.
Dimensiunea imaginii potrivită pentru un site web depinde de tema pe care o utilizați. De exemplu, tema WordPress Default Twenty Seventeen listează Specificații rapide cu dimensiunile exacte ale imaginii recomandate. Dimensiunea recomandată a imaginii recomandate este de 2000 px lățime și 1200 px înaltă. Lățimea coloanei principale (pentru o secțiune Blog, de exemplu) ar trebui să aibă o lățime de până la 740 px cu aspectul unei coloane.