Apakah pertanyaan-pertanyaan berikut pernah membuat Anda menggaruk-garuk kepala?
- Mengapa ketika saya melakukan pencarian gambar Google, foto produk saya tidak pernah muncul?
- Apakah saya perlu menambahkan atribut alt ke gambar saya?
- Apa perbedaan antara JPEG, GIF, dan PNG? Kapan saya harus menggunakan satu sama lain?
Hari ini Anda akhirnya akan memiliki jawaban karena kami menyelami pertanyaan-pertanyaan ini dan banyak lagi.
Sekarang sudah tahun 2021 dan Google masih juga belum memiliki cara untuk mengidentifikasi sebuah gambar, bahkan dengan menganalisis gambar tersebut. Jadi Google menggunakan nama gambar untuk mengidentifikasi gambar tersebut.
Itulah sebabnya, penting untuk memberi nama pada gambar Anda.
Jika Anda menjalankan strategi SEO, maka pengoptimalan gambar adalah seni yang ingin Anda kuasai. Ini sangat berguna untuk menarik pembeli yang membaca dengan teliti gambar Google hingga mengurangi waktu buka situs, pengoptimalan gambar adalah bagian penting dalam membangun situs web e-commerce yang sukses, karena fotografi produk Anda adalah landasan toko online Anda.
Apa itu pengoptimalan gambar?
Pengoptimalan gambar adalah tentang mengurangi ukuran file gambar Anda sebanyak mungkin tanpa mengorbankan kualitas sehingga waktu muat halaman Anda tetap rendah. Ini juga tentang SEO gambar. Artinya, mendapatkan gambar produk dan gambar dekoratif Anda untuk diberi peringkat di Google dan mesin pencari gambar lainnya.
Berikut cara mengoptimalkan gambar untuk web:
1. Beri nama gambar Anda secara deskriptif dan dalam bahasa yang sederhana
Sangat mudah untuk menelusuri ratusan jepretan produk dan mempertahankan nama file default yang ditetapkan kamera Anda.
Ketika berbicara tentang SEO gambar, penting untuk menggunakan kata kunci yang relevan untuk membantu peringkat halaman web Anda di mesin pencari. Membuat nama file yang deskriptif dan kaya kata kunci sangat penting untuk pengoptimalan gambar. Mesin pencari tidak hanya merayapi teks pada halaman web Anda, mereka juga merayapi nama file gambar Anda.
Ambil contoh gambar mobil mustang ini, misalnya.
Anda dapat menggunakan nama umum yang ditetapkan kamera Anda untuk gambar tersebut (mis. DCMIMAGE10.jpg). Namun, akan jauh lebih baik untuk memberi nama file 2012-Ford-Mustang-LX-Red.jpg.
Pikirkan tentang bagaimana pelanggan Anda menelusuri produk di situs web Anda. Pola penamaan apa yang mereka gunakan saat menelusuri? Pada contoh di atas, pembeli mobil dapat menelusuri istilah seperti:
- 2012 Ford Mustang LX Merah
- Ford Mustang LX Merah 2012
- Ford Mustang LX Merah 2012
Lihat analisis situs web Anda untuk melihat pola kata kunci apa yang diikuti pelanggan Anda. Tentukan pola penamaan paling umum yang mereka gunakan dan terapkan rumus itu ke proses penamaan file gambar Anda.
Jika Anda tidak akan mendapatkan data-driven, pastikan untuk menggunakan kata kunci yang relevan dan membantu saat menamai gambar Anda (yaitu cobalah untuk deskriptif).
Untuk memahami pentingnya penamaan file gambar secara strategis di situs Anda. Ini pasti dapat meningkatkan SEO pada halaman Anda, tetapi juga dapat membantu halaman dan gambar Anda mendapat peringkat lebih tinggi di halaman hasil mesin pencari (SERPs).
2. Optimalkan atribut alt Anda dengan hati-hati
Atribut Alt adalah teks alternatif untuk gambar ketika browser tidak dapat merendernya dengan benar. Mereka juga digunakan untuk aksesibilitas web. Bahkan saat gambar di-render, jika Anda mengarahkan kursor ke atasnya, Anda akan melihat teks atribut alt (bergantung pada setelan browser Anda).
Atribut alt juga menambah nilai SEO ke situs web Anda. Menambahkan atribut alt yang sesuai yang menyertakan kata kunci yang relevan dengan gambar di situs Anda dapat membantu Anda mendapatkan peringkat yang lebih baik di mesin pencari. Faktanya, menggunakan atribut alt mungkin adalah cara terbaik agar produk e-niaga Anda muncul di gambar Google dan penelusuran web.
Mari kita lihat kode sumber dari atribut alt.
Prioritas nomor satu dalam hal pengoptimalan gambar adalah mengisi setiap atribut alt untuk setiap gambar produk di situs Anda.
Berikut beberapa aturan sederhana untuk atribut alt:
- Jelaskan gambar Anda dalam bahasa sederhana, seperti yang Anda lakukan untuk nama file gambar Anda.
- Jika Anda menjual produk yang memiliki nomor model atau nomor seri, gunakan di atribut alt Anda.
- Jangan isi atribut alt Anda penuh dengan kata kunci (mis. Alt = “beli mobil otot mustang ford sekarang dengan harga diskon terbaik”).
- Jangan gunakan atribut alt untuk gambar dekoratif. Mesin pencari dapat menghukum Anda karena pengoptimalan yang berlebihan.
Terakhir, selalu lakukan pemeriksaan kewarasan dari waktu ke waktu. Lihat sumber halaman web Anda dan periksa untuk melihat apakah atribut alt Anda diisi dengan benar. Anda akan terkejut dengan apa yang Anda lewatkan saat Anda bergerak dengan kecepatan kewirausahaan.
3. Pilih dimensi gambar dan sudut produk dengan bijak
Ini praktik umum untuk menunjukkan banyak sudut produk Anda. Kembali ke contoh Ford Mustang, Anda tidak ingin menunjukkan hanya satu gambar mobil, terutama jika Anda mencoba menjualnya. Demi kepentingan terbaik Anda, tunjukkan bidikan:
- Interiornya.
- Bagian belakang, terutama spoiler udara itu.
- Pelek.
- Mesinnya … bagaimanapun juga itu adalah Mustang .
Cara terbaik untuk memanfaatkan foto tambahan ini adalah dengan mengisi atribut alt Anda. Dan cara Anda melakukannya adalah dengan membuat atribut alt unik untuk setiap pengambilan produk.
- 2012-Ford-Mustang-LX-Red-Leather-Interior-Trim.jpg -> menggunakan atribut alt dari: alt = “Trim Interior Kulit Merah Ford Mustang LX 2012”
- 2012-Ford-Mustang-LX-Red-Rear-View-Air-Spoiler.jpg -> menggunakan atribut alt: alt = “Spoiler Udara Tampak Belakang Merah Ford Mustang LX 2012”
Kuncinya di sini adalah menambahkan deskripsi ke atribut alt dasar Anda sehingga pencari potensial mendarat di situs web Anda. Jika Anda melakukan pekerjaan ekstra, Google akan menghadiahi Anda dengan pencari.
Perhatian untuk memberikan gambar yang lebih besar
Sekarang Anda mungkin ingin memberikan tampilan yang lebih luas untuk pengunjung Anda, yang dapat memberikan pengalaman pengguna yang luar biasa, tetapi berhati-hatilah.
Apa pun yang Anda lakukan, jangan tempatkan gambar terbesar di halaman web Anda dan cukup mengecilkan dimensinya melalui kode sumber. Ini akan meningkatkan waktu buka halaman Anda karena ukuran file yang lebih besar terkait dengan gambar.
Alih-alih, buat itu menjadi gambar yang lebih kecil dan berikan opsi untuk melihat gambar yang lebih besar di pop-up atau di halaman web terpisah.
Tips: Pelajari cara membuat gambar produk dapat diperbesar pada tema Anda.
4. Kurangi ukuran file gambar Anda
Pertimbangkan ini:
- Hampir 50% konsumen bahkan tidak mau menunggu 3 detik untuk memuat situs e-commerce.
- … dan, secara global, rata-rata waktu buka halaman sebenarnya meningkat.
- Amazon menemukan bahwa jika halaman mereka melambat hanya satu detik, mereka akan kehilangan $ 1,6 miliar setahun .
- Google menggunakan waktu buka halaman sebagai faktor peringkat dalam algoritme mereka.
Jadi, apakah Anda memiliki gambar yang perlahan “menetes” di layar dan membutuhkan waktu lebih dari 15 detik untuk dimuat? Nah, Anda bisa mengucapkan selamat tinggal kepada calon pelanggan itu!
Jadi apa yang bisa kamu lakukan?
Saat pelanggan tiba di situs Anda, perlu beberapa saat untuk memuat semuanya, bergantung pada seberapa besar file Anda. Semakin besar ukuran file, semakin lama waktu yang dibutuhkan untuk memuat halaman web. (Catatan: Jika Anda adalah pedagang Shopify, kami secara otomatis mengompresi gambar, jadi ini seharusnya tidak menjadi masalah bagi Anda.)
Jika Anda dapat memperkecil ukuran file gambar di halaman web Anda dan meningkatkan kecepatan memuat halaman, lebih sedikit orang yang mengunjungi situs Anda yang akan mengklik.
Salah satu cara untuk mengurangi ukuran file gambar adalah dengan menggunakan perintah “Save for Web” di Adobe Photoshop. Saat menggunakan perintah ini, Anda ingin menyesuaikan gambar ke ukuran file serendah mungkin sambil tetap memperhatikan kualitas gambar.
- Kualitas: Temukan ini di pojok kanan atas (mis. 70).
- Format file: Temukan ini di pojok kanan atas (mis. JPEG).
- Optimasi: Temukan kotak centang ini di pojok kanan atas (mis. Dioptimalkan).
- Warna: Temukan kotak centang ini di pojok kanan atas (yaitu, Convert to sRBG).
- Perampingan dan penajaman: Temukan ini di pojok kanan bawah (yaitu W: dan H :).
- Ukuran file yang diharapkan: Temukan ini di sudut kiri bawah (yaitu 136.7K).
Anda juga dapat memilih untuk menggunakan “Ekspor Sebagai”.
Bagaimana mengoptimalkan gambar tanpa Photoshop
Jika Anda tidak memiliki Adobe Photoshop, ada banyak alat online yang dapat Anda gunakan untuk mengedit gambar. Adobe bahkan memiliki aplikasi edit gambar gratis untuk smartphone dan tablet, Photoshop Express . Alat ini tidak memiliki semua kemampuan Adobe Photoshop versi desktop, tetapi mencakup semua dasar-dasar pengeditan gambar dan tidak memerlukan biaya yang mahal.
Alat pengeditan gambar online yang mengesankan lainnya adalah:
- PicMonkey telah dijelaskan oleh para ahli sebagai “alat pengeditan foto yang luar biasa hebat”.
- PIXLR sangat ramah pengguna dan hadir dengan aplikasi gratis 100% untuk ponsel cerdas Anda, sehingga Anda dapat mengedit saat dalam perjalanan.
- Canva adalah editor gambar online lain yang cukup canggih.
Terakhir, selalu ada GIMP yaitu sebuah aplikasi perangkat lunak pengedit gambar sumber terbuka gratis yang dapat dijalankan di Windows, Mac atau Linux. Itu bisa melakukan semua yang bisa dilakukan Photoshop, tetapi cenderung sedikit lebih kikuk. Namun untuk aplikasi edit gambar gratis, Anda tidak bisa mengalahkannya.
Seberapa besar ukuran file gambar?
Untuk gambar e-niaga, aturan praktis yang baik adalah mencoba menjaga ukuran file gambar Anda di bawah 70 kb. Terkadang hal itu bisa sulit, terutama untuk gambar yang lebih besar.
5. Pilih jenis file yang benar
Ada tiga jenis file umum yang digunakan untuk memposting gambar ke web: JPEG, GIF, dan PNG.
Mari kita lihat tiga jenis file dan bagaimana pengaruhnya terhadap gambar yang sama:
Gambar JPEG (atau .jpg) adalah jenis file lama. JPEG telah menjadi gambar standar de facto Internet. Gambar JPEG dapat dikompresi secara signifikan, yang menghasilkan gambar berkualitas dengan ukuran file kecil. Pada gambar di atas, format JPEG memungkinkan kualitas yang layak dengan ukuran file yang rendah.
Gambar GIF (.gif) memiliki kualitas lebih rendah daripada gambar JPEG dan digunakan untuk gambar yang lebih sederhana, seperti ikon dan gambar dekoratif. GIF juga mendukung animasi, seperti yang saya yakin Anda tahu.
Mengenai pengoptimalan gambar, GIF sangat bagus untuk gambar polos dan sederhana di halaman web (yang hanya menyertakan beberapa warna). Tetapi untuk gambar dan foto yang rumit, GIF tidak selalu menarik. Ini terutama berlaku untuk gambar besar.
Kita bisa lolos dengan menggunakan GIF pada gambar MacBook di atas karena fotonya cukup kecil sehingga GIF berfungsi dengan baik.
Gambar PNG menjadi lebih populer sebagai alternatif GIF. PNG mendukung lebih banyak warna daripada GIF dan tidak menurun seiring waktu dengan penyimpanan ulang, seperti yang dilakukan JPEG. Meskipun jenis file PNG mulai lebih sering digunakan, ukuran file masih bisa lebih besar dari gambar JPEG.
Perhatikan bagaimana gambar PNG-24 lebih dari tiga kali lebih besar dalam ukuran file daripada PNG-8. Inilah mengapa Anda harus sangat berhati-hati dengan PNG.
Berikut adalah contoh ekstrem, di mana ukuran file gambar dipertahankan konstan pada 24 kb untuk ketiga jenis file:
Seperti yang Anda lihat, JPEG adalah pemenang yang jelas di sini. GIF dan PNG harus diturunkan kualitasnya agar tetap pada ukuran file rendah yang sama.
Berikut beberapa tip yang perlu diingat saat memilih jenis file:
- Dalam kebanyakan kasus di e-niaga, JPEG akan menjadi pilihan terbaik Anda. Mereka memberikan kualitas terbaik untuk ukuran file terkecil.
- Jangan pernah menggunakan GIF untuk gambar produk besar. Ukuran file akan sangat besar dan tidak ada cara yang baik untuk menguranginya. Gunakan GIF untuk thumbnail dan gambar dekoratif saja.
- PNG bisa menjadi alternatif yang baik untuk JPEG dan GIFS. Jika Anda hanya bisa mendapatkan foto produk dalam format PNG, coba gunakan PNG-8 melalui PNG-24. PNG unggul sebagai gambar dekoratif sederhana karena ukuran filenya yang sangat kecil.
Sebagian besar perangkat lunak pengedit gambar dapat menyimpan gambar ke salah satu format file yang dibahas di atas.
Contoh terbaik yang bisa saya berikan adalah situs stok foto. Jika Anda pergi ke Depositphotos misalnya dan mengarahkan kursor ke gambar, Anda akan melihat deskripsi itu. Begitulah seharusnya gambar diberi nama.
Contoh: “stock-photo-focused-young-woman-consider-paperwork.jpg”
6. Optimalkan thumbnail Anda
Banyak situs e-niaga akan menggunakan gambar mini, terutama pada halaman kategori. Mereka dengan cepat memamerkan produk tanpa menghabiskan terlalu banyak real estat.
Gambar mini memang bagus, tapi hati-hati; mereka bisa menjadi silent killer. Korban? Kecepatan memuat halaman Anda. Gambar kecil biasanya ditampilkan di titik-titik kritis selama proses belanja. Jika mereka mencegah halaman kategori Anda dimuat dengan cepat, Anda bisa kehilangan pelanggan potensial. (Catatan: Pedagang Shopify tidak perlu khawatir tentang pengoptimalan thumbnail karena kami akan mengurusnya untuk Anda.)
Jadi apa yang bisa kamu lakukan?
- Buat ukuran file thumbnail Anda sekecil mungkin. Mungkin ada baiknya membiarkan slide berkualitas demi ukuran file yang lebih rendah di sini. Ingat, dampak kumulatif dari thumbnail Anda akan berdampak besar pada waktu buka halaman Anda.
- Variasikan teks atribut alt Anda agar tidak menduplikasi teks yang akan Anda gunakan untuk versi yang lebih besar dari gambar yang sama. Faktanya, buat teks alt Anda sangat berbeda. Hal terakhir yang Anda inginkan adalah thumbnail diindeks, bukan gambar yang lebih besar. Kasus dapat dibuat untuk mengabaikan teks alt sepenuhnya.
7. Gunakan peta situs gambar
Jika situs Anda menggunakan galeri Javascript, pop-up gambar, atau cara “mencolok” lainnya untuk meningkatkan pengalaman belanja secara keseluruhan, peta situs gambar akan membantu membuat gambar Anda diperhatikan oleh Google.
Perayap web tidak dapat merayapi gambar yang tidak disebutkan secara khusus dalam kode sumber laman web. Jadi, untuk memberi tahu crawler tentang gambar yang tidak teridentifikasi, Anda harus mencantumkan lokasinya di peta situs gambar.
Anda dapat memasukkan baris berikut dalam file robots.txt Anda, yang menunjukkan jalur ke peta situs atau Anda dapat mengirimkan peta situs ke Google menggunakan Search Console.
Google memiliki banyak pedoman untuk penerbitan gambar, yang dapat membantu peringkat situs web Anda lebih tinggi di SERP. Selain itu, Anda dapat menggunakan peta situs Google untuk memberi Google lebih banyak informasi tentang gambar di situs web Anda, yang dapat membantu Google menemukan lebih banyak gambar Anda daripada dirinya sendiri.
Menggunakan peta situs tidak menjamin bahwa gambar Anda akan diindeks oleh Google, tetapi ini jelas merupakan langkah positif menuju SEO gambar. Alat Webmaster Google memiliki banyak saran untuk memformat peta situs Anda dengan benar.
Penting bagi Anda untuk menambahkan tag khusus untuk semua gambar Anda. Anda juga dapat membuat peta situs terpisah untuk mencantumkan gambar secara eksklusif. Yang penting adalah menambahkan semua informasi yang diperlukan, saat menggunakan tag tertentu, ke peta situs apa pun yang Anda miliki atau akan buat.
Ikuti pedoman yang disarankan Google ini saat membuat peta situs dengan informasi gambar.
8. Waspadai gambar dekoratif
Situs web sering kali memiliki bermacam-macam gambar dekoratif, seperti gambar latar belakang, tombol, dan bingkai. Apa pun yang tidak terkait dengan produk kemungkinan besar dapat dianggap sebagai gambar dekoratif.
Meskipun gambar dekoratif dapat menambahkan banyak daya tarik estetika ke halaman web, gambar tersebut dapat menghasilkan ukuran file gabungan yang besar dan waktu muat yang lambat. Oleh karena itu, Anda mungkin ingin mempertimbangkan untuk melihat lebih dekat pada gambar dekoratif Anda sehingga mereka tidak akan mengganggu kemampuan situs web Anda untuk mengubah pengunjung menjadi pelanggan.
Anda ingin memeriksa ukuran file dari semua gambar dekoratif di situs Anda dan menggunakan templat yang meminimalkan ukuran file.
Berikut beberapa tip untuk mengurangi ukuran file gambar dekoratif Anda:
- Untuk gambar yang membentuk batas atau pola sederhana, buatlah menjadi PNG-8 atau GIF. Anda dapat membuat gambar yang bagus dengan ukuran hanya beberapa ratus byte.
- Jika memungkinkan, gunakan CSS untuk membuat area berwarna daripada menggunakan gambar. Gunakan gaya CSS sebanyak mungkin untuk mengganti gambar dekoratif apa pun.
- Perhatikan baik-baik gambar latar bergaya wallpaper besar itu. Itu bisa menjadi file yang sangat besar. Kecilkan sebanyak mungkin tanpa merusak kualitas gambar.
Salah satu trik yang dapat Anda gunakan untuk mengurangi ukuran gambar latar belakang adalah dengan memotong bagian tengah gambar latar belakang, dan membuatnya menjadi warna datar atau bahkan transparan. Ini dapat mengurangi ukuran file secara substansial.
9. Berhati-hatilah saat menggunakan jaringan pengiriman konten (CDN)
Pedagang Shopify tidak perlu khawatir tentang ini karena kami adalah solusi yang dihosting, tetapi yang lain harus memperhatikan. Jaringan pengiriman konten (CDN) adalah tempat tujuan untuk menghosting gambar dan file media lainnya. Mereka dapat meningkatkan kecepatan memuat halaman Anda dan membantu memecahkan masalah bandwidth.
Satu-satunya kelemahan adalah ketika datang ke tautan balik. Seperti yang Anda ketahui, backlink sangat penting untuk SEO dan semakin banyak backlink yang Anda miliki, semakin baik situs Anda di mesin pencari.
Dengan menempatkan gambar Anda di CDN, kemungkinan besar Anda menghapus gambar dari domain Anda dan menempatkannya di domain CDN. Jadi, ketika seseorang menautkan ke gambar Anda, mereka sebenarnya menautkan ke domain CDN.
Oleh karena itu, praktik terbaiknya adalah:
- Hanya karena sesuatu itu “trendi” tidak berarti Anda harus mengikutinya seperti domba. Tentukan apakah itu benar-benar langkah terbaik untuk bisnis Anda terlebih dahulu.
- Jika situs web Anda melakukan banyak bisnis setiap bulan, CDN kemungkinan besar merupakan ide yang bagus karena dapat membantu menyelesaikan masalah bandwidth.
- Jika situs Anda hanya mendapatkan ribuan pengunjung sehari sekarang, kemungkinan situasi hosting Anda saat ini dapat menangani beban tersebut.
Ada beberapa cara untuk mengatasi masalah SEO gambar yang terkait dengan CDN, tetapi pastikan untuk memiliki bantuan profesional untuk menyusun strategi langkah Anda terlebih dahulu.
10. Uji gambar Anda
Inti dari mengoptimalkan gambar Anda adalah untuk membantu meningkatkan keuntungan Anda. Kami telah membicarakan tentang mengurangi ukuran file dan membuat mesin telusur mengindeks gambar Anda, tetapi bagaimana dengan pengujian gambar untuk melihat apa yang menghasilkan lebih banyak pelanggan?
- Uji jumlah gambar produk per halaman: Karena waktu muat merupakan masalah untuk beberapa situs e-niaga yang tidak dihosting, Anda mungkin menemukan bahwa mengurangi jumlah gambar pada halaman akan meningkatkan rasio klik-tayang dan penjualan. Mungkin juga menyediakan banyak gambar per halaman akan meningkatkan pengalaman pengguna dan menghasilkan lebih banyak penjualan. Satu-satunya cara untuk mengetahuinya adalah dengan mengujinya.
- Uji sudut apa yang disukai pelanggan Anda : Anda mungkin melihat peningkatan loyalitas pelanggan dengan memberikan pandangan yang ingin dilihat pelanggan Anda. Cara terbaik untuk mengetahuinya adalah dengan mensurvei pelanggan Anda tentang apa yang paling mereka sukai saat melihat jepretan produk Anda. Secara umum, mensurvei dan berbicara dengan pelanggan Anda adalah kebiasaan yang baik. Tetap saja, verifikasi dengan pengujian.
- Uji berapa banyak daftar produk yang harus Anda miliki pada halaman kategori: 10, 20, 100 produk? Uji jumlah produk yang Anda daftarkan pada halaman kategori untuk melihat mana yang terbaik bagi pelanggan Anda.
Menjaga agar foto yang indah tetap berfungsi
Sekarang pertanyaan tentang gambar di situs Anda tidak akan membuat Anda bolak-balik berjam-jam.
Saat ini Anda sudah tahu beberapa strategi SEO gambar untuk memasukkan foto produk Anda ke dalam hasil pencarian gambar Google. Anda tahu bagaimana memanfaatkan atribut alt sepenuhnya. Anda tahu perbedaan antara jenis file dan kapan harus memilih setiap opsi.
Namun, pengoptimalan gambar itu rumit dan kita baru saja menggores permukaannya, jadi silakan tinggalkan pertanyaan apa pun yang mungkin Anda miliki di komentar di bawah.
Masih butuh bantuan?
| Tools yang digunakan | Pendalaman Materi |
|---|---|
| – WordPress | – Cukup jelas |