Tidak ada satu angka yang bisa disebut sebagai ukuran foto yang ideal untuk web. Yang menentukan adalah seberapa besar foto itu ditampilkan di halaman, dan pada layar dengan kerapatan piksel berapa. Foto yang ditampilkan pada ukuran setengah dari dimensi aslinya tidak perlu menyimpan seluruh piksel aslinya, karena piksel berlebih itu tidak terlihat dan hanya menambah berat halaman. Jadi ukuran ideal dihitung dari ukuran tampilnya, bukan dari angka KB yang berlaku untuk semua situs.
Cara paling sederhana: tentukan lebar tampil foto di halaman dalam piksel, lalu sediakan berkas dengan lebar minimal sebesar itu. Kalau foto akan ditampilkan pada ukuran yang lebih kecil daripada dimensi aslinya, memperkecil dimensi sesuai kebutuhan adalah langkah yang tepat. Contoh yang terverifikasi: persen 50 pada gambar 1600x1200 menghasilkan 800x600. Untuk gambar yang hanya muncul kecil, misalnya thumbnail, tidak ada gunanya menyimpan piksel sebanyak foto utama.
Ukuran berkas sendiri ditentukan tiga hal: dimensi piksel, tingkat pemadatan, dan tingkat detail gambar. Dari ketiganya, dimensi adalah yang paling berpengaruh dan paling mudah dikendalikan. Foto berisi detail halus seperti dedaunan atau tekstur kain tidak bisa dipadatkan sebanyak tangkapan layar berisi bidang warna rata, sehingga dua gambar dengan dimensi sama bisa berakhir dengan ukuran berkas yang jauh berbeda.
Menghitung dari ukuran tampil
Langkah pertama adalah mengukur. Buka halaman tempat foto akan dipasang, dan perhatikan seberapa lebar ruang yang tersedia untuk foto itu. Pada tema yang sudah jadi, ukuran ini biasanya sudah ditentukan oleh tata letaknya, misalnya lebar penuh kolom konten atau setengah kolom.
Langkah kedua adalah menyiapkan versi yang sesuai. Kalau foto akan ditampilkan lebih kecil daripada dimensi aslinya, perkecil dimensinya sesuai kebutuhan tampil itu. Kalau foto yang sama juga dipakai di halaman lain dengan ukuran lebih besar, siapkan dua versi daripada memakai satu berkas besar untuk semua tempat.
Langkah ketiga adalah menyesuaikan dengan layar berkerapatan tinggi. Layar ponsel dan laptop modern bisa menampilkan beberapa piksel fisik untuk satu piksel tata letak. Kalau foto terlihat kurang tajam di layar seperti itu, sediakan versi dengan lebar dua kali ukuran tampilnya. Ini pilihan, bukan keharusan: kalau foto hanya sebagai pelengkap, versi satu kali sudah cukup.
Yang perlu dihindari adalah mengunggah foto jauh lebih besar dari kebutuhan lalu berharap peramban mengecilkannya. Peramban memang bisa mengecilkan tampilan, tetapi berkas yang diunduh tetap besar. Pengunjung tetap membayar beratnya dalam bentuk waktu muat dan kuota.
Memilih format sesuai isi gambar
Format menentukan seberapa efisien foto disimpan, dan pilihannya mengikuti isi gambar. Untuk foto, JPG dan WebP sama-sama cocok karena keduanya memakai kompresi yang memangkas ukuran berkas. WebP menghasilkan berkas paling kecil pada mutu yang sama, sedangkan JPG paling luas diterima aplikasi dan sistem. Kelemahan WebP: belum semua aplikasi bisa membukanya, jadi untuk berkas yang akan diunggah ke sistem lama, JPG lebih aman.
Untuk tangkapan layar, logo, dan grafik bergaris tajam, PNG lebih tepat. PNG menyimpan gambar tanpa membuang detail, menjaga ketajaman garis dan huruf, serta menyimpan latar tembus pandang. Ukurannya lebih besar untuk foto, tetapi untuk gambar bergaris tajam perbedaannya tidak sebesar pada foto. Kalau ukuran berkas lebih penting daripada ketajaman mutlak, PNG bisa diubah ke WebP lewat Konversi Format Gambar.
Satu hal yang sering salah dipahami: mengubah JPG ke PNG tidak menaikkan mutunya. Mutu yang hilang saat foto disimpan sebagai JPG tidak bisa dikembalikan. Konversi ke PNG hanya menghentikan penurunan mutu pada penyimpanan berikutnya.
Menyusutkan foto agar sesuai
Setelah ukuran tampil dan format ditentukan, langkah berikutnya adalah menyusutkan berkas. Buka Kompres Foto, lalu pilih tool sesuai format: Kompres JPG, Kompres PNG, atau Kompres WebP.
Ukuran akhir dipilih lewat chip di pratinjau, dan angkanya terlihat sebelum Anda mengunduh. Ukuran persen tersedia dari 10 sampai 200 persen, dan bisa dipakai untuk JPG, PNG, maupun WebP. Contoh yang terverifikasi: persen 50 pada gambar 1600x1200 menghasilkan 800x600. Angka itu pas untuk banyak keperluan web, tetapi periksa dulu ukuran tampil yang Anda butuhkan sebelum memilih persennya.
Untuk foto, JPG dan WebP bisa diturunkan mutunya. Penurunan itu yang membuat berkasnya mengecil, dan semakin kecil ukuran akhir yang dipilih, semakin banyak detail yang dibuang. Untuk PNG, tidak ada pengaturan mutu manual: PNG dipadatkan dengan merapikan struktur datanya dan menyederhanakan paletnya, dengan mutu yang dijaga, dan latar transparannya tetap utuh.
Saat berkas ditulis ulang, EXIF dan GPS terhapus. Untuk foto yang dipublikasikan di web, hilangnya metadata itu justru menguntungkan, karena koordinat tempat foto diambil tidak ikut tersebar. Kalau metadata harus dipertahankan, jangan pakai tool ini dan simpan berkas aslinya.
Urutan kerja yang disarankan
Mulai dari berkas asli beresolusi tinggi. Tentukan ukuran tampil foto di halaman, lalu perkecil dimensinya sesuai kebutuhan. Setelah dimensinya benar, pilih format yang sesuai dengan isi gambar. Terakhir, turunkan mutu kalau formatnya mendukung, lalu periksa hasilnya.
Urutan ini penting karena memperkecil dimensi lebih dulu membuat penurunan mutu berikutnya bekerja pada gambar yang sudah berukuran pas. Kalau urutannya dibalik, Anda menurunkan mutu pada gambar besar, lalu membuang sebagian besar hasilnya saat mengecilkan dimensi.
Jangan mengompres berkali-kali. Setiap kompresi yang membuang detail menurunkan mutu sedikit, dan mutu itu tidak kembali. Kalau hasil pertama masih terlalu besar, ulangi dari berkas asli dengan ukuran yang lebih kecil.
Kalau foto akan disusun menjadi satu halaman atau dokumen, misalnya untuk katalog atau lampiran, lanjutkan ke JPG ke PDF. Satu gambar menjadi satu halaman, dan setiap foto diposisikan proporsional di tengah halaman A4 dengan margin 20 mm.
Cara memeriksa hasilnya
Periksa tiga hal setelah proses selesai. Pertama, dimensinya, dan pastikan tidak lebih kecil dari ukuran tampil yang dibutuhkan. Kedua, ukuran berkasnya, dan bandingkan dengan versi sebelumnya. Ketiga, tampilannya, dengan membuka hasilnya dan memperbesar bagian yang berisi teks atau detail halus.
Untuk gambar di web, periksa juga tampilannya di layar ponsel. Foto yang tajam di layar komputer bisa terlihat berbeda di layar ponsel, terutama kalau ukurannya dipaksa memenuhi lebar layar. Kalau foto menjadi bagian utama halaman, sediakan versi yang cukup tajam untuk layar berkerapatan tinggi.
Simpan berkas aslinya sebelum menimpa. Hasil kompresi yang membuang detail tidak bisa dikembalikan, dan berkas asli adalah satu-satunya jalan untuk mengulang kalau ternyata hasilnya terlalu kecil atau terlalu halus.
Kapan ukuran besar tidak masalah
Kalau foto tidak akan diakses lewat jaringan, misalnya disimpan di komputer sendiri atau dicetak, ukuran berkas bukan pertimbangan utama. Yang penting adalah resolusinya cukup untuk keperluan itu. Gambar yang dicetak besar memerlukan piksel lebih banyak daripada gambar yang hanya ditampilkan di layar.
Kalau foto diakses lewat jaringan lokal yang cepat, batas ukuran tetap ada tetapi tekanannya lebih ringan. Yang paling terasa adalah pengunjung dari jaringan seluler, karena merekalah yang paling dirugikan oleh berkas besar.
Kalau foto hanya satu di halaman yang seluruhnya ringan, menyusutkannya tidak mendesak. Kompresi baru diperlukan ketika ada batas dari pihak lain, ketika halaman memuat banyak gambar, atau ketika ukurannya memperlambat pemuatan.
Pertanyaan yang sering muncul
Apakah ada ukuran KB yang berlaku untuk semua foto web? Tidak. Ukuran yang tepat bergantung pada dimensi tampil, format, dan isi gambarnya. Yang bisa dijadikan patokan adalah dimensi pikselnya, bukan angka KB tunggal.
Apakah foto harus selalu dikecilkan sebelum diunggah? Tidak selalu. Kalau foto sudah berukuran wajar untuk tempat pemakaiannya, tidak ada yang perlu diubah. Mengecilkan foto yang sudah sesuai hanya menurunkan mutunya tanpa manfaat.
Format mana yang paling ringan untuk web? Pada mutu yang sama, WebP menghasilkan berkas paling kecil. Kalau sistem tujuan tidak mendukung WebP, JPG untuk foto dan PNG untuk tangkapan layar adalah pilihan yang aman.
Apakah menghapus metadata membuat foto lebih ringan? Sedikit, dan itu bukan alasan utama. Manfaat utamanya adalah privasi: koordinat lokasi dan informasi kamera tidak ikut tersebar saat foto dipublikasikan.
Tentukan ukuran tampil, lalu sesuaikan
Mulai dari ukuran tempat foto akan ditampilkan, bukan dari angka KB. Setelah itu pilih format, perkecil dimensinya, dan periksa hasilnya. Untuk konsep dasarnya, buka Kompresi Foto. Untuk penyajian gambar di situs, buka Gambar untuk Web. Panduan lengkap kelompok ini ada di Panduan Gambar dan Foto.