Ghid Cum comprimați, decupați și reduceți fotografiile online
Toată lumea știe că o imagine valorează o mie de cuvinte și că o pagină web câștigă foarte mult având fotografii care o însoțesc, dar da, toate acestea sunt adevărate dacă imaginile respective sunt bine optimizate. Rătăcind pe internet, găsim multe site-uri web care nu au imagini optimizate. Aceasta înseamnă că cântăresc prea mult, că sunt mai mari decât contul, că formatul nu este adecvat. Toate aceste probleme determină încărcarea mai lentă a rețelei web și, așa cum v-am spus deja în această postare, aceasta afectează poziționarea, ceea ce reprezintă o mare problemă. Oricine se dedică designului web în Córdoba sau oriunde în lume trebuie să controleze acest aspect. În această postare vă voi învăța cum să optimizați imaginile de pe site-ul dvs. web, reduceți dimensiunea și greutatea fotografiilor Da cum să redimensionați o imagine astfel încât să aibă exact dimensiunile cu care va fi afișat ulterior pe site-ul dvs. Cu acest tutorial, veți începe să vă îndrăgostiți de Google, cel puțin când vine vorba de optimizarea imaginii. Să o facem 😉
De ce ar trebui să comprimați imaginile paginii?
Google ia în calcul sute de factori atunci când vine vorba de clasarea site-urilor pe paginile sale de rezultate. Printre acești factori există unul care este fundamental: timpul de încărcare. Cu cât site-ul dvs. web se încarcă mai repede, cu atât mai bine. Acestea fiind spuse, este evident că, cu cât fotografiile dvs. sunt mai puțin optimizate, acestea vor cântări mai mult și, prin urmare, vor dura mai mult timp pentru a se încărca, provocând suferința poziționării. Din fericire, este foarte ușor să redimensionați o imagine și, în consecință, să reduceți greutatea fotografiilor și a întregului site.
Dimensiunea imaginilor de pe paginile web: pixeli
Ce sunt pixelii
Pixelii sunt cea mai mică unitate a unei imagini digitale. Fiecare imagine digitală este un dreptunghi care este alcătuit dintr-un anumit număr de pixeli, fiecare dintr-o singură culoare. Cu cât numărul de pixeli este mai mare, cu atât imaginea este mai mare. În schimb, cu cât sunt mai puțini pixeli, cu atât imaginea este mai mică.
Cum să cunoașteți pixelii ideali pentru un site web
Bine, acum că controlați ce este un pixel, s-ar putea să vă întrebați câți pixeli trebuie să puneți în imagini pentru a le face să arate bine pe pagina dvs. Este ușor de aflat. Puteți utiliza o extensie Google Chrome pentru aceasta. Se numește Page Ruler și vă va permite să desenați un dreptunghi pe pagina dvs. și să vedeți măsurătorile acesteia. De asemenea, vă ajută să măsurați spații sau imagini care sunt deja inserate pe web. În imaginea următoare măsoară una dintre fotografiile care împodobesc postarea noastră pe băncile de imagini gratuite.
După cum puteți vedea, imaginea are o lățime de 800 pixeli și o înălțime de 447 pixeli. Restul măsurătorilor indică locația imaginii în raport cu pagina, colțul din stânga sus fiind pixelul 0,0.
Ce este pixelarea?
Vă arăt cu câteva exemple. Următoarea imagine are 300 × 300 pixeli:
Și următoarele sunt 500 × 500 pixeli:
Fotografie 500 × 500 pixeli
După cum puteți vedea, arată de bună calitate, dar acum să facem un test. Voi lua imaginea de 300 × 300 pixeli și o voi forța să o mărească la 500 × 500 pixeli:
După cum puteți vedea, își pierde calitatea, apare ceea ce este cunoscut sub numele de pixelare. Prin urmare, idealul este să începeți cu o imagine care are cel puțin dimensiunea pe care doriți să o utilizați. Dacă este mai mare, nu se întâmplă nimic, deoarece putem oricând să modificăm dimensiunea imaginii fără a pierde calitatea. Și acesta va fi primul pas al nostru optimizarea imaginii.
În cele din urmă: verificați dimensiunea reală a fotografiilor
Cu Page Ruler veți putea cunoaște dimensiunea la care sunt afișate imaginile pe un site web, dar asta nu înseamnă că imaginea are de fapt acea dimensiune. Imaginile sunt uneori afișate mai mici decât sunt, fiind reduse folosind HTML sau CSS. Acest lucru cauzează problema pe care v-am spus-o la început, imaginile cântăresc mai mult decât ar trebui. Pentru a vedea dimensiunea unei imagini, chiar vă voi spune o altă extensie care va fi foarte utilă nu numai pentru asta, ci și pentru alte o mie de lucruri. Un adevărat cuțit elvețian numit Web Developer. Faceți clic aici pentru ao instala. Odată ce îl aveți, trebuie să urmați pașii următori:
- Faceți clic pe roata dințată care a apărut lângă bara de adrese, apoi pe fila Imagini și apoi pe Afișare dimensiuni imagine. Un poster mic cu dimensiunile sale va apărea deasupra fiecărei imagini.
- Plasați cursorul peste imaginea a cărei dimensiune doriți să o verificați și faceți clic dreapta.
- Faceți clic pe Deschidere imagine într-o filă nouă.
- Repetați pasul 1 pe noua filă menționată.