Mae nifer o ffurfiau delwedd y gellir eu defnyddio ar dudalennau gwe. Dyma rai enghreifftiau cyffredin GIF , JPG , a PNG . Mae ffeiliau SVG hefyd yn cael eu defnyddio'n aml ar wefannau heddiw, gan roi dewis arall eto i ddylunwyr gwe ar gyfer delwedd ar-lein.
Delweddau GIF
Defnyddiwch ffeiliau GIF ar gyfer delweddau sydd â nifer fach, sefydlog o liwiau. Mae ffeiliau GIF bob amser yn cael eu lleihau i ddim mwy na 256 o liwiau unigryw. Mae'r algorithm cywasgu ar gyfer ffeiliau GIF yn llai cymhleth nag ar gyfer ffeiliau JPG, ond pan gaiff ei ddefnyddio ar ddelweddau lliw gwastad a thestun mae'n cynhyrchu meintiau ffeil bach iawn.
Nid yw'r fformat GIF yn addas ar gyfer delweddau ffotograffig na delweddau â lliwiau graddiant. Oherwydd bod nifer fformat o liwiau ar ffurf GIF, bydd graddiau a ffotograffau yn dod i ben gyda bandio a pixelation wrth eu cadw fel ffeil GIF.
Yn gryno, byddech yn defnyddio GIFs yn unig ar gyfer delweddau syml gyda dim ond ychydig o liwiau, ond gallech hefyd ddefnyddio PNGs ar gyfer hynny hefyd (mwy ar hynny yn fuan).
Delweddau JPG
Defnyddiwch ddelweddau JPG ar gyfer ffotograffau a delweddau eraill sydd â miliynau o liwiau. Mae'n defnyddio algorithm cywasgu cymhleth sy'n eich galluogi i greu graffeg llai trwy golli rhywfaint o ansawdd y ddelwedd. Gelwir hyn yn gywasgiad "colled" oherwydd bod peth o'r wybodaeth ddelwedd yn cael ei golli pan fydd y ddelwedd wedi'i gywasgu.
Nid yw'r fformat JPG yn addas ar gyfer delweddau gyda thestun, blociau mawr o liw solet, a siapiau syml gydag ymylon crisp. Y rheswm am hyn yw pan fydd y ddelwedd wedi'i gywasgu, efallai y bydd y testun, y lliw neu'r llinellau'n llithro gan arwain at ddelwedd nad yw mor sydyn ag y byddai'n cael ei gadw mewn fformat arall.
Defnyddir delweddau JPG orau ar gyfer ffotograffau a delweddau sydd â llawer iawn o liwiau naturiol.
Delweddau PNG
Datblygwyd fformat PNG yn lle'r fformat GIF pan ymddangosai y byddai delweddau GIF yn destun ffi breindal. Mae gan graffeg PNG gyfradd gywasgu gwell na delweddau GIF sy'n arwain at ddelweddau llai na'r un ffeil a arbedwyd fel GIF. Mae ffeiliau PNG yn cynnig tryloywder alfa, sy'n golygu y gallwch gael ardaloedd o'ch delweddau sydd naill ai'n gwbl dryloyw neu hyd yn oed yn defnyddio ystod o dryloywder alfa. Er enghraifft, mae cysgod galw heibio yn defnyddio ystod o effeithiau tryloywder a byddai'n addas ar gyfer PNG (neu fe allwch chi orffen i ni ddefnyddio cysgodion CSS yn lle hynny).
Nid yw delweddau PNG, fel GIFs, yn addas ar gyfer ffotograffau. Mae'n bosibl mynd o gwmpas y mater bandio sy'n effeithio ar ffotograffau a arbedwyd fel ffeiliau GIF gan ddefnyddio lliwiau cywir, ond gall hyn arwain at ddelweddau mawr iawn. Nid yw delweddau PNG hefyd yn cael eu cefnogi'n dda gan ffonau celloedd hŷn a ffonau nodwedd.
Rydym yn defnyddio PNG ar gyfer unrhyw ffeil sy'n gofyn am dryloywder. Rydym hefyd yn defnyddio PNG-8 ar gyfer unrhyw ffeil a fyddai'n addas fel GIF, gan ddefnyddio'r fformat PNG hwn yn lle hynny.
Delweddau SVG
Mae SVG yn sefyll ar gyfer Scalable Vector Graphic. Yn wahanol i'r fformatau sy'n seiliedig ar raster a geir yn JPG, GIF, a PNG, mae'r ffeiliau hyn yn defnyddio fectorau i greu ffeiliau bach iawn y gellir eu rendro ar unrhyw faint heb golli ansawdd y cynnydd yn y maint ffeil. Fe'u creir ar gyfer darluniau fel eiconau a hyd yn oed logos.
Paratoi Delweddau ar gyfer Cyflwyno'r We
Ni waeth pa fformat delwedd a ddefnyddiwch, a bod eich gwefan yn siŵr o ddefnyddio nifer o wahanol fformatau ar draws ei holl dudalennau, mae angen i chi sicrhau bod yr holl ddelweddau ar y wefan honno yn barod ar gyfer cyflwyno'r we . Gall delweddau rhy fawr achosi i safle redeg yn araf ac effeithio ar berfformiad cyffredinol. Er mwyn mynd i'r afael â hyn, rhaid optimeiddio'r delweddau hynny i ganfod y cydbwysedd rhwng ansawdd uchel a'r maint ffeil isaf posibl ar y lefel ansawdd hwnnw.
Mae dewis y fformat delweddau cywir yn rhan o'r frwydr, ond hefyd yn sicrhau eich bod wedi paratoi'r ffeiliau hynny yw'r cam nesaf yn y broses gyflwyno gwe bwysig hon.
Erthygl wreiddiol gan Jennifer Krynin. Golygwyd gan Jeremy Girard.