# SEO Yönetim Sistemi - Kapsamlı Kılavuz

## 📋 İçindekiler

1. [Genel Bakış](#genel-bakış)
2. [Admin Panel Kullanımı](#admin-panel-kullanımı)
3. [SEO Özellikleri](#seo-özellikleri)
4. [Sayfa Entegrasyonu](#sayfa-entegrasyonu)
5. [En İyi Uygulamalar](#en-iyi-uygulamalar)
6. [Sorun Giderme](#sorun-giderme)

---

## Genel Bakış

Trip Planner uygulaması artık kapsamlı bir SEO yönetim sistemine sahiptir. Bu sistem ile:

✅ **Global SEO Ayarları**: Site genelinde geçerli SEO ayarları
✅ **Sayfa Bazlı SEO**: Her sayfa için özel meta bilgileri
✅ **Open Graph Tags**: Facebook ve sosyal medya paylaşımları
✅ **Twitter Cards**: Twitter paylaşımları için özel kartlar
✅ **Structured Data**: Arama motorları için yapılandırılmış veri (JSON-LD)
✅ **URL Yönlendirmeleri**: 301 ve 302 yönlendirme yönetimi
✅ **Robots.txt**: Arama motoru botları için yönergeler
✅ **Google Analytics**: Ziyaretçi takibi
✅ **Google Search Console**: Arama performansı izleme

---

## Admin Panel Kullanımı

### 1. SEO Ayarları Sayfası

**Erişim:** `/admin/seo-settings`

#### Genel Ayarlar

```
Site Adı: Trip Planner
Site Açıklaması: Seyahatlerinizi planlayın, keşfedin ve unutulmaz anılar biriktirin...
Anahtar Kelimeler: seyahat, tatil, gezi, planlama, tur
Varsayılan OG Görseli: https://example.com/og-image.jpg
Favicon URL: https://example.com/favicon.ico
```

**Öneriler:**
- Site açıklaması 150-160 karakter olmalı
- Anahtar kelimeler virgülle ayrılmalı
- OG görseli 1200x630 px olmalı
- Favicon 32x32 px veya 16x16 px olmalı

#### Sosyal Medya Entegrasyonu

```
Facebook App ID: 123456789012345
Twitter Kullanıcı Adı: @tripplanner
```

**Kullanım:**
- Facebook App ID: Facebook Developers'dan alınır
- Twitter handle: @ ile başlamalı

#### Analytics ve Doğrulama

```
Google Analytics ID: G-XXXXXXXXXX (GA4) veya UA-XXXXXXXXX-X (Universal)
Google Search Console Doğrulama: abcdefghijklmnopqrstuvwxyz123456
```

**Adımlar:**
1. Google Analytics hesabı oluşturun
2. Property ID'yi kopyalayın
3. Admin panele yapıştırın
4. Google Search Console'da site doğrulama kodunu alın
5. Admin panele yapıştırın

#### Robots.txt

```
User-agent: *
Allow: /
Disallow: /admin/
Disallow: /api/
Disallow: /private/

Sitemap: https://yourdomain.com/sitemap.xml
```

**Öneriler:**
- Admin paneli engelleyin
- API endpoint'lerini engelleyin
- Sitemap URL'ini ekleyin

---

### 2. Sayfa SEO Yönetimi

**Erişim:** `/admin/page-seo`

#### Yeni Sayfa SEO Ekleme

1. **"Yeni Sayfa SEO"** butonuna tıklayın
2. Formu doldurun:

**Temel Bilgiler:**
```
Sayfa Yolu: /about (/ ile başlamalı)
Sayfa Başlığı: Hakkımızda | Trip Planner (50-60 karakter)
Meta Açıklama: Trip Planner hakkında bilgi... (150-160 karakter)
Anahtar Kelimeler: hakkımızda, trip planner, seyahat
Canonical URL: https://yourdomain.com/about
```

**Open Graph (Facebook):**
```
OG Başlık: Hakkımızda - Trip Planner
OG Açıklama: Trip Planner hakkında detaylı bilgi
OG Görsel: https://example.com/about-og.jpg (1200x630 px)
OG Tipi: website / article / product
```

**Twitter Card:**
```
Twitter Card Tipi: summary_large_image / summary
Twitter Başlık: Hakkımızda - Trip Planner
Twitter Açıklama: Trip Planner hakkında detaylı bilgi
Twitter Görsel: https://example.com/about-twitter.jpg
```

**Arama Motoru Ayarları:**
```
☐ Noindex (Arama motorlarında gösterme)
☐ Nofollow (Linkleri takip etme)
```

3. **"Oluştur"** butonuna tıklayın

#### Sayfa SEO Düzenleme

1. Listeden düzenlemek istediğiniz sayfayı bulun
2. **Düzenle** (✏️) butonuna tıklayın
3. Bilgileri güncelleyin
4. **"Güncelle"** butonuna tıklayın

#### Sayfa SEO Silme

1. Listeden silmek istediğiniz sayfayı bulun
2. **Sil** (🗑️) butonuna tıklayın
3. Onaylayın

---

### 3. URL Yönlendirmeleri

**Erişim:** `/admin/url-redirects`

#### Yeni Yönlendirme Ekleme

1. **"Yeni Yönlendirme"** butonuna tıklayın
2. Formu doldurun:

```
Kaynak Yol: /old-page (eski URL)
Hedef Yol: /new-page (yeni URL)
Yönlendirme Tipi: 301 (Kalıcı) / 302 (Geçici)
```

3. **"Oluştur"** butonuna tıklayın

#### Yönlendirme Tipleri

**301 - Kalıcı Yönlendirme:**
- Sayfa kalıcı olarak taşındı
- SEO değeri (ranking, backlinks) aktarılır
- Arama motorları eski URL'yi kaldırır
- **Önerilir:** Çoğu durumda 301 kullanın

**302 - Geçici Yönlendirme:**
- Sayfa geçici olarak taşındı
- SEO değeri aktarılmaz
- Arama motorları eski URL'yi tutar
- **Kullanım:** A/B testleri, bakım sayfaları

#### Yönlendirme Yönetimi

- **Etkinleştir/Devre Dışı Bırak:** ⚡ butonuna tıklayın
- **Düzenle:** ✏️ butonuna tıklayın
- **Sil:** 🗑️ butonuna tıklayın

---

## SEO Özellikleri

### 1. Meta Tags

**Temel Meta Tags:**
```html
<title>Sayfa Başlığı | Site Adı</title>
<meta name="description" content="Sayfa açıklaması">
<meta name="keywords" content="anahtar, kelimeler">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://example.com/page">
```

**Kullanım:**
- Title: 50-60 karakter
- Description: 150-160 karakter
- Keywords: Virgülle ayrılmış
- Robots: index/noindex, follow/nofollow
- Canonical: Tekrarlanan içerik için

### 2. Open Graph Tags

**Facebook ve Sosyal Medya:**
```html
<meta property="og:title" content="Sayfa Başlığı">
<meta property="og:description" content="Sayfa açıklaması">
<meta property="og:image" content="https://example.com/image.jpg">
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com/page">
```

**Görsel Boyutları:**
- Önerilen: 1200x630 px
- Minimum: 600x315 px
- Format: JPG, PNG
- Boyut: Max 8MB

### 3. Twitter Cards

**Twitter Paylaşımları:**
```html
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Sayfa Başlığı">
<meta name="twitter:description" content="Sayfa açıklaması">
<meta name="twitter:image" content="https://example.com/image.jpg">
```

**Card Tipleri:**
- `summary`: Küçük görsel (1:1)
- `summary_large_image`: Büyük görsel (2:1)

### 4. Structured Data (JSON-LD)

**Organization:**
```json
{
  "@context": "https://schema.org",
  "@type": "Organization",
  "name": "Trip Planner",
  "url": "https://example.com",
  "logo": "https://example.com/logo.png"
}
```

**WebSite:**
```json
{
  "@context": "https://schema.org",
  "@type": "WebSite",
  "name": "Trip Planner",
  "url": "https://example.com",
  "potentialAction": {
    "@type": "SearchAction",
    "target": "https://example.com/search?q={search_term}",
    "query-input": "required name=search_term"
  }
}
```

**Trip (Seyahat):**
```json
{
  "@context": "https://schema.org",
  "@type": "Trip",
  "name": "Kapadokya Turu",
  "description": "3 günlük Kapadokya gezisi",
  "startDate": "2024-06-01",
  "endDate": "2024-06-03",
  "itinerary": {
    "@type": "Place",
    "name": "Kapadokya"
  }
}
```

---

## Sayfa Entegrasyonu

### Yeni Sayfaya SEO Ekleme

#### 1. SEO Hook Kullanımı

```tsx
import { useSEO } from '@/hooks/useSEO';
import { SEOHead } from '@/components/seo/SEOHead';
import { StructuredData, structuredDataTemplates } from '@/components/seo/StructuredData';

function MyPage() {
  const { globalSettings, pageSEO } = useSEO('/my-page');

  const seoTitle = pageSEO?.page_title || 'Varsayılan Başlık';
  const seoDescription = pageSEO?.meta_description || 'Varsayılan açıklama';

  return (
    <>
      <SEOHead
        title={seoTitle}
        description={seoDescription}
        keywords={pageSEO?.meta_keywords}
        ogTitle={pageSEO?.og_title}
        ogDescription={pageSEO?.og_description}
        ogImage={pageSEO?.og_image}
        canonicalUrl={pageSEO?.canonical_url}
        noindex={pageSEO?.noindex}
        nofollow={pageSEO?.nofollow}
      />
      
      {/* Sayfa içeriği */}
      <div>...</div>
    </>
  );
}
```

#### 2. Structured Data Ekleme

```tsx
<SEOHead title={seoTitle} description={seoDescription}>
  <StructuredData
    data={structuredDataTemplates.article(
      'Makale Başlığı',
      'Makale açıklaması',
      'https://example.com/image.jpg',
      '2024-01-01',
      '2024-01-02',
      'Yazar Adı'
    )}
  />
</SEOHead>
```

#### 3. Dinamik SEO (Trip Sayfası Örneği)

```tsx
function TripPage() {
  const { tripId } = useParams();
  const [trip, setTrip] = useState(null);
  const { globalSettings } = useSEO();

  useEffect(() => {
    // Trip verilerini yükle
    loadTrip(tripId);
  }, [tripId]);

  if (!trip) return <Loading />;

  return (
    <>
      <SEOHead
        title={`${trip.title} | Trip Planner`}
        description={trip.description}
        ogTitle={trip.title}
        ogDescription={trip.description}
        ogImage={trip.cover_image}
        ogType="article"
      >
        <StructuredData
          data={structuredDataTemplates.trip(
            trip.title,
            trip.description,
            trip.start_date,
            trip.end_date,
            trip.destination
          )}
        />
      </SEOHead>

      {/* Trip içeriği */}
      <div>...</div>
    </>
  );
}
```

---

## En İyi Uygulamalar

### 1. Title (Başlık) Optimizasyonu

**✅ İyi Örnekler:**
```
Kapadokya Balon Turu | Trip Planner
Seyahat Planlama Rehberi - Trip Planner
İstanbul Gezilecek Yerler 2024 | Trip Planner
```

**❌ Kötü Örnekler:**
```
Ana Sayfa (çok genel)
Trip Planner - Trip Planner - Trip Planner (tekrar)
KAPADOKYA BALON TURU!!! (büyük harf, ünlem)
```

**Kurallar:**
- 50-60 karakter arası
- Anahtar kelime başta
- Site adı sonda (| veya - ile)
- Her sayfa için benzersiz
- Büyük harf kullanmayın

### 2. Description (Açıklama) Optimizasyonu

**✅ İyi Örnek:**
```
Kapadokya'da unutulmaz bir balon turu deneyimi yaşayın. 
Gün doğumunda gökyüzüne yükselip peri bacalarını 
kuş bakışı görün. Hemen rezervasyon yapın!
```

**❌ Kötü Örnek:**
```
Balon turu. (çok kısa)
```

**Kurallar:**
- 150-160 karakter arası
- Anahtar kelimeler doğal şekilde
- Harekete geçirici mesaj (CTA)
- Her sayfa için benzersiz
- Anahtar kelime doldurma yapmayın

### 3. Keywords (Anahtar Kelimeler)

**✅ İyi Örnek:**
```
kapadokya balon turu, sıcak hava balonu, göreme, 
peri bacaları, kapadokya gezisi
```

**❌ Kötü Örnek:**
```
kapadokya, kapadokya balon, kapadokya balon turu, 
kapadokya balon turu fiyat, kapadokya balon turu ucuz
(anahtar kelime doldurma)
```

**Kurallar:**
- 5-10 anahtar kelime
- Virgülle ayrılmış
- İlgili ve spesifik
- Anahtar kelime doldurma yapmayın

### 4. Open Graph Görselleri

**Boyutlar:**
- Facebook: 1200x630 px
- Twitter: 1200x675 px (summary_large_image)
- LinkedIn: 1200x627 px

**Format:**
- JPG veya PNG
- Max 8MB
- Yüksek kalite

**İçerik:**
- Metin az olmalı
- Logo ekleyin
- Kontrast yüksek olmalı
- Mobilde okunabilir olmalı

### 5. Canonical URL

**Kullanım Durumları:**
- Tekrarlanan içerik
- Parametreli URL'ler
- Mobil/Desktop versiyonlar
- Sayfalama

**Örnek:**
```
Orijinal: https://example.com/trips?page=2
Canonical: https://example.com/trips
```

### 6. Robots Meta Tag

**Kombinasyonlar:**
```
index, follow (varsayılan - arama motorlarında göster)
noindex, follow (gösterme ama linkleri takip et)
index, nofollow (göster ama linkleri takip etme)
noindex, nofollow (gösterme ve linkleri takip etme)
```

**Kullanım:**
- Admin paneli: noindex, nofollow
- Teşekkür sayfaları: noindex, follow
- Gizli sayfalar: noindex, nofollow

---

## Sorun Giderme

### 1. Meta Tags Görünmüyor

**Sorun:** Sayfa kaynağında meta taglar yok

**Çözüm:**
1. HelmetProvider'ın App.tsx'te olduğunu kontrol edin
2. SEOHead component'inin doğru import edildiğini kontrol edin
3. Tarayıcı önbelleğini temizleyin
4. Sayfayı yenileyin (Ctrl+F5)

### 2. Open Graph Görseli Yüklenmiyor

**Sorun:** Facebook'ta paylaşıldığında görsel görünmüyor

**Çözüm:**
1. Görsel URL'inin geçerli olduğunu kontrol edin
2. Görsel boyutunun 1200x630 px olduğunu kontrol edin
3. Facebook Sharing Debugger kullanın: https://developers.facebook.com/tools/debug/
4. "Scrape Again" butonuna tıklayın

### 3. Google Analytics Çalışmıyor

**Sorun:** Ziyaretçi verileri gelmiyor

**Çözüm:**
1. Google Analytics ID'nin doğru olduğunu kontrol edin
2. GA4 için G-XXXXXXXXXX formatında olmalı
3. Universal Analytics için UA-XXXXXXXXX-X formatında olmalı
4. Admin panelde ID'yi kaydettiğinizden emin olun
5. 24-48 saat bekleyin (veriler gecikebilir)

### 4. Yönlendirmeler Çalışmıyor

**Sorun:** 301/302 yönlendirmeleri çalışmıyor

**Çözüm:**
1. Yönlendirmenin aktif olduğunu kontrol edin
2. Kaynak ve hedef yolların / ile başladığını kontrol edin
3. Tarayıcı önbelleğini temizleyin
4. Farklı tarayıcıda deneyin

### 5. Structured Data Hatası

**Sorun:** Google Search Console'da structured data hatası

**Çözüm:**
1. Google Rich Results Test kullanın: https://search.google.com/test/rich-results
2. JSON-LD formatının doğru olduğunu kontrol edin
3. Zorunlu alanların dolu olduğunu kontrol edin
4. Schema.org dokümantasyonunu kontrol edin

---

## Faydalı Araçlar

### SEO Test Araçları

1. **Google Search Console**
   - URL: https://search.google.com/search-console
   - Kullanım: Site performansı, indeksleme, hatalar

2. **Google Rich Results Test**
   - URL: https://search.google.com/test/rich-results
   - Kullanım: Structured data test

3. **Facebook Sharing Debugger**
   - URL: https://developers.facebook.com/tools/debug/
   - Kullanım: Open Graph test

4. **Twitter Card Validator**
   - URL: https://cards-dev.twitter.com/validator
   - Kullanım: Twitter Card test

5. **PageSpeed Insights**
   - URL: https://pagespeed.web.dev/
   - Kullanım: Sayfa hızı ve performans

6. **Lighthouse**
   - Chrome DevTools → Lighthouse
   - Kullanım: SEO, performans, erişilebilirlik

### SEO Kontrol Listesi

**Sayfa Yayınlamadan Önce:**
- [ ] Title 50-60 karakter arası
- [ ] Description 150-160 karakter arası
- [ ] Keywords eklendi
- [ ] OG görseli 1200x630 px
- [ ] Canonical URL doğru
- [ ] Robots meta tag doğru
- [ ] Structured data eklendi
- [ ] Alt text'ler eklendi
- [ ] Internal linkler eklendi
- [ ] Mobile-friendly
- [ ] Sayfa hızı optimize edildi

**Yayınlandıktan Sonra:**
- [ ] Google Search Console'a eklendi
- [ ] Sitemap gönderildi
- [ ] Facebook Debugger ile test edildi
- [ ] Twitter Card Validator ile test edildi
- [ ] Google Rich Results Test ile test edildi
- [ ] PageSpeed Insights ile test edildi

---

## Ek Kaynaklar

### Dokümantasyon

- [Google SEO Starter Guide](https://developers.google.com/search/docs/beginner/seo-starter-guide)
- [Open Graph Protocol](https://ogp.me/)
- [Twitter Cards](https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards)
- [Schema.org](https://schema.org/)

### Video Eğitimler

- Google Search Central YouTube kanalı
- Moz SEO Learning Center
- Ahrefs SEO Tutorials

---

## Destek

Sorularınız için:
- Admin Panel → Ayarlar → Destek
- E-posta: support@tripplanner.com
- Dokümantasyon: /docs/seo

---

**Son Güncelleme:** 2024
**Versiyon:** 1.0.0
