Երբ օգտագործեք JPG, GIF, PNG եւ SVG ձեւաչափերը ձեր վեբ պատկերների համար

Կան մի շարք պատկերների ձեւաչափեր, որոնք կարող են օգտագործվել վեբ էջերում: Որոշ ընդհանուր օրինակներ GIF , JPG եւ PNG են : SVG ֆայլերը նույնպես տարածված են այսօր նաեւ վեբ կայքերում, վեբ դիզայներներին այլ կերպ ներկայացնելու առցանց պատկեր:

GIF Նկարներ

Օգտագործեք GIF ֆայլեր պատկերների համար, որոնք ունեն փոքրիկ, ֆիքսված գույներով: GIF ֆայլերը միշտ կրճատվում են ոչ ավելի քան 256 յուրօրինակ գույներով: GIF ֆայլերի համար սեղմման ալգորիթմը ավելի քիչ բարդ է, քան JPG ֆայլերը, բայց երբ օգտագործվում է հարթ գունավոր պատկերների եւ տեքստում այն ​​արտադրում է շատ փոքր ֆայլի չափսեր :

GIF ձեւաչափը չի համապատասխանում պատկերային պատկերների կամ պատկերների գույնի պատկերներին: Քանի որ GIF ձեւաչափն ունի սահմանափակ թվով գույներ, գրադիենտներ եւ լուսանկարներ կավարտվեն բրենդինգի եւ pixelation- ի միջոցով, երբ պահվում է որպես GIF ֆայլ:

Կարճ ասած, GIF- ները կօգտագործեք միայն մի քանի գույներով ընդամենը պարզ պատկերների համար, բայց կարող եք նաեւ օգտագործել PNG- ները դրա համար (ավելի շուտ այդ մասին):

JPG պատկերներ

Օգտագործեք JPG պատկերներ լուսանկարներ եւ միլիոնավոր գույն ունեցող այլ պատկերներ: Այն օգտագործում է բարդ կոմպրեսիոն ալգորիթմ, որը թույլ է տալիս ստեղծել ավելի փոքր գրաֆիկա `կորցնելով որոշակի որակի պատկերը: Սա կոչվում է «վնասակար» սեղմում, քանի որ պատկերի որոշ տեղեկություններն իզուր են, երբ պատկերը սեղմվում է:

JPG ֆորմատը չի համապատասխանում տեքստի պատկերներին, պինդ գույնի խոշոր բլոկներին եւ փխրուն եզրեր ունեցող պարզ ձեւավորումներին: Դա այն է, որ այն պատճառով, որ պատկերը սեղմվում է, տեքստը, գույնը կամ գծերը կարող են խաթարել, արդյունքում պատկերն այնքան սուր չէ, որքան փրկվում է այլ ձեւաչափով:

JPG պատկերները լավագույնս օգտագործվում են լուսանկարներ եւ նկարներ, որոնք շատ են եւ շատ բնական գույներով:

PNG պատկերներ

PNG ձեւաչափը մշակվել է որպես GIF ձեւաչափի փոխարինում, երբ հայտնվեց, որ GIF պատկերները ենթակա են գանձման վճար: PNG գրաֆիկան ավելի լավ սեղմում է, քան GIF պատկերները, որոնք հանգեցնում են ավելի փոքր պատկերների, քան նույն ֆայլը, որը պահվում է որպես GIF: PNG ֆայլերը առաջարկում են ալֆա թափանցիկություն, ինչը նշանակում է, որ կարող եք ունենալ ձեր պատկերների ոլորտները, որոնք լիովին թափանցիկ են կամ նույնիսկ օգտագործում են մի շարք ալֆա թափանցիկություն: Օրինակ `կաթիլ ստվերում օգտագործում է մի շարք թափանցիկության ազդեցություն եւ հարմար կլինի PNG- ի համար (կամ պարզապես կարող եք վերջ տալ մեզ, օգտագործելով CSS ստվերները):

PNG- ի պատկերները, ինչպես GIF- ներ, չեն համապատասխանում լուսանկարներին: Հնարավոր է շրջանցել այն խնդիրը, որն ազդում է ճշգրիտ գույներով օգտագործված GIF ֆայլերի վրա պահված լուսանկարներով, բայց դա կարող է հանգեցնել մեծ պատկերների: PNG պատկերները նույնպես լավ չեն ապահովվում հին բջջային հեռախոսների եւ հնարավորությունների հեռախոսների կողմից:

Մենք օգտագործում ենք PNG- ի ցանկացած ֆայլի համար, որը պահանջում է թափանցիկություն: Մենք նաեւ օգտագործում ենք PNG-8 ցանկացած ֆայլի համար, որը հարմար է որպես GIF, օգտագործելով այս PNG ձեւաչափը:

SVG նկարներ

SVG- ն առաջարկում է լայնածավալ վեկտորային գրաֆիկ: Ի տարբերություն JPG- ի, GIF- ի եւ PNG- ի գրաֆիկական ձեւաչափերի, այդ ֆայլերը օգտագործում են վեկտորներ, ստեղծելու շատ փոքր ֆայլեր, որոնք կարող են մատչելի լինել ցանկացած չափի, առանց ֆայլի չափի բարձրացման որակի կորստի: Նրանք ստեղծվում են նկարազարդումների համար, ինչպես պատկերիկները եւ նույնիսկ լոգոները:

Պատկեր պատրաստելը վեբ առաքման համար

Անկախ այն բանից, թե որ ձեւաչափից եք օգտվում, եւ ձեր կայքը վստահ է, որ իր բոլոր էջերում օգտագործեք մի քանի տարբեր ձեւաչափեր, դուք պետք է ապահովեք, որ այդ կայքի բոլոր պատկերները պատրաստ են վեբ առաքման համար : Չափազանց մեծ պատկերներ կարող են առաջացնել կայքի դանդաղ եւ ազդել ընդհանուր կատարողականի վրա: Դրա դեմ պայքարելու համար այդ պատկերները պետք է օպտիմալացված լինեն, որակի որակի բարձր որակի եւ նվազագույն ֆայլի չափի միջեւ հավասարակշռությունը գտնվի:

Ընտրելով ճիշտ պատկերների ձեւաչափը ճակատագրի մի մասն է, այլեւ համոզվելով, որ դուք պատրաստել եք այդ ֆայլերը հաջորդ քայլն այս կարեւոր վեբ առաքման գործընթացում:

Իրական հոդվածը Ջենիֆեր Քրինինն է: Խմբագրված է Ջերեմի Գիրարդը: