← Blog
5 menit baca

Ukuran Gambar Produk Shopify yang Tampil Optimal

Ukuran gambar produk Shopify: mengapa 2048 px lebih baik dari 5000 px, apa yang diminta galeri Dawn, dan bagaimana satu rasio merapikan seluruh koleksi.

  • shopify
  • product photography
  • ecommerce
  • page speed
  • image optimization
  • background removal
  • alt text
Ukuran Gambar Produk Shopify yang Tampil Optimal

Gambar produk Shopify biasanya gagal ke salah satu dari dua arah. Entah terlalu kecil, sehingga tampilan zoom berubah jadi bubur begitu pelanggan memeriksa jahitan atau dudukan batu permata. Entah raksasa langsung dari kamera, sehingga halamannya merangkak di ponsel — tempat sebagian besar trafik Anda mendarat. Admin Shopify menerima keduanya tanpa sepatah peringatan pun.

Shopify mengerjakan lebih banyak hal untuk Anda daripada yang disadari kebanyakan pemilik toko: ia membuat beragam ukuran dari setiap gambar untuk tiap tempat di toko Anda, dan CDN-nya memilih format modern seperti WebP atau AVIF di browser yang mendukungnya. Yang tidak akan dilakukannya adalah membereskan rasio aspek yang tidak konsisten, menebak foto mana milik varian mana, atau menyelamatkan hasil potong yang berantakan. Inilah bagian yang ada di tangan Anda.

Mulai dari 2048 x 2048 dan Berhenti di Situ

Panduan Shopify sendiri: 2048 x 2048 px biasanya tampil paling baik untuk gambar produk persegi. Batas kerasnya berada jauh lebih tinggi — sebuah gambar produk atau koleksi harus di bawah 20 MB, dan bisa mencapai 5000 x 5000 px, atau 25 megapiksel.

Batas-batas itu bukan target. Di Dawn, galeri produk inline tidak pernah meminta apa pun yang lebih lebar dari 1946 px kepada CDN, dan bahkan lightbox zoom-nya berhenti menyebut ukuran di atas 4096 px. File master 5000 px sebagian besar hanya membuat unggahan lebih lambat dan pengeditan di antaranya ikut melambat. Bertahanlah di persegi 2048 px untuk galeri utama. Format unggahan yang didukung mencakup PNG, JPEG, dan WebP, jadi serahkan file terkompresi kepada Shopify, bukan TIFF 6 MB.

Persegi atau Memanjang: Pilih Satu Rasio dan Pertahankan

Grid koleksi adalah tempat rasio aspek yang campur aduk menjadi kentara, dan karena itulah Shopify menyarankan rasio yang seragam di seluruh gambar unggulan. Tema seperti Dawn memberi Anda pilihan menyesuaikan bingkai ke tiap gambar atau mengunci semuanya pada rasio tetap, dan keduanya menghukum ketidakkonsistenan: mode menyesuaikan menghasilkan grid yang bergerigi, sedangkan mode mengunci memangkas bagian atas sebuah botol atau menyisakan ruang kosong di sekeliling sebuah cincin.

Empat botol plastik dengan tinggi dan bentuk yang jelas berbeda berdiri berjajar di depan satu latar putih polos

Jadi putuskan sekali saja. Persegi (1:1) adalah pilihan baku yang paling aman dan menata ulang dirinya dengan rapi di layar sempit. Rasio potret seperti 4:5 atau 2:3 cocok untuk pakaian dan botol yang tinggi, karena mengisi lebih banyak ruang vertikal di ponsel. Yang tidak boleh Anda lakukan adalah menjalankan keduanya dalam satu koleksi.

Tegakkan aturan itu dengan memotong produknya dan membangun ulang bingkainya sendiri. Unggah sebuah foto ke remover.bg, hapus backgroundnya, lalu ganti dengan putih solid atau warna brand yang sama persis seperti listing lainnya. Setelah itu ubah ukuran hasilnya ke bingkai pilihan Anda di aplikasi ekspor apa pun yang sudah Anda pakai, sehingga sebuah mug yang digenggam dan mantel sepanjang badan mendarat di dimensi yang identik. Hasil potong yang sama juga langsung memenuhi aturan marketplace yang lebih ketat di panduan background putih Amazon, atau Anda bisa membiarkannya tetap transparan dan menyusunnya belakangan — lihat kapan PNG transparan adalah keluaran yang tepat.

CDN Shopify Mengubah Ukuran, Bukan Memperbaiki Sumber

Tema meminta gambar lewat filter image_url dan image_tag milik Liquid, yang menyusun sebuah srcset sehingga CDN bisa menyajikan file berukuran dan berformat tepat untuk tiap perangkat. Itulah sebabnya tema yang dibangun dengan baik tidak pernah mengirimkan file 2048 px Anda ke ponsel selebar 390 px.

Ada dua hal yang tidak dicakupnya. Pilihan format saat mengunggah tetap penting: mengekspor WebP menjaga file tetap kecil sebelum sampai ke CDN, dan Shopify menerima WebP tanpa konversi, sama seperti remover.bg yang menangani WebP dari ujung ke ujung. Lalu untuk ratusan SKU tidak ada jalan pintas seret-satu-folder; pekerjaan itu milik sebuah skrip yang memanggil API penghapus background, dijalankan berdampingan dengan impor CSV Anda.

Zoom Hanya Berguna Jika Pikselnya Memang Ada

Menurut Shopify, gambar perlu lebih dari 800 x 800 px agar zoom bekerja sebagaimana mestinya. Di Dawn, pengaturan zoom pada template produk menawarkan klik dan arahkan kursor, buka lightbox, atau tanpa zoom sama sekali.

Close-up ekstrem wol rajut kabel abu-abu tebal, dengan serat dan helai liar yang terlihat di sepanjang tiap jahitan

Aktifkan zoom ketika tekstur adalah nilai jualnya: rajutan, serat kulit, ukiran, faset batu permata, kayu. Matikan untuk grafis datar dan ikon kecil, karena di sana zoom hanya memamerkan artefak kompresi. Zoom juga tidak berbelas kasihan pada tepi — hiasan bulu, helai rambut lepas, dan tali-tali halus memperlihatkan tiap kesalahan, dan di situlah hasil potong yang bersih membuktikan nilainya.

Gambar Varian dan Urutan Media

Tiap varian hanya mendukung persis satu gambar yang ditetapkan — gambar saja, bukan video atau model 3D — dan gambar itulah yang menjadi pratinjau saat pelanggan memilih opsi tersebut.

Karena satu gambar per varian jarang cukup, manfaatkan galeri di sekelilingnya. Tambahkan tiap foto ke media produk, urutkan agar foto-foto yang berkaitan duduk berdekatan, dan taruh gambar terkuat di posisi pertama: item media pertama menentukan kartu produk dan tampilan bawaannya.

Teks Alt: 512 Karakter Boleh, 125 Sudah Cukup

Shopify membatasi teks alt pada 512 karakter dan menyarankan 125 atau kurang. Itu pedoman keterbacaan, bukan batas pembaca layar: teks alt yang panjang melelahkan untuk didengarkan, karena pendengar tidak bisa memindainya sekilas. Gambarkan bingkainya, termasuk variannya. "Kemeja linen biru navy, tampak depan, terkancing" mengalahkan "kemeja". Lewati "gambar dari" dan lewati daftar kata kunci. Teks alt bisa disunting secara massal lewat unggahan CSV, bukan satu per satu produk.

Daftar Periksa Singkat Sebelum Mengunggah

Sebelum satu batch masuk ke Shopify: ekspor persegi di 2048 px kecuali Anda memilih potret, tetap jauh di bawah batas 20 MB, pakai satu perlakuan background untuk seluruh koleksi, tetapkan satu gambar per varian dan susun galeri di sekelilingnya, serta jaga teks alt di bawah 125 karakter. Tidak ada satu pun yang terdengar glamor, dan semuanya langsung kelihatan di halaman koleksi begitu Anda salah melakukannya.

Lanjutkan membaca