Yapay Zekâ ile Web Sitesi Nasıl Yapılır? Fikirden Yayına Adım Adım

Bir kafe, bir fotoğrafçı, bir psikolog ya da bir öğrenci kulübü… Bugün tek bir paragrafla yapay zekâya web sitesi yaptırmak mümkün. Sohbet kutusuna "bana bir kafe sitesi yap" yazdığınızda birkaç saniye içinde çalışan bir sayfa çıkıyor. Sorun şu: bu sayfaların çoğu birbirinin aynısı. Mor-mavi geçişli bir başlık, ortada büyük bir yazı, altında üç kart ve "Hemen Başla" düğmesi.

Fark yaratan şey araç değil, yapay zekâya ne verdiğiniz. Sitenin kime hitap ettiği, hangi soruya cevap verdiği, gerçek metinleriniz ve fotoğraflarınız, beğendiğiniz örnekler… Bu rehberde fikirden yayına kadar bütün yolu anlatıyoruz:

Hangi aracın size uygun olduğunu seçmek,
Yapay zekâya verilecek site brief'ini hazırlamak,
İlk sürümü üretip parça parça düzeltmek,
Siteyi ücretsiz bir adreste yayına almak ve kendi alan adınızı bağlamak.

Kod yazmanız gerekmiyor. Yalnızca ne istediğinizi net anlatmanız gerekiyor.

Adım Adım Uygulama

Yapay zekâ ile site yapmanın dört yaygın yolu var. Hepsi aynı işi yapar ama size bıraktıkları kontrol farklıdır:

Uygulama oluşturucular (Lovable, Bolt): Tarayıcıda çalışır, siteyi sohbet ederek kurar ve tek tıkla yayınlar. Giriş formu, veritabanı ya da üyelik gibi özellikler de ekleyebilir. Ücretsiz planda kullanım hakkı sınırlıdır; kendi alan adınızı bağlamak için genellikle ücretli plan gerekir.
Google AI Studio (Build): Google hesabıyla ücretsiz başlanır. Yazdığınız tarifle uygulamayı kurar, önizler ve Google Cloud'a yayınlar. Yayınlanan uygulamanın sunucu maliyeti ücretsiz kotayı aşarsa ücretlenebilir; faturalandırmayı açmadan önce bunu bilin.
Sohbet asistanları (Claude, ChatGPT, Gemini): Tek sayfalık bir siteyi tek bir HTML dosyası olarak yazar ve sohbetin içinde önizletir. Dosyayı indirip istediğiniz yerde yayınlarsınız. En ucuz ve en esnek yol budur.
Kodlama ajanları (Claude Code, Codex, Cursor): Bilgisayarınızdaki proje klasöründe çalışır, dosyaları kendisi oluşturur ve düzenler. Çok sayfalı, uzun ömürlü ve özgün tasarımlı siteler için en güçlü yoldur ama biraz alışma ister.

Kısa öneri: İlk sitenizse ve tek sayfa yeterliyse sohbet asistanıyla başlayın. Üyelik, form ya da veritabanı gerekiyorsa uygulama oluşturucu kullanın. Siteyi yıllarca büyütecekseniz kodlama ajanına geçin.

İpucu

Hangi yolu seçerseniz seçin, 2. adımdaki brief aynı kalır. Bir araçta beğenmediğiniz sonucu aynı brief ile başka bir araçta denemek birkaç dakikanızı alır.

Yapay zekâ boşlukları en sık görülen seçeneklerle doldurur. Siteler bu yüzden birbirine benziyor. Boşluk bırakmamak için aracı açmadan önce kısa bir brief hazırlayın:

Site: Kadıköy'de 12 masalık bir üçüncü dalga kahve dükkânı, adı "Sokak Arası".
Ziyaretçi kim: Yakında çalışan, laptopla oturacak sessiz bir yer arayan 25-40 yaş arası insanlar.
Sitenin tek amacı: İnsanların dükkânın yerini, saatlerini ve çalışmaya uygun olup olmadığını 10 saniyede anlaması.
Sayfa bölümleri: Giriş, menüden 6 ürün, "çalışmak için" bilgileri (priz, wifi, sessiz saatler), konum ve saatler, Instagram.
Ton: Samimi, kısa cümleler, abartısız. "Eşsiz deneyim" gibi kalıp ifadeler yok.
Görünüm: Sıcak, kağıt ve kahve tonları, el yazısı değil sade bir serif başlık fontu. Mor, mavi geçişler ve parlayan efektler yok.
Benzemesini istediğim siteler: [beğendiğiniz 2 sitenin adresi ve neyini beğendiğiniz]
Gerçek bilgiler: Adres, saatler, telefon ve menü aşağıda. Uydurma yorum, rakam veya ödül ekleme.
[bilgileriniz]

Brief'in en değerli satırı "sitenin tek amacı" satırıdır. Bunu yazamıyorsanız yapay zekâ da yazamaz; sonuç her şeyi biraz anlatan ama hiçbir şeyi net söylemeyen bir sayfa olur.

İpucu

Brief'i ChatGPT ya da Gemini'ye yazdırabilirsiniz: "Bir web sitesi yaptıracağım. Bana tek tek soru sorarak site brief'imi çıkar; her seferinde tek soru sor." Sorulara cevap verdikçe brief kendiliğinden oluşur.

Yapay zekâya metin bırakırsanız "Hayallerinizi gerçeğe dönüştürüyoruz" gibi cümleler yazar. Görsel bırakırsanız stok fotoğraf yer tutucuları koyar. İkisi de sitenizi sıradanlaştırır.

Metin: Her bölüm için iki üç cümleyi kendiniz yazın ya da sohbet asistanıyla birlikte yazın, sonra siteyi yapacak araca hazır metin olarak verin.
Fotoğraf: Telefonla çekilmiş gerçek fotoğraflar, mükemmel ama yapay görünen görsellerden daha güven verir. Dükkânınızın, ürününüzün ya da sizin üç beş net fotoğrafınız yeterli.
Logo ve renkler: Varsa logonuzu ve kullandığınız renk kodlarını verin. Yoksa brief'teki "görünüm" satırı yeterli olur.

Aşağıdaki bilgilerle bir kafe sitesinin bölüm metinlerini yaz. Her bölüm en fazla iki kısa cümle olsun. Abartılı sıfat, ünlem ve kalıp reklam cümlesi kullanma. Bilgi uydurma; eksik bilgi varsa köşeli parantezle [eksik] yaz.

[brief ve bilgileriniz]

İpucu

Fotoğrafları yüklemeden önce yatay ve dikey birer sürüm hazırlayın. Aynı fotoğraf masaüstünde geniş, telefonda dar bir alana sığmak zorunda kalır.

Dikkat Edilecek Nokta

Başka sitelerden ya da Google Görseller'den bulduğunuz fotoğrafları izinsiz kullanmayın. Kendi fotoğraflarınızı ya da lisansı açıkça belirtilmiş görselleri kullanın.

Seçtiğiniz araçta brief'i ve hazır metinleri tek mesajda gönderin. Araçlara göre kısa yol:

Lovable / Bolt: lovable.dev ya da bolt.new adresinde ücretsiz hesap açın, ana sayfadaki kutuya brief'i yapıştırın. Araç projeyi kurar ve sağda canlı önizlemeyi gösterir.
Google AI Studio: aistudio.google.com adresinde Build bölümünü açın ve brief'i yazın. Uygulama kurulduktan sonra önizleme sağ tarafta açılır.
Claude / ChatGPT / Gemini: Brief'in sonuna şu satırı ekleyin:

Bunu tek bir HTML dosyası olarak yaz; CSS ve JavaScript dosyanın içinde olsun. Telefon ekranında da düzgün görünsün. Görseller için şimdilik img etiketleri koy, dosya adlarını ben vereceğim: hero.jpg, menu-1.jpg ... menu-6.jpg.

Claude ve Gemini'de sonuç sohbetin yanında önizleme olarak açılır; ChatGPT'de Canvas bölümünde görürsünüz. İlk sürüme hemen itiraz etmeyin; önce telefonda ve bilgisayarda nasıl göründüğüne bakın.

İpucu

İlk mesajda her şeyi istemeyin. Üyelik, ödeme, çok dil gibi özellikleri site oturduktan sonra tek tek ekleyin; yapay zekâ bir seferde ne kadar az şey değiştirirse o kadar az şeyi bozar.

İlk sürüm nadiren son sürümdür. Düzeltme isterken neyin değişeceğini ve neyin kalacağını söyleyin:

Giriş bölümündeki başlık çok büyük, telefonda üç satıra taşıyor. Başlığı küçült ve tek cümleye indir: "Çalışmak için sessiz, kahve için iyi." Diğer bölümlere dokunma.

Bir düzeltmeyi anlatmakta zorlanıyorsanız ekran görüntüsü alıp sorunlu yeri gösterin. Görseli anlayan araçların hepsi ekran görüntüsüyle verilen talimatı çok daha iyi uygular.

Yayından önce şu kontrol listesini kendiniz yapın:

Telefon, tablet ve bilgisayarda açtınız mı? Yatay kaydırma çıkıyor mu?
Bütün düğmeler ve bağlantılar bir yere gidiyor mu?
Telefon numarası tıklanınca arıyor, adres tıklanınca harita açılıyor mu?
Uydurma yorum, sahte rakam ya da "Lorem ipsum" kaldı mı?
Sayfanın başlığı ve açıklaması (tarayıcı sekmesinde ve Google'da görünen metin) doğru mu?

İpucu

Beğendiğiniz bir sürüme ulaştığınızda kaydedin: Lovable ve Bolt'ta sürüm geçmişi var, sohbet asistanlarında ise dosyayı indirip adını "v1" koyun. Sonraki bir düzeltme siteyi bozarsa geri dönebilirsiniz.

Sitenin herkes tarafından açılabilmesi için bir sunucuda yayınlanması gerekir. Kullandığınız yola göre:

Lovable / Bolt: Sağ üstteki Publish / Deploy düğmesi siteyi aracın kendi alt alan adında yayınlar (ör. sokak-arasi.lovable.app).
Google AI Studio: Uygulamayı paylaşma ya da Google Cloud'a yayınlama seçeneğini kullanın. Cloud'a yayın için faturalandırma hesabı istenir.
Tek HTML dosyası: Dosyanın adını index.html yapın, görsellerle birlikte bir klasöre koyun. app.netlify.com/drop adresini açıp klasörü sayfaya sürükleyin; birkaç saniye içinde siteniz bir Netlify adresinde yayında olur. Siteyi kalıcı yapmak ve sonra güncellemek için ücretsiz bir Netlify hesabıyla giriş yapın. GitHub kullanıyorsanız GitHub Pages da ücretsiz bir seçenektir.

Kendi alan adınız için: Bir alan adı firmasından adınızı satın alın, ardından yayın yaptığınız aracın alan adı ayarlarında gösterilen kayıtları (genellikle bir CNAME ya da A kaydı) alan adı firmasının DNS paneline girin. Yayılması birkaç dakikadan birkaç saate kadar sürebilir.

İpucu

Siteyi yayınladıktan sonra Google Search Console'a ekleyip sitemap gönderin. Böylece Google sitenizi beklemeden tarar ve hangi aramalarda çıktığınızı görebilirsiniz.

Dikkat Edilecek Nokta

Uygulama oluşturucuların ücretsiz planlarında site, aracın rozetini ya da alt alan adını taşır. Kurumsal bir iş için kullanmadan önce planın alan adı ve rozet kurallarını kontrol edin.

Site yayında; şimdi küçük ama önemli işler var:

Formlar: İletişim formu e-postaları gerçekten size geliyor mu, bir kez deneyin. Form verisi bir veritabanına yazılıyorsa o verinin kimin erişimine açık olduğunu araca sorun.
Anahtarlar ve şifreler: API anahtarı, şifre ya da ödeme bilgisi gibi gizli bilgiler sayfanın kodunda görünmemeli. Yapay zekâya açıkça "gizli anahtarları istemci tarafına koyma" deyin.
Kişisel veriler: Ziyaretçiden ad, telefon ya da e-posta topluyorsanız KVKK kapsamında aydınlatma metni gerekir. Yapay zekâya taslak yazdırabilirsiniz ama metni işinize göre kontrol edin.
Güncelleme: Saatler, fiyatlar ya da menü değiştiğinde aynı sohbete ya da projeye dönüp yalnızca o bölümü değiştirmesini isteyin.

İpucu

Siteye bir "son güncelleme" tarihi koyun ve ayda bir kez telefonunuzdan açıp kontrol edin. Çalışmayan bir düğme, kapanmış bir sayfadan daha çok müşteri kaybettirir.

Dikkat Edilecek Nokta

Ödeme alan, üyelik tutan ya da sağlık ve finans gibi hassas veri işleyen sitelerde yapay zekânın yazdığı kodu yayına almadan önce bir yazılımcıya kontrol ettirin.

Bu adımları izlediğinizde elinizde gerçek metinlerinizle yazılmış, telefonda düzgün görünen ve herkesin açabileceği bir adreste yayında olan bir web sitesi olur. Kod satırı yazmadınız ama sitenin her kararını siz verdiniz: kime hitap ettiğini, ne söylediğini ve nasıl göründüğünü.

Siteniz çalışıyor ama "yapay zekâ yapmış" gibi görünüyorsa, bir sonraki adım tasarımı özgünleştirmek. Sitenizin metinlerini yazdırmak için hazır promptlarımıza, kodlama araçlarını tanımak için Lovable, Bolt, Claude Code sayfalarına ve Bolt mu Lovable mı karşılaştırmasına göz atın.

Sık sorulan sorular

Yapay zekâ ile web sitesi yapmak ücretsiz mi? Başlamak ücretsiz. Lovable ve Bolt gibi araçların ücretsiz planları günlük ya da aylık sınırlı kullanım hakkı verir; Google AI Studio'da uygulama oluşturmaya ücretsiz başlanır. Tek sayfalık basit bir siteyi Netlify Drop ya da GitHub Pages ile ücretsiz yayınlayabilirsiniz. Kendi alan adınız (ör. kafeniz.com) ise yıllık ücretlidir.

Kod bilmem gerekiyor mu? Hayır. Ama sitenin dosyalarının nerede durduğunu ve nasıl yayına alındığını bilmek, ileride bir şey bozulduğunda çok işinize yarar. Bu rehberdeki 6. adım tam olarak bunun için.

Yapay zekânın yaptığı site Google'da çıkar mı? Çıkabilir; Google sitenin kimin yaptığına değil, içeriğin işe yarayıp yaramadığına bakar. Her sayfanın net bir başlığı, açıklayıcı metni ve gerçek bilgileri (adres, çalışma saatleri, hizmetler) olmalı. Yapay zekânın uydurduğu müşteri yorumlarını ve sahte rakamları mutlaka silin.

WordPress mi, yapay zekâ mı? Sık güncelleyeceğiniz bir blog, yönetim paneli ya da çok sayfalı bir mağaza istiyorsanız WordPress gibi hazır sistemler hâlâ pratik. Tanıtım sitesi, portfolyo, etkinlik ya da kampanya sayfası gibi az değişen sitelerde yapay zekâ ile sıfırdan yapmak çok daha hızlıdır.