Optimasi Gambar Website: Ukuran, Alt Text, dan Konteks

Gambar merupakan bagian penting dari website bisnis, tetapi sering menjadi penyebab halaman berat atau informasi yang membingungkan. Foto produk perlu memperlihatkan detail, sedangkan ilustrasi dapat menjelaskan konsep atau proses. Pilih format berdasarkan kegunaan dan dukungan lingkungan yang dituju. Jangan memuat berkas asli berukuran besar hanya karena resolusinya tersedia. Simpan versi asli secara terpisah dan buat aset web yang sesuai dengan ukuran tampil serta kebutuhan pembaca.

Sesuaikan dimensi dengan penggunaan

Gambar kartu tidak membutuhkan ukuran yang sama dengan foto detail. Buat versi yang cukup tajam untuk tampilannya dan periksa hasil pemotongan pada ponsel. Jika gambar mengandung bagian penting, jangan meletakkan fokus dekat tepi yang mudah terpotong. Tentukan lebar dan tinggi pada markup agar ruang gambar dapat disiapkan sebelum berkas selesai dimuat. Ukuran yang tepat membantu kestabilan susunan dan mengurangi kebutuhan browser mengunduh data yang tidak dipakai.

Tulis alt text berdasarkan fungsi

Teks alternatif sebaiknya menyampaikan informasi yang dibutuhkan ketika gambar tidak terlihat. Untuk foto produk, sebutkan hal yang membantu mengenalinya. Untuk diagram, jelaskan gagasan utamanya dan sediakan pembahasan di teks halaman. Jangan mengisi alt dengan daftar kata kunci. Gambar dekoratif dapat memakai alt kosong jika tidak membawa informasi tambahan. Pertimbangkan konteks: dua gambar yang sama dapat memerlukan perlakuan berbeda jika fungsinya dalam halaman juga berbeda.

Beri konteks dan nama berkas yang jelas

Letakkan gambar dekat pembahasan yang relevan dan gunakan keterangan jika membantu menafsirkan isi. Nama berkas yang deskriptif memudahkan pengelolaan aset. Panduan Google tentang gambar juga menekankan konteks halaman serta informasi tekstual yang membantu memahami visual. Jangan menjadikan gambar satu-satunya tempat menyimpan harga, spesifikasi, atau penjelasan penting. Informasi pokok tetap perlu tersedia sebagai teks agar dapat dibaca, dicari, dan dipakai oleh lebih banyak pengunjung.

Kelola pemuatan berdasarkan prioritas

Gambar utama yang terlihat sejak awal sebaiknya tidak diperlakukan sama dengan galeri jauh di bawah halaman. Pemuatan tertunda dapat membantu gambar yang belum diperlukan, tetapi jangan menunda semua aset tanpa memeriksa dampaknya. Gunakan kompresi yang tetap menjaga detail yang dibutuhkan. Foto dengan artefak berlebihan dapat mengurangi kejelasan produk. Uji halaman nyata setelah optimasi karena penghematan satu gambar belum tentu menyelesaikan masalah jika skrip atau layanan luar tetap membebani halaman.

Cegah gambar hilang setelah pemindahan

Simpan aset yang diperlukan dalam paket dan periksa huruf besar kecil pada nama berkas. Jalur yang bekerja di satu lingkungan belum tentu benar di hosting lain. Saat memindahkan folder, periksa alamat relatif dari halaman artikel yang bertingkat. Jangan mengandalkan tautan luar yang tidak dikendalikan bisnis untuk gambar penting. Simpan informasi izin aset agar pengelola mengetahui materi mana yang dapat diganti, diedit, atau digunakan kembali pada halaman lain.

Daftar tindakan

• Buat ukuran gambar sesuai tempat tampil.
• Isi alt berdasarkan fungsi, bukan kata kunci.
• Tampilkan informasi pokok sebagai teks halaman.
• Periksa jalur aset setelah unggah atau pemindahan.

Pertanyaan umum

Apakah setiap gambar harus berupa foto?

Tidak. Foto berguna untuk produk dan dokumentasi nyata, sedangkan diagram atau ilustrasi membantu menjelaskan konsep. Pilih visual sesuai tujuan dan jangan menyajikan ilustrasi sebagai bukti proyek yang benar-benar terjadi.

Apakah gambar kecil selalu lebih baik?

Ukuran berkas yang efisien membantu, tetapi detail penting tetap harus terlihat. Cari keseimbangan antara kejelasan dan beban halaman, lalu periksa hasil pada perangkat yang relevan.