Kad izmantot Jūsu tīmekļa attēliem JPG, GIF, PNG un SVG formātus

Ir vairāki attēlu formāti, kurus var izmantot tīmekļa lapās. Daži bieži piemēri ir GIF , JPG un PNG . Šodien SVG faili tiek bieži izmantoti arī tīmekļa vietnēs, dodot tīmekļa dizaineriem vēl vienu iespēju tiešsaistē attēlot.

GIF attēli

Izmantojiet GIF failus attēliem, kuriem ir neliels, fiksēts krāsu skaits. GIF faili vienmēr tiek samazināti ne vairāk kā 256 unikālas krāsas. GIF failu saspiešanas algoritms ir mazāk sarežģīts nekā JPG failos, bet, izmantojot plakano krāsu attēlus un tekstu, tas rada ļoti mazus failu izmērus .

GIF formāts nav piemērots fotogrāfijām vai attēliem ar gradienta krāsām. Tā kā GIF formātā ir ierobežots krāsu skaits, gradienti un fotogrāfijas, kad tie tiks saglabāti kā GIF fails, tiks izlīdzināti ar banding un pixelation.

Īsāk sakot, jūs izmantojat GIF tikai vienkāršiem attēliem, kuriem ir tikai dažas krāsas, taču jūs varētu arī izmantot PNG (arī vēlāk).

JPG attēli

Izmantojiet JPG attēlus fotogrāfijām un citiem attēliem, kuros ir miljoniem krāsu. Tas izmanto kompleksu kompresijas algoritmu, kas ļauj jums izveidot mazākas grafikas, zaudējot daļu no attēla kvalitātes. To sauc par "zudumu" kompresiju, jo daļa attēla informācijas tiek zaudēta, kad attēls ir saspiests.

JPG formāts nav piemērots attēliem ar tekstu, lieliem vienkrāsainiem blokiem un vienkāršām formām ar kraukšķīgām malām. Tas ir tādēļ, ka, kad attēls ir saspiests, teksts, krāsa vai līnijas var izplūst, tādējādi iegūstot attēlu, kas nav tik straujš, jo tas tiks saglabāts citā formātā.

JPG attēlus vislabāk var izmantot fotogrāfijām un attēliem, kuriem ir daudz un daudz dabisko krāsu.

PNG attēli

PNG formāts tika izstrādāts kā GIF formāta aizstājējs, kad parādījās, ka par GIF attēliem tiks piemērota honorāra maksa. PNG grafikai ir labāka kompresijas pakāpe nekā GIF attēliem, kuru rezultātā tiek iegūti mazāki attēli nekā vienam failam, kas saglabāts kā GIF. PNG faili piedāvā alfa caurspīdīgumu, un tas nozīmē, ka jūsu attēliem var būt pilnīgi caurspīdīgas vai pat izmantot alfa pārredzamību. Piemēram, piliens ēna izmanto dažādus pārredzamības efektus, un tas būtu piemērots PNG (vai jūs varat vienkārši beigt, izmantojot CSS ēnas).

PNG attēli, piemēram, GIF, nav piemēroti fotogrāfijām. Iespējams apiet aplīmēšanas problēmu, kas ietekmē fotogrāfijas, kas saglabātas GIF failos, izmantojot patiesas krāsas, taču tas var radīt ļoti lielus attēlus. PNG attēlus arī neatbalsta vecāki mobilie tālruņi un iezīme tālruņi.

Mēs izmantojam PNG jebkuram failam, kam nepieciešama pārredzamība. Mēs arī izmantojam PNG-8 jebkuram failam, kas būtu piemērots kā GIF, nevis izmantot šo PNG formātu.

SVG attēli

SVG nozīmē Scalable Vector Graphic. Atšķirībā no rastra formāta formātiem, kas atrodami JPG, GIF un PNG failos, šie faili izmanto vektorus, lai izveidotu ļoti mazus failus, kurus var padarīt jebkādā izmērā, nezaudējot faila lieluma palielināšanas kvalitāti. Tās ir izveidotas ilustrācijām, piemēram, ikonām un pat logotipiem.

Attēlu sagatavošana Web piegādei

Neatkarīgi no tā, kuru attēlu formātu jūs izmantojat, un jūsu vietnē noteikti ir jāizmanto dažādi formāti visās tā lapās, jums ir jānodrošina, lai visi attēli šajā vietnē tiktu sagatavoti tīmekļa piegādei . Pārāk lieli attēli var izraisīt vietnes lēnām darbību un ietekmēt vispārējo veiktspēju. Lai cīnītos pret šo, šie attēli ir jāoptimizē, lai atrastu līdzsvaru starp augstu kvalitāti un zemāko faila lielumu, kas ir iespējams šajā kvalitātes līmenī.

Izvēlētais pareizais attēlu formāts ir kaujas daļa, taču pārliecinieties, ka esat tos sagatavojis, ir nākamais solis šajā svarīgajā tīmekļa piegādes procesā.

Jennifera Krīnina oriģinālais raksts. Rediģējis Jeremijs Girards.