Kullanım kılavuzuna geç
Landing Page Designyazan elayadesign

Landing Page Design Skill.

Sayfanın argümanını ve görsel kurallarını tek bir hedeflenen dönüşüm etrafında birleştirin.

  • Açılış Sayfaları
  • Metin Yazarlığı
  • Web Tasarımı
Kaynak İncelemesi · Landing Page DesignSKILL.md
Görev Açılış Sayfaları Çıktılar • Sayfa taslağı, hero metni, faydalar, iş akışı ve SSS taslağı. • Uygun olduğunda başlık ve açıklama içeren bir index/noindex önerisi. • Seçilen yerleşim ve görsel kurallarla bölüm bölüm uygulama. Başlamadan Önce Tek bir uygulama çalışma ortamı gerekmez; uygulama örnekleri Tailwind değerlerine, IntersectionObserver'a ve isteğe bağlı hareket araçlarına başvurur.
Editoryal özet · kaynak incelenme tarihi 2026-10-07 · üretilmiş bir örnek değildir

01 İşlevler

Açılış Sayfasını Tek Bir Eylem Etrafında Kurun

Teklifi, metni, yapıyı ve SEO yaklaşımını planlayın; ardından kaynaktaki ayrıntılı görsel kuralları projeye uyduğu yerlerde uygulayın.

Kaynağa dayalı iş akışıÇalıştırma kıyaslaması değildir

Çalışma Yaklaşımı

Landing Page Design tek bir teklif, tek bir hedef kitle ve tek bir birincil eylemle başlar. İlk yarısı dönüşüm hedefini, itirazları, trafik bağlamını, kanıtı ve kısıtları toplar; ardından geliştirmeden önce bölüm sırasını ve metni önerir. İkinci yarısı tipografi, boşluk, köşe yarıçapları, hero alanları, ikonlar, hareket ve bileşen durumları için ayrıntılı bir görsel sistem tanımlar.

Bu, tarafsız bir kontrol listesinden çok, alışılmadık ölçüde görüş bildiren bir beceridir. Kısıtlı yazı tipi ve boşluk seçimleri, zorunlu bir slogan açılış bölümü ve belirli animasyon kuralları içerir. Bu tercihler yerleşik bir marka sistemiyle veya erişilebilirlik gereksinimleriyle çelişebilir ve bunları sessizce geçersiz kılmamalıdır. Yüksek dönüşüm çerçevesi bir niyettir; ölçülmüş bir dönüşüm artışının kanıtı değildir.

Beklenen Çıktılar

  • Sayfa taslağı, hero metni, faydalar, iş akışı ve SSS taslağı.
  • Uygun olduğunda başlık ve açıklama içeren bir index/noindex önerisi.
  • Seçilen yerleşim ve görsel kurallarla bölüm bölüm uygulama.
Örnek Brife Bak

Brifden İncelemeye

  1. 01
    Teklifi Netleştirin

    Hedef kitleyi, eylemi, itirazları, trafik kaynağını ve gerçek kanıt materyallerini tek bir ön görüşmede toplayın.

  2. 02
    Argümanı Seçin

    Klasik hero, uzun anlatı, minimal dönüşüm sayfası veya karşılaştırma yapısından birini seçin ve nedenini açıklayın.

  3. 03
    Geliştirmeden Önce Taslak Hazırlayın

    Uygulamadan önce taslağı, metni, SEO yaklaşımını ve yerleşim önerisini hazırlayın.

  4. 04
    Bölüm Bölüm Geliştirin ve İnceleyin

    Sayfada sırayla ilerleyin; durumları, bağlantıları, anlamsal yapıyı, meta verileri ve marka kısıtlarını kontrol edin.

02 Kullanım Alanları

Ne Zaman Kullanılır?

Tek bir uygulama çalışma ortamı gerekmez; uygulama örnekleri Tailwind değerlerine, IntersectionObserver'a ve isteğe bağlı hareket araçlarına başvurur.

İyi Bir Uyum

  • Tek Teklifli KampanyalarZiyaretçinin açıkça tanımlanmış tek bir sonraki adımı atması gerektiğinde işe yarar.
  • Stratejiden UygulamayaMetin ve itiraz yönetimini somut yerleşim ve durum kararlarına bağlar.

Kontrol Edilecek Sınırlar

  • Dönüşüm Garantisi YokKaynak, tasarım ve metin kuralları sunar; teklifinizle yapılmış bir deneyin sonuçlarını sunmaz.
  • Marka Kuralları ÇelişebilirÖngördüğü yazı tipleri, gradyanlar, hareket ve metin harf biçimi, mevcut ürünler için evrensel gereksinimler değildir.
  • Kanıt Gerçek OlmalıGerçekmiş gibi görünen istatistikler, müşteri adları veya garantiler asla olgusal kanıt olarak uydurulmamalıdır.

Bu Girdileri Hazırlayın

  • Teklif ve DönüşümZiyaretçilerin ne alacağını ve hangi eylemin başarı sayıldığını belirtin.
  • Hedef Kitle ve İtirazlarZiyaretçi bağlamını, trafik kaynağını ve tereddüdün gerçek nedenlerini sağlayın.
  • Kanıt ve Marka KısıtlarıOnaylı ekran görüntülerini, kullanıcı yorumlarını, verileri, koşulları ve tasarım sistemi gereksinimlerini sağlayın.

03 Önemli Kararlar

Önemli Kararlar

  1. Süslemeden Önce Yapı

    Sayfa argümanı görsel kurallardan önce seçilir; bu, ikna edici bir rolü olmayan bölümleri parlatma riskini azaltır.

  2. Trafik Niyeti Önemlidir

    Kısa, yüksek niyetli bir indirme sayfası, eğitici bir arama açılış sayfasından farklı bir argüman gerektirir.

  3. Varsayılanlarını İnceleyin

    Kaynağın ayrıntılılığı, yalnızca güçlü görsel varsayımları projeye uyduğunda yararlıdır.

04 Örnek Görev Tanımı

Odaklı Bir Brifle Deneyin

Aşağıdaki örnek brif test edilmemiştir. Kullanmadan önce becerinin kurulumunu kontrol edin.

Kurulumu İnceleyin

Deponun güncel kurulum yolunu kullanın ve Beceri klasörünün tamamını ekleyin. Kaynak, barındırılan bir sayfa oluşturucu değil, bir tasarım kural setidir.

Üst Kaynak Dosyası
https://github.com/elayadesign/ai-design-skills/blob/1c1e97cb9878e236552c772092dda7adcdddbcb2/skills/landing-page-design/SKILL.md

Tek bir uygulama çalışma ortamı gerekmez; uygulama örnekleri Tailwind değerlerine, IntersectionObserver'a ve isteğe bağlı hareket araçlarına başvurur.

Tek Bir Çıktıyla Başlayın

Beceriyi çalıştırmadan önce bu brifteki kapsamı, kaynak materyali ve kısıtları uyarlayın.

Örnek Brif
design-review ürünümüz için kalıcı bir sayfayı planlamak üzere landing-page-design kullan. Hedef kitle küçük ajanslar, eylem ise demo talep etmek. Yalnızca sağlanan ekran görüntülerini ve doğrulanmış kanıtı kullan. Kodlamadan önce taslağı, hero metnini, itiraz odaklı SSS'yi, SEO önerisini ve yerleşim seçimini ver. Mevcut marka belirteçlerimizi ve azaltılmış hareket gereksinimlerimizi koru.

Sonucu İnceleyin

Gerçek çıktıyı bu gözlemlenebilir ölçütlere göre kontrol edin.

  • Hero'dan son CTA'ya kadar tek bir birincil eylem tutarlıdır.
  • Her olgusal kanıt noktası sağlanan kanıttan gelir.
  • Görsel kurallar mevcut marka ve erişilebilirlik gereksinimleriyle uzlaştırılmıştır.

OpenDesign, kodlama ajanları için yerel bir tasarım çalışma alanı sağlar. Bu liste, becerinin pakete dahil olduğu veya harici araçlarının, kimlik bilgilerinin ve yazılım bağımlılıklarının dahil olduğu anlamına gelmez.

05 Kaynak ve Lisans

Kaynak ve Lisans

Bu sayfa, aşağıda bağlantısı verilen sabitlenmiş kaynak sürümünü anlatır. Kaynaktaki davranış ve gereksinimler değişebilir.

Kaynak Sahibi
elayadesign
Lisans
MIT
İncelenen Sürüm
2026-10-07 · 1c1e97cb9878
Editoryal Kaynak Özeti
Teklifi, metni, yapıyı ve SEO yaklaşımını planlayın; ardından kaynaktaki ayrıntılı görsel kuralları projeye uyduğu yerlerde uygulayın.

OpenDesign tarafından, bağlantılı kaynağa dayanan özgün özet. Depo yıldızları tarihli bir popülerlik göstergesidir; beceri kullanımı veya kalite puanı değildir.

06 Başlamadan Önce Sorular

Başlamadan Önce Sorular

Yalnızca ana sayfalar için mi tasarlandı?

Hayır. Temel ayrımı, açılış sayfasının birden fazla hedef kitleye veya hedefe hizmet eden bir ana sayfanın aksine tek bir teklife ve niyete hizmet etmesidir.

Mevcut bir sitede her öneriye uyulmalı mı?

Hayır. Kendi kapsamı açık kullanıcı talimatlarını kabul eder; yerleşik bir marka veya erişilebilirlik gereksinimi sessizce üzerine yazılmak yerine çözümlenmelidir.

SSS eklemek arama görünürlüğünü garanti eder mi?

Hayır. Yararlı soru-cevap içeriği ve uygun meta veriler önerir; dizine eklenme ve arama performansı ayrı sonuçlardır.

OpenDesign

Bir Sonraki Tasarım Yinelemesine Yer Açın.

Brifinizi, kaynak materyalinizi ve tasarım çalışmanızı yerel bir çalışma alanında bir arada tutun. İş akışınıza eklemeden önce becerinin kendi kurulumunu kontrol edin.

Üst Kaynak Dosyası
https://github.com/elayadesign/ai-design-skills/blob/1c1e97cb9878e236552c772092dda7adcdddbcb2/skills/landing-page-design/SKILL.md