$npx -y skills add komunite/tezgah --skill saas-landing-seoSaaS uygulaması için dönüşüm odaklı landing page tasarla ve arama motoru optimizasyonu (SEO) kur. Hero, pricing, FAQ, testimonials gibi bileşenler, metadata, sitemap, robots.txt, Open Graph, yapısal veri ve blog sistemi. Bu skill'i kullanıcı landing page, ana sayfa, fiyatlandırma
| 1 | # SaaS Landing & SEO — Dönüşüm ve Keşfedilebilirlik |
| 2 | |
| 3 | Bu skill, bir SaaS uygulamasının vitrin yüzünü (landing page) ve arama motorlarında keşfedilebilirliğini (SEO) kurar. Landing page'in tek amacı ziyaretçiyi ödeme yapan müşteriye dönüştürmektir. SEO'nun amacı bu ziyaretçilerin organik olarak gelmesini sağlamaktır. |
| 4 | |
| 5 | **Bağımlılık:** Bu skill **saas-launcher** orkestratör skill'inin Faz 6'sıdır. Bağımsız olarak da kullanılabilir. |
| 6 | |
| 7 | **Bağlı skill'ler:** |
| 8 | - **saas-payments** — Fiyatlandırma bölümü ödeme skill'indeki plan tanımlarıyla aynı kaynaktan beslenmeli. |
| 9 | - **saas-auth** — CTA butonları giriş yapmamış kullanıcıları auth akışına yönlendirir. |
| 10 | |
| 11 | --- |
| 12 | |
| 13 | ## BÖLÜM 1: LANDING PAGE |
| 14 | |
| 15 | ### Sayfa Akış Mimarisi |
| 16 | |
| 17 | Kanıtlanmış SaaS landing page yapısı, yukarıdan aşağıya doğru şu sırayı takip eder. Her bileşenin sayfadaki konumu rastgele değildir — psikolojik bir amaca hizmet eder. |
| 18 | |
| 19 | **1. Navbar** |
| 20 | Amacı: Navigasyon ve sürekli erişilebilir CTA. |
| 21 | İçerik: Logo (sol), navigasyon linkleri (orta), CTA butonu (sağ, "Ücretsiz Dene" veya "Giriş Yap"). Scroll'da sticky olmalı — kullanıcı sayfanın neresinde olursa olsun CTA'ya erişebilmeli. Mobilde hamburger menü. |
| 22 | |
| 23 | **2. Hero** |
| 24 | Amacı: İlk 5 saniyede ne olduğunu, kimin için olduğunu ve neden önemli olduğunu anlatmak. |
| 25 | İçerik: Ana başlık (değer önerisi, fayda odaklı — ne yaptığını değil ne sağladığını söyle), alt açıklama (1-2 cümle), birincil CTA butonu, opsiyonel ürün ekran görüntüsü veya demo. Küçük güven göstergesi: "Kredi kartı gerektirmez" veya "14 gün ücretsiz dene". |
| 26 | |
| 27 | Başlık formülleri: |
| 28 | - "[Sonuç] + [kolaylık/hız]" — "İlk müşterini 24 saatte bul" |
| 29 | - "[Problem]'e son ver" — "E-posta kaosuna son ver" |
| 30 | - "[Hedef kitle] için [çözüm]" — "Freelancer'lar için proje yönetimi" |
| 31 | - "[Eski yol] değil, [yeni yol]" — "Spreadsheet'ler değil, akıllı dashboard'lar" |
| 32 | |
| 33 | **3. Sosyal Kanıt Bandı** |
| 34 | Amacı: "Başkaları da kullanıyor" güveni oluşturmak. |
| 35 | İçerik: Müşteri sayısı ("500+ şirket tarafından kullanılıyor"), müşteri logoları (grayscale, aynı yükseklikte), veya rakamlar (aktif kullanıcı, uptime, müşteri puanı). Henüz müşterin yoksa: beta kullanıcı sayısı, waitlist sayısı veya bu bölümü atla. |
| 36 | |
| 37 | **4. Problem/Çözüm** |
| 38 | Amacı: Kullanıcının hissettiği acıyı tanımlamak ve çözümü sunmak. |
| 39 | İçerik: "Bunu yaşıyorsun değil mi?" duygusu. Mevcut yöntemlerin zorluğunu anlat, ardından senin çözümünün bunu nasıl ortadan kaldırdığını göster. Empati kurarak yaz — kullanıcı kendini tanımalı. |
| 40 | |
| 41 | **5. Özellikler** |
| 42 | Amacı: Ne sunduğunu somut şekilde göstermek. |
| 43 | İçerik: 3-6 ana özellik, her biri ikon + başlık + kısa açıklama. Teknik jargon değil, fayda dili kullan: "Yapay zeka motorumuz" yerine "Müşteri kaybını 3 gün önceden tahmin et". İstenirse her özellik için detay sayfasına link. |
| 44 | |
| 45 | **6. Nasıl Çalışır (Opsiyonel)** |
| 46 | Amacı: Karmaşık ürünlerde süreçi basitleştirmek. |
| 47 | İçerik: 3 adım, numaralandırılmış. "1. Kaydol → 2. Veri bağla → 3. Sonuçları gör". Adım sayısı 3'ü geçmemeli — 3'ten fazlaysa basitleştir veya bu bölümü atla. |
| 48 | |
| 49 | **7. Fiyatlandırma** |
| 50 | Amacı: Fiyat bilgisini şeffaf sunmak ve satın alma kararını kolaylaştırmak. |
| 51 | İçerik: Plan kartları yan yana, özellik karşılaştırması, aylık/yıllık toggle, "En Popüler" etiketi, CTA butonu her kartta. Fiyatlandırma verileri **saas-payments** skill'indeki plan konfigürasyonuyla aynı kaynaktan gelmeli. |
| 52 | |
| 53 | Tasarım kuralları: |
| 54 | - Yıllık planı vurgula (tasarruf yüzdesini göster) |
| 55 | - En popüler planı görsel olarak öne çıkar (kenarlık, etiket, gölge) |
| 56 | - Her planın altında özellik listesi — check işaretiyle |
| 57 | - Ücretsiz deneme veya money-back guarantee varsa belirt |
| 58 | |
| 59 | **8. SSS (FAQ)** |
| 60 | Amacı: Satın alma öncesi itirazları gidermek. |
| 61 | İçerik: 4-8 soru-cevap, accordion formatında. Mutlaka cevaplanması gereken sorular: |
| 62 | - Ücretsiz deneme nasıl çalışır? |
| 63 | - İstediğim zaman iptal edebilir miyim? |
| 64 | - Verilerim güvende mi? |
| 65 | - Hangi ödeme yöntemlerini kabul ediyorsunuz? |
| 66 | |
| 67 | **9. Testimonials / Müşteri Yorumları** |
| 68 | Amacı: Sosyal kanıt derinleştirmek, güven inşa etmek. |
| 69 | İçerik: 3-6 gerçek müşteri yorumu. Her biri: alıntı, isim, unvan/şirket, fotoğraf. Spesifik yorumlar etkili: "Harika araç" değil, "İlk ayda %40 dönüşüm artışı sağladık". Henüz müşterin yoksa: beta kullanıcı geri bildirimleri veya bu bölümü atla. |
| 70 | |
| 71 | **10. Son CTA** |
| 72 | Amacı: Sayfayı güçlü bir aksiyonla bitirmek. |
| 73 | İçerik: Büyük başlık ("Bugün başla"), kısa tekrar değer önerisi, CTA butonu. Sayfanın sonuna kadar okuyan ziyaretçi yüksek niyetlidir — onu kaçırma. |
| 74 | |
| 75 | **11. Footer** |
| 76 | İçerik: Logo, kısa açıklama, navigasyon linkleri, yasal linkler (gizlilik politikası, kull |