Mungkin agak ketinggalan jika saya klaim artikel ini sebagai artikel baru. Sudah begitu banyak pembahasan mengenai topik ini di internet, tapi karena ada permintaan “khusus” dari Mas Rusdi di Depok, saya relakan untuk memposting di web4profit ini....heheheh. Artikel ini sebenarnya merupakan bagian dari eBook yang sedang saya susun ..... mudah-mudahan tidak terlalu teknis dan masih bisa tetap bermanfaat bagi pengunjung lain ....
Nah, coba anda ingat-ingat, jika anda membuat foto dengan kamera digital (menggunakan perangkat kamera, handphone, atau laptop yang ada kameranya) dan menyimpannya dalam suatu file ..... apa kira-kira format dari image file foto tersebut ? Jika anda perhatikan ekstensi file-nya, biasanya anda akan dapatkan teks “.gif” atau “.jpg” dibelakang nama file foto anda. Jika anda membuat fotonya melalui kamera di laptop, pada saat anda akan save, biasanya akan ditanya “dengan format apa file tersebut ingin di-save; GIF, JPEG(JPG), PNG, ....atau lainnya?”.
Nah, coba anda ingat-ingat, jika anda membuat foto dengan kamera digital (menggunakan perangkat kamera, handphone, atau laptop yang ada kameranya) dan menyimpannya dalam suatu file ..... apa kira-kira format dari image file foto tersebut ? Jika anda perhatikan ekstensi file-nya, biasanya anda akan dapatkan teks “.gif” atau “.jpg” dibelakang nama file foto anda. Jika anda membuat fotonya melalui kamera di laptop, pada saat anda akan save, biasanya akan ditanya “dengan format apa file tersebut ingin di-save; GIF, JPEG(JPG), PNG, ....atau lainnya?”.
Secara teknis, suatu gambar atau foto digital dapat di-save dengan beberapa jenis format image. Format yang paling umum digunakan adalah GIF (.gif), JPEG (.jpg atau .jpeg), TIFF (.tiff), RAW (.raw), dan PNG (.png), walau pun masih banyak yang lain. Masing-masing mempunyai kelebihan dan kekurangan sendiri-sendiri....... nah, untuk kesempatan ini saya akan coba membahas 3 format terpopuler saja ya.... , yaitu : GIF, JPEG, dan PNG.
GIF (Graphics Interchange Format )
Jika kita perhatikan, hampir kebanyakan image berwarna dan background dari website adalah file-file dengan format GIF. Format ini memang sangat ideal untuk image grafis yang hanya menggunakan beberapa warna saja, dan tipe format ini pernah menjadi sangat populer untuk foto-foto berwarna online. Namun karena image GIF maksimum hanya bisa ditampilkan dengan kombinasi sampai 256 warna saja (8 bit per pixel), ini menjadi batasan pada saat ini, dan sebagai alternatifnya terjadi pergeseran ke format JPEG atau PNG yang dapat menampilkan image sampai dengan kombinasi jutaan warna, sehingga dapat menampilkan foto lebih sesuai dengan aslinya. Akibat dari keterbatasan ini, format GIF saat ini lebih banyak digunakan untuk aplikasi pembuatan image-image yang sederhana seperti grafik (line drawing), logo atau icon yang umumnya menggunakan warna yang solid.
Jika dilihat dari sejarahnya, GIF dikembangkan oleh CompuServe pada tahun 1987, dengan nama GIF87, kemudian dikembangkan lagi fitur-fiturnya sehingga mampu menghasilkan gambar yang bersifat transparan (transparency), interlacing, dan animasi (animation) pada versi GIF89a, dan inilah yang kita kenal sebagai GIF sekarang.
Apa sih yang dimaksud fitur transparan ? Ini merupakan fitur yang memungkinkan anda membuat background web dengan image yang transparan, artinya jika anda menempatkan suatu obyek image dengan format GIF transparan pada sel tabel biru, maka warna background dari image tersebut akan ikut menjadi biru.
Bagaimana dengan interlacing ? Ini merupakan fitur GIF yang lebih advanced. Dengan fitur ini akan dihasilkan kesan atau ilusi seakan-akan proses loading suatu image GIF dapat berjalan dengan cepat. Caranya ? Pada saat loading, image akan ditampilkan oleh browser secara bertahap (interlacing); pada tahap awal ditampilkan secara sama-samar dan blur –tapi sudah terlihat ada bentuk obyeknya- dan semakin lama proses download berjalan akan semakin banyak informasi yang diterima dari servernya, hasilnya tampilan image juga akan semakin sempurna dan sempurna, sampai akhirnya download selesai. Oh ya, fitur interlacing hanya bisa dirasakan jika browser yang digunakan juga mendukung untuk fitur ini, jika tidak maka kesan tersebut tidak akan dirasakan. Dan untuk diketahui, bahwa file GIF yang menggunakan fitur interlacing ini akan mempunyai ukuran file yang sedikit lebih besar dibanding tanpa interlacing, sehingga perlu dipertimbangkan penggunaannya.
Selanjutnya mengenai fitur animasi ...... jika ditinjau dari katanya, animasi, adalah merupakan kumpulan dari image statis yang digabungkan bersama dan ditampilkan secara berurutan sehingga dapat memberi penampilan bergerak. Jadi yang dimaksud dengan fitur animasi pada format GIF adalah bahwa dengan format GIF kita dapat menghasilkan image dengan efek animasi. Cuma harus diingat bahwa dengan fitur animasi ini, ukuran file menjadi sangat besar dan efek langsungnya jelas dong, boros bandwidth.
Ok, untuk melengkapi silahkan amati contoh image GIF animasi berikut:
Ternyata cukup menarik kan !!!
Oh ya, sebagai info tambahan, image-image dengan format GIF merupakan file yang dikompresi dengan menggunakan teknik kompresi data “lossless” LZW (Lempel-Ziv-Welch), tujuannya adalah untuk mengurangi ukuran file tanpa mendegradasi kualitas visualnya. Pada kompresi yang bersifat lossless, tidak ada informasi yang hilang selama proses kompresinya. Teknik LZW mampu mengkompres area-area gambar atau image sewarna, sehingga image dapat didesain atau dikompres samapi dengan ukuran sekecil mungkin tanpa kehilangan data atau informasinya, hasilnya; kualitas gambar tetap terjaga.
Tip untuk GIF: Jika anda mendesain file-file GIF, hindari menggunakan gradient dan disable-kan anti aliasing, hal ini dapat meminimisasi ukuran file.
Tip untuk GIF: Jika anda mendesain file-file GIF, hindari menggunakan gradient dan disable-kan anti aliasing, hal ini dapat meminimisasi ukuran file.
JPEG (Joint Photographic Experts Group)
Nama JPEG yang merupakan kependekan dari Joint Photographic Experts Group adalah nama dari komite yang membuat standar JPEG ini. Group ini membentuk organisasi pada tahun 1986 dan mengeluarkan standar JPEG pada tahun 1992.
File-file dengan format JPEG merupakan file yang dapat menghasilkan image yang kaya akan warna, format ini dapat mendukung sampai 16,7 juta warna, sehingga sangat baik untuk digunakan pada aplikasi pembuatan image-image fotografi.
Seperti format GIF, format JPEG juga menggunakan sistem kompresi , tapi algoritmanya berbeda ; jauh lebih kompleks dan bersifat “lossy”. Aktualnya, algoritma kompresi JPEG berbasis pada konsep DCT (Discrete Cosine Transform) yang diikuti pengkodean Huffman yang merupakan transformasi matematikal mirip dengan algoritma yang sekarang digunakan untuk gambar bergerak, video DVD, dan audio MP3. Standar kompresi pada JPEG ini menspesifikasikan baik proses kompresi mau pun dekompresi-nya. Pada proses kompresi, image akan dikompres menjadi suatu deretan (stream) byte data dan kemudian dilakukan proses dekompresi untuk mengembalikan menjadi image. Algoritma ini telah terbukti memberikan hasil terbaik untuk fotografi dan lukisan-lukisan pemandangan realistik dengan variasi degradasi warna yang halus. Kompresi pada JPEG juga menghasilkan file-file dengan ukuran yang lebih kecil dibanding hasil kompresi pada GIF, sehingga dapat di download dengan waktu lebih cepat.
Contoh, image yang di-save dengan GIF dan JPEG :
GIF (47 KB) JPEG (26 KB)
Image di atas adalah suatu obyek yang sama tapi saya save dengan format GIF dan JPEG. Untuk kualitas yang "sepintas" sama ini, file GIF mempunyai ukuran 47 KB, sedangkan dengan JPEG hanya 26 KB. Cukup jauh ya ternyata perbedaannya !!
Namun di sisi lain, JPEG bukan pilihan yang tepat untuk digunakan pada desain-desain obyek seperti gambar grafis, tekstual, dan icon, karena kontras yang tajam yang dihasilkan antar pixel yang berdekatan akan menyebabkan kesan kurang halus. JPEG juga bukan pilihan yang tepat untuk file-file yang akan mengalami peng-editan berulang. Ini disebabkan karena proses kompresi pada JPEG bersifat “lossy”, artinya pada setiap proses kompres-dekompres akan ada informasi image asli yang hilang (terbuang) dan tidak dapat disimpan, khususnya apabila ada proses “crop” atau “shift” dari image. Sebenarnya informasi yang dihilangkan adalah yang tidak terlalu peka dapat dideteksi mata manusia, tetapi karena proses modifikasinyanya berulang maka akan semakin banyak informasi yang hilang, dan ini akan menyebabkan menurunnya kejernihan dan ketajaman image. Untuk mengatasi kelemahan ini, para desainer biasanya menggunakan format PNG sebagai alat untuk save sementara file-file fotografi-nya. Pengeditan dilakukan pada format PNG, setelah pengeditan selesai, baru di-save kembali sebagai file JPEG. Proses seperti ini dapat mengurangi terjadinya kehilangan informasi.
Hal lain yang perlu anda ketahui adalah, JPEG tidak mempunyai fitur transparan, jadi jika ingin mendesain obyek image dengan transparansi anda harus menggunakan format GIF atau PNG.
Berikut diperlihatkan contoh dari image JPEG yang mengalami degradasi kualitas akibat proses kompresi beberapa kali :
image awal (34 KB) setelah ada kompresi (11 KB)
Pada contoh di atas, gambar kiri memperlihatkan image awal dengan ukuran file 34 KB dan akibat proses re-size yang saya lakukan maka terjadi kompresi dimana ukuran file hanya tinggal 11 KB. Namun kompresi ini dibarengi dengan hilangnya informasi yang menyebabkan terjadinya degradasi kualitas image, hasilnya seperti diperlihatkan pada image sebelah kanan.
Tip untuk JPEG: Perlu anda ketahui bahwa jika anda merubah atau mengkonversi suatu file ke format JPEG, ini akan berarti menurunkan kualitas terhadap image aslinya. Karena itu selalu simpan file image originalnya.
PNG (Portable Network Graphics)
PNG merupakan standar format image terbaru, tapi sudah sangat luas digunakan pada aplikasi website. Format PNG dikembangkan tahun 1995 dengan tujuan untuk merespon dua masalah utama yang ada pada GIF. Yang pertama, adanya pengumuman dari Unisys dan Compuserve sendiri yang menginformasikan bahwa software yang mengimplementasikan format image GIF merupakan subyek dari royalti, berbasis paten algoritma LZW yang dimiliki oleh Unisys, yang memang digunakan pada format GIF. Artinya, secara teknis GIF tidak “free” untuk digunakan, terutama sampai masa paten-nya (dipatenkan di Amerika) habis pada tahun 2003. Yang kedua, adalah mengatasi masalah keterbatasan warna yang dapat dihasilkan format GIF.
Untuk masalah warna, wow …. jangan kaget! PNG dapat menghasilkan image dengan kedalaman warna yang jauh lebih baik karena image dapat dibangun dengan kombinasi sampai 24 bit per pixelnya. Dapat dibayangkan ya, berapa besar kombinasi warna yang dapat ditampilkan !!
Untuk masalah warna, wow …. jangan kaget! PNG dapat menghasilkan image dengan kedalaman warna yang jauh lebih baik karena image dapat dibangun dengan kombinasi sampai 24 bit per pixelnya. Dapat dibayangkan ya, berapa besar kombinasi warna yang dapat ditampilkan !!
Secara umum, memang PNG dikembangkan untuk mengatasi keterbatasan-keterbatasan pada GIF, hanya saja PNG tidak mendukung fitur animasi seperti yang dimiliki GIF.
Untuk fitur transparansi, PNG dilengkapi dengan fasilitas “Alpha Transparency” yang menggunakan 8 bit kanal transparansi sehingga image-image dapat saling ditumpuk dengan kesan transparan yang lebih baik dibanding pada GIF, khususnya untuk image-image yang mempunyai “anti aliasing”. Dengan konsep alpha transparency, derajat transparansi pada PNG juga dapat dikontrol, yaitu dengan apa yang kita kenal sebagai “opacity”.
Mengenai transparansi Alpha pada format PNG ini, nanti akan saya bahas tersendiri berikut dengan contoh-contohnya, jadi ditunggu saja dulu ya bahasan detilnya
.
Untuk fitur transparansi, PNG dilengkapi dengan fasilitas “Alpha Transparency” yang menggunakan 8 bit kanal transparansi sehingga image-image dapat saling ditumpuk dengan kesan transparan yang lebih baik dibanding pada GIF, khususnya untuk image-image yang mempunyai “anti aliasing”. Dengan konsep alpha transparency, derajat transparansi pada PNG juga dapat dikontrol, yaitu dengan apa yang kita kenal sebagai “opacity”.
Mengenai transparansi Alpha pada format PNG ini, nanti akan saya bahas tersendiri berikut dengan contoh-contohnya, jadi ditunggu saja dulu ya bahasan detilnya
.
Untuk urusan kompresi, PNG menerapkan kompresi data lossless dengan algoritma kompresi yang jauh lebih efisien dibanding GIF dan tentunya juga bebas paten. PNG menggunakan suatu proses kompresi 2 tingkat, yaitu pre-kompresi untuk filterisasi (prediksi) dan kompresi dengan teknik yang diberi nama DEFLATE. Algoritma kompresi pada PNG ini mampu menyimpan data format image lebih banyak dan dilengkapi fitur error-checking untuk mengontrol ketajaman (brightness) gambar dan koreksi warna. Dan yang juga penting, dengan kompresi lossless ini, proses saving, restoring dan re-saving suatu image dengan format PNG tidak akan menurunkan derajat kualitasnya. Dari data yang didapat, proses save suatu image GIF dan PNG yang identik, akan menghasilkan file PNG yang ukurannya 5 sampai 20 % lebih kecil dari file GIF.
Dari bahasan yang sudah saya sampaikan, maka menjawab pertanyaan Mas Rusdi, berikut saya coba simpulkan beberapa hal yang terkait untuk penggunaan apa format GIF, JPEG, dan PNG itu :GIF :
- Format ini umumnya digunakan untuk membuat image gambar grafis, logo, dan icon, dengan jumlah kombinasi warna terbatas (di bawah 256) atau warna solid.
- Format GIF juga cukup baik untuk membuat file-file image animasi sederhana (untuk banner flash, icon animasi, dll.).
- Untuk membuat image/gambar sampai ukuran cukup kecil dengan ketajaman yang tetap baik.
JPEG (JPG) :
- Format ini umumnya digunakan untuk membuat image hasil fotografi, terutama untuk image dengan lebih dari 256 kombinasi warna.
- Cocok untuk desain image yang memiliki gradien, misalnya perubahan warna yang perlahan-lahan dari merah ke biru dan seterusnya.
PNG :
- Format ini akan baik digunakan untuk membuat image gambar baik grafis, logo, icon atau lainnya yang memerlukan lebih dari 256 kombinasi warna, kepresisian warna dan ketajaman gambar yang tinggi, serta fading yang rendah.
- Format PNG sangat tepat untuk mendesain image-image yang memerlukan fitur transparansi.
- Format PNG sangat tepat untuk image-image yang masih akan diedit ulang tanpa menurunkan kualitas.
Perhatikan image 3 apel dibawah ini yang saya save dengan format GIF, JPEG, dan PGN :
GIF JPEG PNG
Yang mana menurut anda yang paling bagus ? Hehehe ….. jangan salahkan mata anda lho jika tidak bisa melihat perbedaannya ……. Lakukan zoom-in dan zoom-out terhadap ketiga image tersebut, silahkan cek perbedaannya. Kemudian perhatikan ukuran file-nya, kira-kira format image mana yang akan anda pilih jika anda mementingkan kecepatan loading? Silahkan anda analisa sendiri ya untuk pertimbangan lebih lanjutnya.
Sebagai penutup, berikut saya tambahkan beberapa informasi lebih lanjut mengenai GIF, JPEG, dan PNG :
- Pada saat ini, ketiga format tersebut sudah distandarisasi. Ketiga standar tersebut terbuka dan tersedia untuk digunakan oleh setiap orang. JPEG dan PNG sudah lebih jauh lagi: JPEG sudah merupakan suatu standar ISO dan PNG adalah standar IETF RFC serta rekomendasi W3C.
- Ketiga format menggunakan konsep kompresi. File-file GIF dikompresi sekitar 5:1, file JPEG 10:1 atau 20:1, dan file PNG sekitar 7:1.
- Hampir semua browser web saat ini sudah mendukung ketiga format tersebut, terutama GIF dan JPEG. Untuk PNG, boleh dikatakan sudah didukung oleh 99%.
Ok. Saya rasa cukup ya buat Mas Rusdi dan juga pengunjung lain ….. semoga informasi ini tetap dapat bermanfaat.
