Kategori Sayfası Yapısı Nasıl Olmalı?

Kategori Başlığı ve Açıklama

Başlık net, açıklayıcı olmalı. "Giyim" belirsiz, "Kadın Giyim" daha net, "Kadın Günlük Giyim" en net. SEO için önemli: "kadın elbise" arayan kullanıcı başlıkta bunu görmeli.

Açıklama 100-200 kelime aralığında. Ne içeriyor? Hangi ürünler/içerikler var? Neden önemli? SEO için değerli ama öncelik kullanıcıda. Üretici açıklamasını kopyala-yapıştır yapmayın.

Yerleşim sorunu: üstte mi, altta mı? Üstte hemen görünür ama ürünleri aşağı iter. Altta SEO için iyi ama göz atılmaz. Hibrit çözüm: kısa özet üstte (2-3 cümle), tam açıklama altta.

Breadcrumb yapısı: Ana Sayfa > Kadın > Giyim > Elbise. Nerede olduğunu gösterir, geri dönüş kolaylaşır. Schema markup eklenirse Google arama sonuçlarında breadcrumb gösterir.

Alt kategoriler "Kadın Giyim" altında "Elbise", "Pantolon", "Bluz" gibi daha spesifik seçenekler sunar. Üstte, ikon veya görsel ile gösterilebilir. Çok fazla alt kategori dikkat dağıtır; 4-8 yeterli.

Ürün/İçerik Listesi ve Grid Yapısı

Listenin kalbi grid yapısı. Masaüstünde 3-4 sütun ideal. 2 sütun çok az ürün gösterir, 5 sütun ürünleri küçültür. Mobilde 2 sütun, tablet 3 sütun.

Ürün kartı: görsel, başlık, fiyat, yıldız puanı. Görsel en önemli unsur, büyük ve net olmalı. Hover'da ikinci görsel gösterilebilir. Başlık 2 satır, uzun başlık kesilir. Fiyat belirgin, indirim varsa eski fiyat üstü çizili.

Hızlı görünüm özelliği: kartda "Hızlı Bak" butonu, modal açılır, detay gösterilir. Sayfa değişimi olmadan bilgi alınır. Dönüşümü %10-15 artırabilir. Modal ağırsa performans düşer, bu dengeyi kurmak gerek.

Sepete ekle butonu nerede? Basit ürünlerde (tek varyant) kartda olabilir. Karmaşık ürünlerde (beden, renk seçimi) ürün sayfasında olmalı. Yanlış varyant sepete eklenirse iade artar.

Lazy loading stratejisi: ilk 12-24 ürün yüklenir, scroll edilince daha fazla. Sayfa hızlı açılır. Google lazy loading içeriği indexlemeyebilir, server-side rendering (SSR) kullanın.

Boş durum tasarımı: "Ürün bulunamadı" yerine alternatif öner. "Benzer kategoriler", "Popüler ürünler" göster. Siteyi terk etmesin.

Filtreleme Sistemi

100+ ürün varsa filtreleme şart. Aradığını hızlıca bulmalı. Filtreler sol sidebar'da, mobilde drawer veya modal.

Fiyat filtresi slider veya input olabilir. Slider görsel, kolay kullanım. "₺100-₺500" aralığı göster, değiştirilebilir. Dinamik filtre: slider hareket ettikçe ürün sayısı güncellenir. "₺100-₺200 (47 ürün)".

Marka filtresi checkbox listesi. Popüler markalar üstte, geri kalanı "Daha Fazla" ile. 50+ marka varsa arama kutusu ekle, marka adı yazarak bulsun.

Özellik filtreleri: renk, beden, malzeme. Her özellik ayrı grup. Renk filtresi görsel: renk kutuları, tıklanınca seçilir. Beden filtresi buton: S, M, L, XL. Stokta olmayan beden devre dışı ama görünür kalır.

Çoklu filtre seçimi: "Mavi" + "Zara" + "₺200-₺400". Her filtre eklendikçe sonuç daralır. Seçilen filtreler üstte gösterilmeli, tek tıkla kaldırılabilmeli.

Filtre mantığı: AND mi, OR mi? "Mavi" VE "Kırmızı" seçildi, hiç ürün çıkmaz (AND). "Mavi" VEYA "Kırmızı" seçildi, her iki renk de çıkar (OR). Genellikle aynı grup içinde OR, farklı gruplar arası AND.

Filtreler URL'de görünmeli: /kadin-giyim?renk=mavi&marka=zara&fiyat=200-400. URL paylaşılabilir, geri buton çalışır, SEO dostu. JavaScript ile URL güncellenir (pushState).

"Filtreleri Temizle" butonu tüm filtreleri kaldırır, varsayılan haline döner. Yanlış filtre seçildi, sıfırdan başlamak gerekiyor.

Sıralama Seçenekleri

Varsayılan sıralama "Önerilen" veya "Popüler" olmalı. Algoritma satış, yıldız puanı, stok durumu, yenilik gibi faktörleri değerlendirip en uygun ürünleri gösterir.

Seçenekler: Önerilen, Fiyat Artan, Fiyat Azalan, Yeni Gelenler, Çok Satanlar, En Yüksek Puan. 5-7 seçenek yeterli, daha fazlası şaşırtır.

Fiyat sıralaması basit: artan ucuzdan pahalıya, azalan pahalıdan ucuza. İndirimli fiyat mı, normal fiyat mı sıralanacak? İndirimli fiyat sıralanmalı, gerçek fiyatı görsün.

Popülerlik sıralaması satış sayısı, görüntülenme, sepete eklenme üzerinden çalışır. Sosyal kanıt: popüler ürünler daha çok satılır. Yeni ürünler dezavantajlı, hiç satış yok. Zaman faktörü ekle: son 30 gün satışı.

Yıldız puanı sıralaması: en yüksek puan üstte. 5 yıldız (2 yorum) vs 4.5 yıldız (200 yorum) karşılaştırması. İkincisi daha güvenilir. Weighted rating: puan + yorum sayısı kombinasyonu.

Sıralama da URL'de görünmeli: /kadin-giyim?sirala=fiyat-artan. URL paylaşılabilir, geri buton çalışır.

Sayfalama ve Yükleme Stratejisi

500 ürün var, hepsini tek sayfada gösteremezsiniz. Üç yaklaşım: sayfalama, sonsuz scroll, "Daha Fazla Yükle" butonu.

Sayfalama: 24-48 ürün göster, sayfa numaraları altta. Klasik, tanıdık. Kaçıncı sayfada olduğunu bilir, footer'a ulaşabilir. Her sayfa yeni yükleme demek, beklemek demek.

Sonsuz scroll: scroll edilince otomatik yeni ürünler yüklenir. Mobilde yaygın. Kesintisiz deneyim, hızlı gezinme. Footer'a ulaşılamaz, kaybolur, SEO zor.

"Daha Fazla Yükle" butonu hibrit yaklaşım: ilk 24 ürün, altta buton, tıklanınca 24 ürün daha. Sayfalama + sonsuz scroll avantajları. Kontrol eder, footer'a ulaşabilir.

Hangi yaklaşım? E-ticaret sitesinde "Daha Fazla Yükle" veya sayfalama. Blog sitesinde sonsuz scroll. Haber sitesinde sayfalama. A/B test yapın.

Sayfa numarası limiti: 1, 2, 3, ..., 10, 11, 12 yerine 1, 2, 3, ..., 10, ..., 50. Çok sayfa numarası karmaşık. İlk 3, son 3, mevcut sayfa civarı göster.

SEO: her sayfa ayrı URL. /kadin-giyim?sayfa=2. Canonical tag her sayfa kendi canonical'ına işaret eder. Rel="next" ve rel="prev" tag'leri Google'a sayfa sırasını anlatır.

Mobil Kategori Sayfası

Mobilde farklı çalışır. Ekran dar, filtreler sidebar'a sığmaz. Filtreler drawer'da, "Filtrele" butonu üstte.

Filtre drawer ekranın altından veya yanından açılır, tam ekranı kaplar. İçeride tüm filtreler, accordion ile gruplandırılmış. "Uygula" butonu altta, filtreler uygulanır, drawer kapanır.

Sıralama dropdown veya bottom sheet. "Sırala" butonu üstte, tıklanınca seçenekler gösterilir. Seçer, sayfa güncellenir.

Ürün grid 2 sütun. Daha fazla sütun ürünleri küçültür, görsel net görünmez. Kart basit: görsel, başlık, fiyat. Detay ürün sayfasında.

Sticky filtre butonu: scroll edilince "Filtrele" ve "Sırala" butonları üstte sabit kalır. Her an filtreleyebilir, yukarı scroll etmek zorunda değil.

Performans: 3G bağlantıda 3 saniye altında yükleme hedefle. Görseller agresif optimize, lazy loading, critical CSS inline. İlk 12 ürün hemen, geri kalanı scroll edilince.

SEO Optimizasyonu

Organik trafik kategorilerden gelir. "kadın elbise", "erkek ayakkabı" aramaları kategori sayfasına düşer.

Title tag: kategori adı + site adı. "Kadın Giyim | Site Adı". 60 karakter altı. Keyword başta olmalı.

Meta description 150-160 karakter. Özet: "Kadın giyim ürünleri: elbise, pantolon, bluz. 1000+ ürün, ücretsiz kargo, hızlı teslimat." CTA ekle: "Hemen alışverişe başla".

H1 tag kategori başlığı. "Kadın Giyim". Sayfada tek H1 olmalı. H2 alt kategoriler veya filtre grupları.

Açıklama 200-500 kelime. Keyword doğal kullanım. "Kadın giyim" 5-10 kez geçmeli ama spam olmamalı. LSI keyword'ler: "kadın kıyafet", "bayan giyim", "kadın moda".

Internal linking: ilgili kategoriler, alt kategoriler, popüler ürünler. Her kategori sayfasından 5-10 internal link. Link juice dağıtılır.

Schema markup: CollectionPage schema. Kategori adı, açıklama, ürün sayısı. Google zengin sonuçlar gösterebilir.

Filtreleme ve SEO: filtreli URL'ler indexlenmeli mi? "Mavi elbise" araması /kadin-giyim?renk=mavi'ye düşebilir. Çok fazla filtre kombinasyonu duplicate content yaratır. Canonical tag kullan, ana kategori sayfasına işaret et.

Performans Optimizasyonu

100 ürün görseli, filtreler, sıralama. Hızlı yüklenmeli.

Görsel optimizasyonu: ürün görselleri 50-100 KB. Thumbnail 300x400px yeterli. WebP formatı, lazy loading. Above-the-fold ilk 12 ürün hemen, geri kalanı scroll edilince.

Veritabanı sorgusu optimize edilmeli. Index: kategori, fiyat, stok, sıralama sütunları. Yavaş sorgu varsa EXPLAIN ile analiz et.

Cache stratejisi: stok ve fiyat sık değişiyorsa cache süresi kısa (5-10 dakika). Filtre ve sıralama kombinasyonları ayrı cache key.

API performansı: ürün listesi API'si 200ms altında cevap vermeli. Yavaşsa cache ekle, sorgu optimize et, pagination ekle (limit/offset).

JavaScript bundle minimize edilmeli. Gereksiz kütüphane yok. Code splitting: filtre kodu ayrı chunk, lazy loading.

Lighthouse skoru 90+ hedefle. LCP 2.5 saniye altı, FID 100ms altı, CLS 0.1 altı.

Yaygın Hatalar

Filtre yok: 500 ürün var, scroll ederek arıyor. Filtre sistemi ekle: fiyat, marka, özellik.

Yavaş yükleme: tüm ürün görselleri aynı anda yükleniyor, sayfa 8 saniyede açılıyor. Lazy loading, görsel optimize, CDN.

Mobilde kullanılamaz: filtreler sidebar'da, mobilde görünmüyor. Filtre drawer, responsive tasarım.

SEO ihmal edilmiş: title tag "Kategori", meta description yok. SEO dostu title, description, H1, schema markup.

Boş durum kötü: "Ürün bulunamadı" mesajı, alternatif yok. Benzer kategoriler öner, popüler ürünler göster.

Filtre URL'si yok: filtre seçildi ama URL değişmedi, geri buton çalışmıyor. Filtre URL'de, pushState kullan.

Sıralama belirsiz: varsayılan sıralama rastgele, ne göreceğini bilmiyor. "Önerilen" veya "Popüler" varsayılan, algoritma optimize et.