Dimensiunea Fișierului Contează?
Înțelegerea modului de a identifica corect dimensiunea fișierului și a modului de redimensionare a acestora este fundamentală pentru a crește performanța site-ului dvs. O pagină web rapidă și optimizată conține întotdeauna imagini care au fost redimensionate și comprimate anterior.
Nu fiecare imagine pe care doriți să o adăugați pe site-ul dvs. web va avea întotdeauna dimensiunea exactă necesară: de cele mai multe ori trebuie să utilizați un editor de fotografii pentru a redimensiona fișierele de imagine.
Editorii foto vă pot comprima și imaginile, dar vom vedea acest lucru într-un articol separat dedicat compresiei imaginilor.
În acest articol, vom cerceta secretele redimensionării imaginilor: veți afla ce este dimensiunea fișierului pentru imagini și cum să determinați dimensiunea corectă a imaginilor dvs.
De asemenea, vă vom sugera câteva instrumente pe care le puteți utiliza pentru a modifica dimensiunile imaginilor dvs.
Ce Înseamnă cu Adevărat Redimensionarea unei Imagini
Dimensiunile (înălțimea și lățimea) unei imagini sunt măsurate în pixeli: un pixel este unitatea de măsură pentru a identifica spațiul pe care o imagine îl ocupă pe ecran.
Dimensiunea fișierului, pe de altă parte, este cantitatea de spațiu de stocare pe care o va ocupa imaginea dvs.: este măsurată în kilo-octeți (KB) și mega-octeți (MB), unde 1MB = 1000KB.
Dimensiunile și dimensiunea fișierului sunt strict legate: cu cât dimensiunile unei imagini sunt mai mari, cu atât dimensiunea fișierului acesteia va fi mai mare.
Imaginile pentru web pot fi definite și prin rezoluția lor în pixeli, care este de obicei adoptată pentru a indica calitatea unei imagini. Această măsură este exprimată prin două numere, de exemplu, 1024 × 768 (unde primul este numărul de coloane de pixeli, iar al doilea este numărul de rânduri de pixeli).
Redimensionarea unei imagini pentru web înseamnă reducerea lățimii și înălțimii acesteia, ceea ce va ajunge prin a-i reduce dimensiunea fișierului.
Când dimensiunea unei imagini este redusă, editorul foto la alegere va elimina automat informațiile inutile de pixeli și va schimba dimensiunea fișierului.
Deci, putem defini redimensionarea ca având de-a face cu dimensiunile fizice ale unei imagini.
Cum să Determinați Dimensiunea Potrivită Pentru o Imagine?
Pentru a pregăti imaginile pentru a fi încărcate pe web, ar trebui să vă asigurați că au înălțimea și lățimea potrivite pentru zona de conținut a paginii în care le veți plasa.
Este foarte important să vă dați seama în avans cât de largă este zona de conținut a paginii dvs. web: pentru a economisi resurse și timpul de încărcare a paginii, evitați întotdeauna să încărcați imagini mai late decât acea porțiune a paginii.
Există mai multe instrumente care vă permit să evaluați lățimea corectă a zonei de conținut. Cele mai rapide sunt următoarele:
- Din browser (fie că este Chrome, Firefox sau Safari), puteți să faceți clic dreapta pe orice element de pagină și să alegeți Inspectați elementul pentru a deschide Instrumente pentru dezvoltatori. Acesta va indica instantaneu dimensiunile zonei de conținut care vă interesează:
- Pentru utilizatorii Apple, puteți profita de instrumentul de captură încorporat al Mac, Grab: îl puteți activa cu Command+Shift+4. Când desenați o zonă pe ecran, veți vedea pixelii zonei respective.
Ce Instrument ar Trebui să Utilizați Pentru a vă Redimensiona Imaginile?
Există o mare varietate de software și instrumente online care vă pot ajuta să vă redimensionați imaginile. Nu există cu adevărat un instrument mai bun decât altul atunci când trebuie să modificați dimensiunile unui fișier: important este să localizați caracteristica de redimensionare, să adăugați lățimea dorită și să lăsați instrumentul să-și facă treaba!
Iată câteva sugestii despre instrumentele de redimensionare pe care le puteți folosi:
- Photoshop: cel mai faimos software de editare foto
- GIMP: foarte asemănător cu Photoshop, este un software gratuit de editare de imagini
- IrfanView: software gratuit de editare de imagini pentru Windows
- High Quality Photo Resizer: software gratuit de editare de imagini pentru Windows
- Preview app: soluția încorporată pentru fiecare versiune de macOS și OS X
Dacă preferați instrumentele online de redimensionare a imaginilor, iată câteva pe care le puteți încerca:
- Squoosh.app: instrument online gratuit de la Google
- Picmonkey.com: instrument online premium, versiune de încercare gratuită disponibilă
- Fotor.com: freemium, disponibil și ca aplicație mobilă
- BeFunky.com: instrument gratuit, disponibil și ca aplicație mobilă
- Pixlr.com: gratuit, disponibil și ca aplicație mobilă
- Picozu.com: gratuit, acceptă și fișiere imagine SVG
Alegerea Formatului de Imagine Potrivit
Odată ce dimensiunile fișierului imagine sunt redimensionate, este timpul să le dați un nume! Alegerea formatului de imagine potrivit este importantă pentru a vă menține paginile luminoase și rapide.
Grafica site-ului este adesea construită inițial în format SVG (fișiere Scalable Vector Graphics): folosesc un format de text bazat pe XML, care descrie imaginea și oferă indicații despre afișarea acesteia.
Deoarece se bazează pe text pentru a fi descris, fișierele SVG pot fi scalate la diferite dimensiuni fără a pierde calitatea: pot fi definite ca fiind independente de rezoluție.
Datorită acestei caracteristici, designerii web preferă să-și construiască grafica în format SVG, astfel încât să le poată redimensiona ulterior pentru a se potrivi cu diferite design-uri în viitor.
Cele mai potrivite trei formate de imagine pentru web sunt:
- .jpg
- .png
- .gif
JPEG
Acest format este cel mai bine utilizat pentru imagini ne-plate, cum ar fi imaginile fotografice. Nu este potrivit pentru vectori sau imagini care conțin text și nu acceptă transparente. Imaginile JPEG pot fi comprimate destul de ușor, iar dimensiunea fișierului lor este potrivită pentru paginile web.
PNG
Dacă aveți de-a face cu ilustrații sau cu un export dintr-un fișier vectorial, PNG este cea mai potrivită soluție. Spre deosebire de JPEG, PNG-urile folosesc pe deplin transparența. Mai mult, acest format gestionează nuanțele în mod diferit, acceptând umbrirea mai omogenă și informații mai bogate despre imagine. Din acest motiv, generează de obicei fișiere de dimensiuni mai mari: utilizarea sa este sugerată doar dacă trebuie să păstrați transparența.
GIF
Spre deosebire de JPEG, GIF-urile pot exporta doar imagini care conțin până la 256 de culori. Dacă imaginea originală conține un număr mai mare de culori, pierderea calității va fi semnificativă. Formatul GIF acceptă transparență și mai multe cadre, așa că în prezent este folosit mai ales pentru crearea de GIF-uri animate.
Tot ce Trebuie să Știți Despre Optimizarea Imaginilor în WordPress
În acest articol ați învățat:
- Definițiile dimensiunilor imaginii și ale dimensiunii fișierului
- Ce este redimensionarea imaginii și cum să determinați dimensiunea potrivită pentru imaginile dvs.
- Ce fel de instrumente ar trebui să utilizați pentru a vă redimensiona imaginile
- Ce format de fișier ar trebui să alegeți pentru imaginile dvs.
Acum că știți totul despre a reduce dimensiunea fișierului, este timpul să mergeți mai departe și să învățați alte trucuri despre optimizarea imaginii:
- Cum să vă comprimați imaginile?
- De ce ar trebui să utilizați încărcare leneșă pentru imaginile dvs.
- Optimizarea imaginilor cu Imagify: Pluginul WordPress pentru optimizarea imaginilor.
Ar trebui să aruncați o privire și pe lista celor mai bune pluginuri de optimizare a imaginii pentru WordPress!
