Hvenær á að nota JPG, GIF, PNG og SVG snið fyrir myndirnar þínar

Það eru nokkrar myndasnið sem hægt er að nota á vefsíðum. Sum algeng dæmi eru GIF , JPG og PNG . SVG skrár eru einnig almennt notaðar á vefsíðum í dag, sem gefur vefhönnuðum enn aðra möguleika fyrir mynd á netinu.

GIF myndir

Notaðu GIF skrár fyrir myndir sem hafa lítið, fastan fjölda lita. GIF skrár eru alltaf minnkaðar í ekki meira en 256 einstaka liti. Þjöppunaralgritið fyrir GIF-skrár er minna flókið en fyrir JPG-skrár, en þegar það er notað á flötum litum og texta framleiðir það mjög litlar skrárstærðir .

GIF sniðið er ekki hentugur fyrir ljósmyndar myndir eða myndir með hallandi litum. Vegna þess að GIF-sniði hefur takmarkaðan fjölda lita, mun stig og ljósmyndir endar með banding og pixelation þegar þau eru vistuð sem GIF skrá.

Í hnotskurn myndi þú nota GIF aðeins fyrir einfaldar myndir með aðeins nokkrum litum, en þú gætir líka notað PNG fyrir það líka (meira um það innan skamms).

JPG myndir

Notaðu JPG myndir fyrir ljósmyndir og aðrar myndir með milljón litum. Það notar flókið samþjöppunaralggrím sem gerir þér kleift að búa til minni grafík með því að tapa einhverjum gæðum myndarinnar. Þetta er kallað "losty" þjöppun vegna þess að sumir af myndupplýsingunum glatast þegar myndin er þjappuð.

JPG sniði passar ekki við myndir með texta, stórum blokkum með solidum lit og einföldum stærðum með skörpum brúnum. Þetta er vegna þess að þegar myndin er þjappað getur textinn, liturinn eða línurnar óskýrt og leiðir til myndar sem er ekki eins skörp og það var vistað á öðru sniði.

JPG myndir eru best notaðar fyrir ljósmyndir og myndir sem hafa fullt af náttúrulegum litum.

PNG myndir

PNG-sniði var þróað í staðinn fyrir GIF-sniði þegar það virtist að GIF-myndir yrðu háð royalty-gjaldi. PNG-grafík hefur betri þjöppunarhlutfall en GIF-myndir sem leiða til minni mynda en sömu skrá sem vistuð er sem GIF. PNG skrár bjóða alfa gagnsæi, sem þýðir að þú getur haft svæði af myndunum þínum sem eru annaðhvort að fullu gagnsæ eða jafnvel að nota úrval af alfa gagnsæi. Til dæmis notar dropaskuggi margvísleg gagnsæiáhrif og gæti hentað PNG (eða þú gætir bara endað okkur með því að nota CSS skuggar í staðinn).

PNG myndir, eins og GIF, eru ekki vel til þess fallin að taka myndir. Það er hægt að komast í kringum hljómsveitina sem hefur áhrif á myndir sem eru vistaðar sem GIF skrár með sanna litum, en það getur leitt til mjög stórar myndir. PNG myndir eru ekki vel studdar af eldri farsímum og lögun símum.

Við notum PNG fyrir hvaða skrá sem krefst gagnsæis. Við notum líka PNG-8 fyrir hvaða skrá sem væri hentugur sem GIF, með því að nota þetta PNG snið í staðinn.

SVG myndir

SVG stendur fyrir Scalable Vector Graphic. Ólíkt sniðum raster sem finnast í JPG, GIF og PNG, nota þessar skrár vektorar til að búa til mjög litlar skrár sem hægt er að gera í hvaða stærð sem er án þess að tapa gæðum aukinnar skráarstærð. Þau eru búin til fyrir myndir eins og tákn og jafnvel lógó.

Undirbúningur myndir fyrir afhendingu á vefnum

Óháð því hvaða myndsniði þú notar og vefsvæðið þitt er viss um að nota fjölda mismunandi sniða á öllum síðum þess þarftu að tryggja að allar myndirnar á þessum vef séu tilbúnar til afhendingar á vefnum . Of stórir myndir geta valdið því að síða keyri hægt og áhrif á árangur. Til að berjast gegn þessu, verða þessar myndir að vera bjartsýni til að finna jafnvægið á milli hágæða og lægsta skráarstærð möguleg á þessu gæðastigi.

Velja rétta myndasniðið er hluti af bardaganum, en einnig að ganga úr skugga um að þú hafir undirbúið þessar skrár er næsta skref í þessu mikilvæga vefur afhendingu.

Upprunaleg grein af Jennifer Krynin. Breytt af Jeremy Girard.