2026'da Ücretsiz Statik Web Sitesi Nasıl Barındırılır: GitHub Pages, Cloudflare Pages ve İletişim Formları

2026 yılında doğru statik web sitesi barındırma platformunu seçmek, sitenin hızlı, güvenli ve bakımı kolay kalmasını sağlarken yılda yüzlerce dolar tasarruf etmeni mümkün kılıyor. Ücretsiz plan seçenekleri artık oldukça olgunlaştı; GitHub Pages ve Cloudflare Pages gibi platformlar sıfır maliyetle üretim kalitesinde altyapı sunuyor. Ancak çoğu rehberin atladığı bir sorun var: Sunucu olmadan statik bir sitede iletişim formlarını nasıl çalıştırırsın? Bu rehber, platform seçiminden çalışan bir iletişim formu kurmaya kadar tüm süreci somut örnekler ve bilmen gereken gerçek kısıtlamalarla adım adım anlatıyor.

Ücretsiz Statik Barındırma Neden Dikkat Çekiyor?

Statik bir web sitesi, önceden derlenmiş HTML, CSS ve JavaScript dosyalarını doğrudan tarayıcıya sunar. PHP yok, Node.js runtime'ı yok, her sayfa yüklemesinde çalışan bir veritabanı sorgusu yok. Bu sadelik, ücretsiz statik sayfa barındırmanın bu kadar güvenilir olmasının temel nedeni: çökecek, yama gerektirecek ya da ölçeklendirilecek bir şey bulunmuyor.

Küçük işletmeler, portföy siteleri, SaaS açılış sayfaları ve dokümantasyon siteleri için statik barındırma her kutuyu işaretliyor:

• Hız: Dosyalar bir CDN edge node'undan sunulur, küresel ölçekte genellikle 100ms'nin altında.
• Güvenlik: Sunucu tarafı runtime olmaması, saldırı yüzeyini ciddi ölçüde küçültür.
• Maliyet: GitHub Pages ve Cloudflare Pages, hem açık hem de pek çok özel proje için ücretsizdir.
• Kolaylık: Kodu bir repository'e push et, site otomatik olarak deploy edilsin.

Tek gerçek kısıt dinamik işlevsellik. Kullanıcı kimlik doğrulama, alışveriş sepeti veya form işleme gibi sunucu tarafı mantık gerektiren her şey için harici bir servis kullanman gerekiyor. Kurulum adımlarına geçerken bunu aklında tut.

Platform Karşılaştırması: GitHub Pages ve Cloudflare Pages

Özet: Hedef kitlen küresel ve mümkün olan en hızlı yükleme sürelerini istiyorsan Cloudflare Pages öne çıkıyor. Ekibin zaten GitHub'da yaşıyorsa ve en basit kurulumu istiyorsan GitHub Pages gayet iyi bir seçenek.

Adım Adım: GitHub Pages'te Yayına Al

Bu örnek, yayına almaya hazır basit bir HTML/CSS sitene sahip olduğunu varsayıyor. Hugo veya Jekyll gibi bir statik site üreteci kullanıyorsan süreç neredeyse aynı.

1. Bir GitHub repository'si oluştur. github.com/new adresine git ve açık bir repository oluştur. Kök alanda yayınlamak istiyorsan kullanici-adin.github.io adını ver; alt dizin yolunda yayınlamak istiyorsan istediğin adı kullanabilirsin.
2. Site dosyalarını push et. Yerel proje klasöründen şu komutları çalıştır:
   Kopyala

   git init
   git remote add origin https://github.com/your-username/your-repo.git
   git add .
   git commit -m "Initial deploy"
   git push -u origin main

3. GitHub Pages'i etkinleştir. Repository'de Settings > Pages bölümüne git. "Source" altında main branch'ini ve /root klasörünü seç (build çıktın oraya gidiyorsa /docs'u da seçebilirsin). Kaydet'e tıkla.
4. Deploy'u bekle. GitHub 1-3 dakika içinde derleme ve deploy işlemini tamamlar. Canlı URL (örn. https://kullanici-adin.github.io) Pages ayarları panelinde görünür.
5. Özel alan adı bağla (isteğe bağlı). Repository kök dizinine alan adını içeren bir CNAME dosyası ekle (örn. www.siteadın.com). Ardından DNS sağlayıcında bir CNAME kaydını kullanici-adin.github.io'ya yönlendir. GitHub birkaç dakika içinde SSL sertifikasını otomatik olarak sağlar.

Adım Adım: Cloudflare Pages'te Yayına Al

1. Cloudflare'e kaydol veya giriş yap. pages.cloudflare.com adresini ziyaret et ve GitHub ya da GitLab hesabını bağla.
2. Yeni bir proje oluştur. "Create a project" ardından "Connect to Git" seçeneğine tıkla. Listeden repository'ni seç.
3. Build ayarlarını yapılandır. Sitenin düz HTML ise build komutunu boş bırak ve çıktı dizinini / ya da index.html dosyanın bulunduğu konuma ayarla. Hugo için build komutu hugo, çıktı dizini public. Jekyll için jekyll build komutu ve _site çıktı dizinini kullan.
4. Deploy et. "Save and Deploy" seçeneğine tıkla. Cloudflare repository'ni klonlar, build'i çalıştırır ve küresel edge ağına yayınlar. Sitenin hemen bir *.pages.dev alt alan adı alır.
5. Özel alan adı ekle. Proje kontrol panelinde "Custom domains" bölümüne git ve alan adını gir. Alan adın zaten Cloudflare DNS tarafından yönetiliyorsa kurulum tek tıkla tamamlanır. Değilse, kayıt şirketinde bir CNAME kaydını *.pages.dev adresine yönlendirmen gerekir.

Ana branch'ine yapacağın her git push otomatik yeniden deploy'u tetikler. Cloudflare ayrıca pull request'ler için önizleme deploy'ları oluşturur; bu özellik değişiklikleri canlıya almadan önce incelemek için oldukça kullanışlı.

Statik Sitene İletişim Formu Ekle

Çoğu rehberin durduğu ve insanların takıldığı yer burası. Statik bir web sitesindeki iletişim formu veriyi kendisine gönderemez - dinleyen bir sunucu yok. Üç gerçekçi seçeneğin var:

• Form backend servisi (önerilen): Formun action attribute'unu, gönderimi alıp doğrulayan ve sana e-posta olarak ileten bir üçüncü taraf endpoint'ine yönlendirirsin.
• Sunucusuz fonksiyon: Formu işleyen küçük bir fonksiyon yazarsın (Cloudflare Workers, AWS Lambda). Çalışır ama kod gerektirir ve sürekli bakım ister.
• JavaScript fetch(): Tarayıcının fetch API'sini kullanarak form verisini bir backend endpoint'ine POST olarak gönderirsin. Teknik detaylar için JavaScript fetch() ile HTML form verisi nasıl gönderilir rehberimize bakabilirsin.

Çalışan bir forma ulaşmanın en hızlı yolu özel bir form servisi kullanmak. Sendform ile somut bir örnek:

Somut Örnek: 5 Dakikada Çalışan İletişim Formu

Diyelim ki GitHub Pages'te yayınlanmış bir portföy sitesi var. Ziyaretçilerin sana mesaj gönderebilmesini ve bu mesajların e-posta kutuna ulaşmasını istiyorsun. İşte tüm HTML kodu:

<form action="https://sendform.io/f/YOUR_FORM_ID" method="POST">
  <label for="name">Adın</label>
  <input type="text" id="name" name="name" required>

  <label for="email">E-posta Adresin</label>
  <input type="email" id="email" name="email" required>

  <label for="message">Mesaj</label>
  <textarea id="message" name="message" rows="5" required></textarea>

  <button type="submit">Gönder</button>
</form>

Entegrasyon bu kadar. YOUR_FORM_ID kısmını Sendform kontrol panelindeki ID ile değiştirirsin; her gönderi kayıt olduğun e-posta adresine iletilir. Backend kodu yok, sunucu yok, aylık altyapı faturası yok. Gönderim sonrası yönlendirme sayfaları ve onay e-postaları gibi daha gelişmiş deneyim kalıpları için statik web sitesi formları için en iyi uygulamalar rehberimizi okuyabilirsin.

Statik sitenin yanında bir web sitesi oluşturucu da kullanıyorsan entegrasyon sürecini ayrıntılı olarak Sendform'u web sitesi oluşturucularla nasıl entegre edersin makalemizde ele aldık.

Yapılan Yaygın Hatalar

Binlerce kullanıcının ücretsiz statik web barındırma kurulumuna yardımcı olduktan sonra en fazla hayal kırıklığına yol açan hatalar bunlar:

1. 404 sayfasını unutmak

GitHub Pages ve Cloudflare Pages, bulunamayan bir route için genel bir hata sayfası gösterir. Kök dizinine özel bir 404.html dosyası oluştur. Bu, kullanıcıların sitende kalmasını sağlar ve marka deneyimini korur.

2. Gizli bilgileri açık bir repository'e eklemek

API anahtarları, form endpoint gizli değerleri ve e-posta adresleri asla açık bir GitHub repository'sinde bulunmamalı. Cloudflare Pages'te ortam değişkenlerini kullan ya da .gitignore dosyasına eklenmiş özel bir yapılandırma dosyasına başvur.

3. Backend planı olmadan form geliştirmek

Bu en yaygın hata. Geliştiriciler güzel bir iletişim formu tasarlıyor, GitHub Pages'e push ediyor ve yayın gününde formun sessizce başarısız olduğunu keşfediyor. İlk <input> etiketini yazmadan önce form backend'ini belirle. Sendform gibi araçlar, hiç kod yazmadan doğrudan e-postaya gönderen bir iletişim formu kurmanı sağlayarak backend sorununu tamamen ortadan kaldırıyor.

4. Build önbelleği sorunlarını görmezden gelmek

Push işleminden sonra sitenin güncellenmediğini fark edersen CDN önbelleği eski dosyaları sunuyor olabilir. Cloudflare Pages deploy sırasında önbelleği otomatik olarak temizler. GitHub Pages değişiklikleri daha yavaş yayar; 10 dakikaya kadar bekle ya da test sırasında varlık URL'lerine bir sorgu dizesi ekle.

5. Göreli yolları yanlış kullanmak

GitHub Pages siteniz kullanici-adin.github.io/proje-adi/ (bir alt dizin) adresinde yayınlanıyorsa tüm varlık yollarının bu ön eki hesaba katması gerekir. /styles.css gibi bir bağlantı çalışmaz. Göreli yollar (./styles.css) kullan ya da statik site üreticinin baseURL ayarını alt dizinle eşleşecek şekilde yapılandır.

6. Form iş akışı otomasyonunu atlamak

Formun gönderileri toplamaya başladığında yalnızca e-posta almaktan çok daha fazlasını yapabilirsin. Sendform, gönderileri otomatik olarak Slack'e, bir CRM'e veya bir tabloya yönlendirmeni sağlayan webhook ve entegrasyon desteği sunuyor. Webhook'lar ve API'lerle form iş akışlarını otomatikleştirme rehberimiz, backend kodu yazmadan bunu nasıl kuracağını adım adım gösteriyor.

Sonuç

Ücretsiz statik web sitesi barındırma hiç bu kadar güçlü olmamıştı. GitHub Pages, GitHub ekosisteminde çalışan ekipler için idealken Cloudflare Pages daha iyi küresel performans ve daha cömert bir ücretsiz plan sunuyor. Asıl zorluk barındırmanın kendisinde değil - insanları en çok takılan şey, özellikle iletişim formları gibi dinamik özellikler. Her iki platformu da özel bir form servisiyle eşleştirerek sıfır altyapı maliyetiyle tam işlevli, profesyonel bir web sitesi elde edebilirsin. Yukarıdaki platform rehberlerinden biriyle başla, siteni yayına al ve ardından gönderileri ilk günden güvenilir biçimde işlemek için Sendform ile iletişim formunu kur.

Statik Sitene Dakikalar İçinde İletişim Formu Ekle

Sendform ile GitHub Pages veya Cloudflare Pages üzerinde barındırılan herhangi bir statik siteden form gönderilerini topla. Backend kodu yok, sunucu kurulumu yok, karmaşıklık yok. Formunun action attribute'unu endpoint'ine yönlendirmen yeterli.

Sendform.net'te Ücretsiz Başla →

Sıkça Sorulan Sorular