641 lines
15 KiB
Markdown
641 lines
15 KiB
Markdown
# 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
|