Ürün görseli SEO'sunun kısa cevabı üç maddedir:
- Açıklayıcı dosya adı.
IMG_4821.jpgdeğil, ürünü ve kareyi söyleyen bir ad. - Ürünü anlatan alt metin. Görseli göremeyen birine ürünün ne olduğunu söyleyen kısa bir cümle.
- Her varyantın kendi görseli. Renk değişince kapak da değişir; her rengin görseli kendi adını ve kendi alt metnini taşır.
Bu rehberdeki teknik bilgiler Google Arama Merkezi'nin iki açık sayfasına dayanır: Google Görseller SEO en iyi uygulamaları ve ürün varyantı yapılandırılmış verileri.
yeety-suet-trenckot-taba-yt2410-01.webp
yeety-suet-trenckot-taba-yt2410-02.webp
yeety-suet-trenckot-taba-yt2410-03.webp
yeety-suet-trenckot-taba-yt2410-04.webp
Google ürün görselini neye bakarak anlar?
Google'ın görsel rehberi birkaç sinyali açıkça sayar. Sade dille:
- Görsel
<img>etiketiyle verilmeli. CSS arka planı olarak yerleştirilen görseller Google tarafından dizine eklenmez. Tema seçerken ya da ürün sayfası şablonunu değiştirirken geliştiricinize sorulacak ilk soru budur: ürün görselleri gerçek bir görsel etiketiyle mi geliyor? - Dosya adı. Google, dosya adının görselin konusu hakkında ipucu verebileceğini söyler ve açıklayıcı ad önerir.
- Alt metin. Görselin ne gösterdiğini anlatan metin. Google doğru ve açıklayıcı olmasını ister, anahtar kelime doldurmaya karşı uyarır.
- Görselin yakınındaki metin ve sayfa başlığı. Görsel, ilgili ürün açıklamasının yanında durduğunda bağlamı daha iyi okunur.
Biçim tarafında Google BMP, GIF, JPEG, PNG, WebP, SVG ve AVIF biçimlerini destekler. Piksel ölçüsü, oran ve dosya boyutu bu rehberin konusu değil; onlar için ürün görseli ölçüleri ve biçimleri rehberine bakın.
Dosya adı şablonu: 60 üründe bozulmayan kural
Tek bir dosyaya iyi ad vermek kolaydır. Zor olan, ayda 60 yeni ürünün her karesine aynı mantıkla ad vermektir. Bunun için bir şablon gerekir. Örnek bir şablon (kural değil, başlangıç noktası):
marka-urun-tipi-renk-skukodu-01.webp
Şablonun mantığı:
- Küçük harf ve tire. Boşluk ve Türkçe karakter yerine tire kullanmak, dosyanın farklı sistemler arasında taşınırken bozulmamasını sağlar. Bu bir Google kuralı değil, pratik bir taşınabilirlik tercihidir.
- Ürünü anlatan kelimeler önde. Ürün tipi ve renk, adı okuyan herkese (ve arama motoruna) dosyanın ne olduğunu söyler.
- SKU kodu. Aynı tipte, aynı renkte iki ürünü birbirinden ayırır; ekibin dosyayı katalogla eşlemesini sağlar.
- Kare sırası sonda.
-01kapak,-02arka,-03detay. Sıra dosya adında olursa mağazaya yükleme de sıralı olur.
| Dosya adı | Sorun | Ne söylüyor? |
|---|---|---|
IMG_4821.jpg | Kamera ya da sistem numarası | Hiçbir şey |
final-son-v3.jpg | Ekip içi sürüm notu | Hangi ürün olduğu belirsiz |
Keten Gömlek Haki.jpg | Boşluk ve Türkçe karakter, SKU ve kare sırası yok | Ürünü söylüyor, ama taşınırken bozulabilir ve iki ürünü ayırmaz |
yeety-keten-gomlek-haki-yt2410-01.webp | — | Marka, ürün tipi, renk, SKU, kapak karesi |
Tablodaki ürün ve SKU kurgusaldır.
Şablonun en iyi yeri çekim brief'idir. Kural üretimden önce yazılırsa teslimden sonra yüzlerce dosyayı yeniden adlandırma işi doğmaz. Aynı SKU mantığı gönderdiğiniz kaynak dosyalarda da işe yarar: girdi ve çıktı aynı kodla adlandırılırsa her görselin hangi üründen geldiği ilk bakışta görülür. Girdi tarafı için referans kitinde dosya adlandırma bölümüne bakın.
Alt metin nasıl yazılır?
Kural tek cümle: ürünü gören birinin söyleyeceği cümleyi yazın. Görseli göremeyen bir müşteri ya da arama motoru bu cümleden ürünün ne olduğunu anlamalı.
Bir giyim ürününde alt metin genellikle şunları içerir:
- Ürün tipi: gömlek, triko, trençkot.
- Renk: katalogdaki renk adıyla.
- Kumaş ya da doku: keten, örgü, deri.
- Kesim: oversize, bol paça, kruvaze.
- Gerekirse kare türü: arka görünüm, yaka detayı.
Anahtar kelimeleri art arda dizmek işe yaramaz; Google bunu açıkça kötü uygulama sayar. "Gömlek erkek gömlek keten gömlek ucuz gömlek" bir alt metin değil.
Mankenli karede alt metin ürünü anlatır, mankeni değil. Okuyucu "uzun saçlı model" bilgisinden ürün hakkında bir şey öğrenmez. "Manken" kelimesi yalnızca karenin türünü belirtmek için gerekir: "mankenli ön görünüm".
Örnekler
| Kare türü | Zayıf alt metin | İyi alt metin |
|---|---|---|
| Kapak | "ürün görseli" | "Haki keten oversize gömlek, mankenli ön görünüm" |
| Arka | "gömlek 2" | "Haki keten oversize gömleğin arka görünümü ve düşük omuz dikişi" |
| Detay | "detay" | "Haki keten gömleğin sedef düğmeli yaka detayı" |
| Kombin | "yeni sezon kombin" | "Haki keten gömlek, ekru bol paça pantolonla kombin" |
Örnekler kurgusal bir demo ürün üzerinden yazılmıştır.
Aynı görsel iki sayfada kullanılıyorsa
Kapak görseli hem ürün sayfasında hem kategori sayfasında görünebilir. Alt metin sayfanın bağlamına göre yazılır. Ürün sayfasında kare türünü söylemek işe yarar; kategori sayfasında ürünün adı ve rengi genellikle yeterlidir.
Renk ve beden varyantlarında görsel eşlemesi
Bir ürünün üç rengi varsa, her rengin kendi görsel seti olmalı. Müşteri renk seçtiğinde kapak görseli de o renge geçmeli. Seçilen renk haki, kapak hâlâ siyahsa müşteri neyi alacağından emin olamaz.
Eşlemenin iki kuralı var:
- Renk adı her yerde aynı. Katalogda renk "haki" ise dosya adında
haki, alt metinde "haki", renk seçicide "Haki" yazar. Bir yerde "yeşil", bir yerde "asker yeşili" yazarsa eşleme bozulur. - Beden varyantı ayrı görsel gerektirmez, renk gerektirir. S ve L aynı görünür; haki ve siyah görünmez.
Geliştiricinize iletilecek yön şu: Google, aynı ürünün varyantlarını ProductGroup altında toplamayı ve hasVariant ile her varyantı ayrı bir ürün olarak tanımlamayı anlatır. Varyantların neye göre değiştiği variesBy ile belirtilir (ör. renk, beden). Google'ın örneklerinde her varyantın kendi image alanı vardır. Yani her rengin görseli yapılandırılmış veride de kendi rengine bağlanır. Ayrıntı Google'ın ürün varyantı sayfasında.
Hangi renk için ayrı set üretileceği, hangisinin türetileceği ise ayrı bir karar. Onun için renk varyantlarını nasıl planlarsınız rehberine bakın.
Kapak görseli: aramada hangi kare görünsün?
Bir ürün sayfasında birden fazla görsel vardır. Google, tercih ettiğiniz görseli belirtmenin yollarını sayar: yapılandırılmış verideki image alanı, primaryImageOfPage ve paylaşım için og:image. Bu alanlarda kapak karesi seçilirse arama sonucunda ve bağlantı paylaşıldığında aynı kare görünür.
Kapak karesi açı planının ilk karesidir. Hangi karenin kapak olacağı ürün sayfasında değil, üretimden önce kararlaştırılır; bunun için ürün başına kare planı rehberine bakın.
Hız için Google, aynı görselin farklı ekran boyutlarına göre sürümlerini srcset ya da <picture> ile vermeyi ve yedek olarak bir src bırakmayı önerir.
Alt metin ürün gerçeğiyle uyuşmalı
Alt metin görselin söylediğini söyler; görselde olmayanı söylemez. Görseldeki renk haki ise alt metin de "haki" der. Ama görseldeki renk ürünün gerçek renginden farklıysa, doğru bir alt metin bu farkı örtmez. Müşteri görseli görür, alt metni görmez.
Bu yüzden kontrol önce görselde yapılır. Yeety'de her kare teslimden önce kaynak görsellerle karşılaştırılır: renk, form, malzeme ve detaylar tek tek kontrol edilir. Yapay zekâ destekli üretim araçları sürecin bir parçasıdır; hizmet belirli bir araçla sınırlı değildir. Kontrolün nasıl yapıldığı ürün görselinde doğruluk kontrolü rehberinde. Aynı rengin bütün koleksiyonda aynı görünmesi ise koleksiyon boyunca tek standart meselesidir.
Alt metne üretim yöntemi yazılmaz. Alt metin ürünü anlatır; görselin nasıl üretildiğini değil. Aynı nedenle örneklerde "fotoğraf" değil "görsel" denir.
Yayından önce kontrol listesi
Bu listeyi kopyalayıp her yükleme turunda kullanabilirsiniz:
- Her dosya adı şablona uyuyor mu: ürün tipi, renk, SKU, kare sırası?
- Her görselin alt metni var mı, ve aynı ürünün kareleri birbirinden farklı alt metin taşıyor mu?
- Alt metindeki renk adı katalogdaki renk adıyla aynı mı?
- Her renk varyantı kendi görsel setine bağlı mı; renk seçilince kapak değişiyor mu?
- Kapak karesi
imageveog:imagealanlarında seçili mi? - Ürün görselleri
<img>etiketiyle mi geliyor, CSS arka planı olarak değil mi? - Görseller site haritasında (ya da görsel site haritasında) yer alıyor mu?
- Pazaryeri paneli için ayrı kontrol yapıldı mı? Pazaryerinin kendi kuralları panelde ve satıcı destek dokümanlarında yer alır.
Görsel standardı çekimden önce başlar
Dosya adı, alt metin ve varyant eşlemesi yayından önceki son adımdır. Ama kolaylaşması üretimden önce verilen kararlara bağlıdır: hangi kareler üretilecek, kapak hangisi, her renk için ayrı set var mı, dosyalar hangi kodla gelecek. Yeety'de görseller site, katalog, pazaryeri, reklam ve sosyal medya ölçülerinde teslim edilir; kare planı ve teslim düzeni brief aşamasında sizinle netleştirilir. Styling dahil e-ticaret görselleri için ürün çekimi sayfamıza bakın.