Reposting versi ke 2
Introduction
Menurut saya, diskusi seputar format image mana yang terbaik itu debat kusir absurb apabila tidak ditentukan terlebih dahulu dasar-dasar penilaiannya. Oleh karena itu, diskusi dikerucutkan pada format image mana yang paling baik digunakan untuk website dan hanya website. Jadi kita sama sekali tidak menyinggung image-editing.
Dengan begini, artikel ini bisa terfokus menjawab pertanyaan, yang juga merangkap tema posting ini: “Mana yang lebih baik gif, png, atau jpeg sebagai image dalam pembuatan website ?”
Perbandingan berdasar Tahun Pengembangan.
|
GIF |
JPEG |
PNG |
1980 |
1995 |
Mengapa Perlu Memilih ?
Alasan utama dibalik mengapa kita harus memilih format image yang tepat ialah dikarenakan pemilihan tsb akan mempengaruhi kecepatan loading web. Semakin kecil pernik ukuran image yg harus ditampilkan maka semakin cepat browser menampilkan web kita. Mereka yg berkunjung pun senang tak harus menunggu lama.
Perlu diingat, manajemen image yang buruk bisa membuat sebuah website itu lemot, nge-hang, ataupun menghasilkan error impoten 500.
Pengantar singkat
|
GIF ( Graphics Interchange Format) |
JPEG () |
PNG (Portable Network Graphics) |
|
Gif itu bagus untuk website. Kombinasi warna yg tersedia sebanyak 256 warna. Jumlah kombinasi ini cukup membuatnya dipakai bagi keperluan grafis apapun, tentu saja dgn mengecualian keperluan photografi. Kamu bisa memakainya sebagai icon, favicon, logo, line grafis, ataupun image2 tombol. Gif juga bisa dianimasikan. Sebenarnya tersedia pilihan format lain seperti flash atau format animasi berbasis vektor. Akan tetapi format2 itu biasanya lebih konsumtif-bandwidth. So, membuatnya menjadi pilihan kosmetik yg mahal krn berat dan tidak search engine friendly. Gif mempunyai kemampuan mengkompres area2 gambar sewarna. Dengan kemampuan ini, banyak item2 grafis website bisa didesain dgn ukuran sekecil mungkin. Metode yang paling umum mereduksi ukuran file GIF ialah dengan mereduksi jumlah warna dalam palettle. Perlu digaris-bawahi, GIF telah menggunakan skema kompresi internal LZW. Skema ini bisa membuat gambar berukuran sekecil mungkin tanpa kehilangan data penting apapun. Sy tidak tau pasti bagaimana algoritma LZW ini bekerja *belum tapi data-data tsb mempresentasikan kualitas input image sebelum dikompersi ke format Gif. |
Format ini bener2 didesain memanjakan forograper. Format ini bisa mensupport sampai 16.7 juta warna. Jumlah tersebut cukup untuk keperluan apapun bahkan pencitraan warna yg tidak bisa dicerna mata manusia. Selain jumlah kombinasi warna, perbedaan jpg dgn gif itu terletak pada algoritma kompresi. Berbeda dengan gif, algoritma kompresi jpeg bekerja dengan meresonansi informasi2 image keluar. Dan tergantung seting yg diberikan, informasi tsb bisa dan bisa tidak dapat dicerna mata. Perlu diingat, apabila kamu mensave image sementara kualitas imagenya telah berubah maka beserta munculnya output image baru, kamu juga akan kehilangan informasi yg dikandung image original sebelumnya. So, berhati-hatilah. Sebelum melakukan apapun, simpan image originalnya terlebih dahulu. |
PNG merupakan format image terbaru. PNG dikembangkan pada tahun 1995. Tujuan pengembangannya ialah demi mengatasi batasan-batasan gif. Png didesain dengan feature2 utama gif, termasuk streaming dan format file progressive. Namun dibanding gif, png menyediakan kedalaman warna yg lebih baik, mampu melayani konversi image sampe kombinasi warna 24 bit. PNG tidak mempunya isu lisensi paten, berbeda dengan format lainnya. Oleh karena itu, diharapkan penggunaanPNG akan tersebar-luas di kemudian hari, meskipun diyakini tidak akan benar2 menggantikan gif. |
Feature Gif
Ada 2 feature Gif yg menarik perhatian, yaitu transparency dan interlacing.
Transparency
Gif mendukung transparency sehingga designer dapat mendesign background sebuah image itu transparan. Artinya, bila kamu meletakkan image yang transparan pada sebuah latar berwarna merah maka warna background image akan memimic seperti bunglon dan ikut berubah menjadi merah.
Interlacing
Interlacing itu akan menciptakan ilusi seolah image gif itu lebih cepat loadingnya. Sebenarnya image ditampilkan browser dalam beberapa langkah sistemastis. Mulanya blur dan chaotis namun seiring lebih banyak informasi yang didownload dari server, maka image pun akan menjadi lebih dan lebih dan lebih jelas. Perlu dipertimbangkan, image yang sedikit ber-interlacing akan berukuran lebih besar dibandingkan file gif biasa.
Kapankah Gif sebaiknya dipakai ?
- Umumnya, image GIF digunakan untuk logo, line drawing, dan icons.
- Hindari menggunakannya untuk image photograpi, dan juga image yg membutuhkan stretches bertone-yg-konitium
- Saat kamu mendesign file gif, hindari penggunaan gradiens
- Jangan pakai anti-aliasing agar ukuran file bisa minimal.
Apa itu JPEG Progressive ?
File jpeg manapun dapat disimpan sebagai jpeg progresif. Format ini mirip dengan gif yg berfeature interlacing. Dan sebagaimana gif, mula2 browser akan menampilkan image berkualitas rendah bagi pengunjung web dan kemudian perlahan meningkatkan kualitasnya sesuai aslinya.
Kapankah Jpeg sebaiknya dipakai ?
- Dipakai sebagai image hasil fotograpi
- Dipakai bagi image2 yg melebihi 256 kombinasi warna.
PNG Format
Menurut Rumahweb, PNG mempunyai tiga kelebihan dari pada GIF:
- Alpha channels (variable transparency)
- Cross-platfrom gamma correction (control untuk ketajaman/brightnes gambar) dan color correction two-dimension interlancing( metode untuk progresif display).
- PNG juga mengompres lebih baik dari GIF sekitar 5% sampai 25%
Kesimpulan & Kontra
|
Kesimpulan |
Kontra & Some says |
|
Gif and jpeg merupakan format grafik internet paling utama. Sementara penggunaan PNG, sebagaimana diproyeksikan, mulai sedikit2 menggantikan keduanya. Namun format manakah yg paling baik dipergunakan — saat ini — dalam pembuatan website? berdasar prinsip efisiensi, dengan yakin sy jawab : gif. Kualitas image dan efisiensi bisa seiring sejalan. |
sayangnya, format PNG belum betul2 disupport oleh Internet Explorer, hehehe (Mar 26, 10:12 PM, eepinside.com) Go Sebenarnya bukan belum di SUPPORT mas, akan tetapi jika gambar PNG tersebut terdapat TRANSPARANSI yang mana itu belum di support sama IE6 kebawah, tapi kelemahan ini bisa di akali dengan sedikit javascript. (Mar 27, 10:20 AM, nurudin.jauhari.net) Go menurut ku sih, PNG, karena Wikipedia menggunakan PNG dan ketika saya download, size filenya gak gede dan qualitas gambar pun bagus…Kalo gif sih ambil hikmah animasi nya aja hehe…kalo jpeg, buat background hoho…(opini gw) (Apr 1, 12:46 PM, densscessario.wordpress.com) Go |
Pertanyaan yg belum terjawab
- Mengapa jpg, png, dan gif akan menghasilkan ukuran file yang berbeda padahal sumber imagenya sama ?
- Apakah kualitas output hasil konversi image pd format2 yg berbeda itu sama ?
Referensi
Catatan versi
-
Posting versi 1 terbit pd tgl 26 maret 2008.
-
Posting versi 2 terbit pd tgl
Survey Redaksi : Apakah posting ini terlalu berat dan berbau IT ? Sy sedang survey sekaligus belajar menulis topik semacam ini sambil berusaha membuatnya tetep informatif bagi semua orang. Cara menjawab paling sederhana adalah dgn memberitahu sy pd paragraph berapa kamu mulai bosan dan melompat ke bagian box komentar....plus penjelasan singkat kalau bisa.... :)
Aku adalah binatang sundal
Dari kumpulannya jualan sandal
Walau utang mengejarngejarku
Tetap takkan kugadaikan keperjakaanku
Aku akan ganteng seribu tahun lagi
August 17th, 2008 14:58
[...] sy membaca posting Gif vs JPEG vs PNG, dan kemudian bingung sendiri dengan layout posting tsb. Topik posting in sebenarnya topik yg [...]