Таны Web Images дэх JPG, GIF, PNG, SVG форматуудыг хэзээ хэрэглэх вэ?

Вэб хуудсанд олон тооны формат хэлбэрийг ашиглаж болно. Зарим нийтлэг жишээ бол GIF , JPG , болон PNG юм. SVG файлуудыг мөн өнөөдөр вэбсайтад ашигладаг бөгөөд веб дизайнерууд онлайн зураглал хийх өөр нэг боломж олгодог.

GIF зураг

Жижиг, тогтмол тооны өнгө бүхий зурагтай GIF файлуудыг ашигла. GIF файлууд нь үргэлж 256-аас цөөн өнгөөр ​​ялгагдахааргүй байна. GIF файлыг шахах алгоритм нь JPG файлуудаас бага төвөгтэй боловч хавтгай өнгөт зураг, текстийг ашиглахад маш жижиг хэмжээтэй файл үүсгэдэг.

GIF формат нь градиент өнгө бүхий гэрэл зургийн зураг эсвэл зургийг тохируулахад тохиромжгүй. GIF формат нь хязгаарлагдмал тооны өнгөтэй байдаг тул градиент болон гэрэл зураг нь GIF файлын хэлбэрээр хадгалагдсан үед татах ба пикселээр төгсөх болно.

Товчхондоо та GIF-ийг зөвхөн энгийн зурганд зориулж цөөн өнгөөр ​​хэрэглэж болох боловч PNG-г бас хэрэглэх боломжтой (энэ нь удахгүй).

JPG зураг

Олон сая өнгийг агуулсан гэрэл зураг болон бусад зургуудын хувьд JPG зураг ашиглах. Энэ нь комплексийн чанарыг алдахад жижиг график үүсгэх цогц комплекс алгоритмийг ашигладаг. Энэ нь "алдагдал" шахалт гэж нэрлэгддэг бөгөөд учир нь зураг шахагдсан үед зарим зургийн мэдээлэл алдагдсан байдаг.

JPG формат нь тексттэй, хатуу өнгөт том блок, энгийн хээтэй зургуудтай зурганд тохирохгүй. Учир нь зураг шахагдаж байх үед текст, өнгө, мөр нь өөр форматаар хадгалагдах хурц биш биш зургийг бий болгодог.

JPG зурагнууд нь маш олон өнгө, өнгөт зураг, зурганд хамгийн сайн ашиглагддаг.

PNG зураг

GIF форматыг GIF форматыг орлуулах байдлаар боловсруулсан бөгөөд энэ нь GIF зургийг ашигт малтмалын нөөц ашигласны төлбөр төлөх болно. PNG график нь GIF зургуудаас илүү шахалтын түвшинтэй байдаг бөгөөд GIF маягаар хадгалсан ижил файлаас бага хэмжээтэй зураг үүсгэдэг. PNG файл нь альфа ил тод байдлыг санал болгодог бөгөөд энэ нь танд ил тод, аль эсвэл альфа ил тод байдлыг ашиглаж байгаа зургуудынхаа хэсгийг агуулж чадна гэсэн үг юм. Жишээлбэл, уналт сүүдэр нь ил тод байдлын олон төрлийн нөлөөллүүдийг ашигладаг бөгөөд PNG-д тохирох нь тохиромжтой (эсвэл та зүгээр л бид CSS-ийн сүүдэрийг ашигласаар байх болно).

ГМС-ийн адил PNG зургууд нь гэрэл зургуудтай тохирохгүй байна. GIF файлууд жинхэнэ өнгөөр ​​хадгалагдсан зургуудад нөлөөлж буй асуудлыг шийдэх боломжтой. Гэхдээ энэ нь маш том дүр зургийг үүсгэх боломжтой. Папуа Шинэ Гвинейн зургууд нь хуучин гар утас, онцлог гар утасны дэмжлэгтэйгээр сайн ажилладаггүй.

Бид ил тод байдлыг шаарддаг аливаа файлд PNG ашигладаг. Бид мөн PNG-ийн оронд GIF гэж тохирох ямар ч файлын хувьд PNG-8-ийг ашигладаг.

SVG зураг

SVG нь Scalable Vector График гэсэн утгатай. JPG, GIF, болон PNG-д байдаг растер дээр суурилсан форматаас ялгаатай нь эдгээр файлууд нь векторуудыг файлын хэмжээг ихэсгэх чанаргүй алдагдахгүйгээр ямар ч хэмжээтэйгээр маш бага хэмжээгээр файлуудыг үүсгэж чаддаг. Эдгээр нь дүрс, лого гэх мэт дүрслэлд зориулагдсан.

Вэбийг хүргэх зорилгоор зураг бэлтгэх

Та ямар төрлийн зургийн хэлбэрээс үл хамааран, таны вэбсайт нь бүх хуудсууд дээр хэд хэдэн өөр өөр форматыг ашиглах нь зүйтэй. Тиймээс та сайтын бүх зургийг вэбээр дамжуулахад бэлтгэсэн байх ёстой . Маш том зургууд нь сайтыг удаан ажиллуулж, нийт гүйцэтгэлд нөлөөлнө. Үүнтэй тэмцэхийн тулд эдгээр зургуудыг чанарын өндөр түвшинд, хамгийн бага файлын хэмжээний тэнцвэрийг олохын тулд оновчтой байх ёстой .

Зөв зургийн форматыг сонгох нь тулааны нэг хэсэг боловч эдгээр файлуудыг бэлтгэх нь чухал ач холбогдолтой вэб дамжуулалтын үйл явцын дараагийн алхам юм.

Женнифер Кэрнин эх нийтлэл. Жереми Герард засварт хийсэн.