SEO, hız ve sık hatalar
Site yayında ama iş burada bitmiyor. Sayfa başlığından görsel boyutuna, class çorbasından mobil kırılıma kadar, canlıya almadan önce son bir kontrol turu atıyoruz.
Siteni kendi alan adında yayına aldın. Ama "yayında olmak" ile "doğru kurulmuş olmak" farklı şeyler. Bu son bölümde, arama motorlarının seni bulmasını sağlayan temel ayarları, sitenin hızını etkileyen basit alışkanlıkları ve yeni başlayanların en sık düştüğü hataları anlatıyorum.
Sayfa başlığı, meta açıklama, alt metin: nerede ayarlanır
Her sayfanın, arama sonuçlarında göründüğünde taşıdığı bir başlık ve kısa açıklama var. Webflow'da bunu her sayfanın kendi ayarları içindeki "SEO" (ya da "Search Settings") bölümünden giriyorsun; sayfa başlığı, meta açıklama ve arama sonuçlarında paylaşıldığında görünecek görsel gibi alanlar burada.

Kaynak: Webflow paneli, erişim Temmuz 2026.
Kaynak: help.webflow.com, erişim Temmuz 2026.
CMS ile yönetilen sayfalarda (örneğin her blog yazısı) bu ayarları tek tek her sayfa için elle girmek yerine, collection'ın şablonunda dinamik alanlara bağlıyorsun; yani her yazının kendi başlığı, otomatik olarak o yazının SEO başlığı da oluyor. Bunu dördüncü bölümde gördüğün dinamik alan mantığıyla aynı şekilde düşün.
Görsellerin de bir "alt metin" (alternatif metin) alanı var; bu, görselin ne gösterdiğini yazıyla anlatan, hem görme engelli ziyaretçiler için ekran okuyuculara hem arama motorlarına görselin içeriğini anlatan bir alan. Her görseli yüklerken bu alanı boş bırakmadan, kısa ve açıklayıcı doldur.
Görsel boyutu ve hız temelleri
Sitenin hızını en çok etkileyen tek şey genelde görsellerin boyutu. Telefonundan ya da bilgisayarından doğrudan çektiğin, sıkıştırılmamış büyük dosyaları olduğu gibi yüklemek, sayfanın açılışını yavaşlatıyor.
Basit bir alışkanlık edin: görseli yüklemeden önce, sitede gösterileceği gerçek boyuta yakın bir ölçüye getir ve sıkıştır. Bir görseli ekranda 800 piksel genişliğinde göstereceksen, 4000 piksel genişliğinde bir dosya yüklemenin hıza hiçbir katkısı yok, sadece sayfanın yüklenmesini yavaşlatıyor.
Bu konuda kesin bilmediğin bir noktayı varsayımla geçme; kendi sitende bir görsel yükledikten sonra dosya boyutunun nasıl değiştiğini kontrol ederek gör.
Sık hatalar
Class çorbası. Yeni başlayanların en sık düştüğü hata, her elemana ayrı, tekrar kullanılmayan bir class ismi vermek ("div-1", "div-2", "hero-baslik-ozel" gibi onlarca benzersiz isim). Üçüncü bölümde anlattığım "bir kez tanımla, her yerde kullan" mantığını unutup her elemanı tek tek, sıfırdan stillersen, bir gün genel bir değişiklik yapmak istediğinde onlarca yeri tek tek düzeltmek zorunda kalırsın. Mümkün olduğunca aynı görünmesi gereken elemanlara aynı class'ı ver, farklı olması gereken küçük detaylar için ek (kombine) class kullan.
Mobil kırılımı ihmal etmek. Masaüstünde güzel görünen bir tasarımı kurup, telefon kırılımına hiç bakmadan yayına almak sık yapılan bir hata. Üçüncü bölümde gördüğün responsive kırılım seçiciyle, her sayfanı en azından telefon (dikey) görünümünde kontrol et. Yan yana duran kutuların telefonda üst üste binmesi, yazıların ekrandan taşması gibi sorunlar sadece o kırılıma geçip baktığında görünür.
Görsel boyutlarını kontrolsüz bırakmak. Yukarıda değindiğim gibi, büyük boyutlu görselleri olduğu gibi yüklemek hem hızı düşürür hem de bazı planlarda barındırma alanını gereksiz yere doldurur.
CMS gerektirmeyen bir işi CMS ile kurmak (ya da tam tersi). Dördüncü bölümde ayırdığımız gibi, iki üç tane statik sayfayı CMS collection'ı olarak kurmak gereksiz bir karmaşıklık ekliyor; tam tersi, onlarca tekrar eden içeriği elle, tek tek sayfa açarak yönetmeye çalışmak da seni zamanla yoruyor. Doğru araç, işin gerçek yapısına göre seçilir.
Canlıya almadan önce kontrol listesi
Siteni son kez yayına almadan önce şu turu at:
- Her sayfanın başlığı ve meta açıklaması dolu mu, jenerik bir "Home" ya da boş bırakılmış bir alan var mı?
- Her görselin alt metni var mı?
- Büyük, sıkıştırılmamış görsel dosyası kaldı mı?
- Telefon kırılımında her sayfayı gözden geçirdin mi, taşan ya da üst üste binen bir eleman var mı?
- Class isimlerin tutarlı ve tekrar kullanılabilir mi, yoksa her elemana ayrı isim mi verdin?
- Formların (varsa) doğru çalıştığını, bir test gönderimiyle kontrol ettin mi?
- Kendi alan adında (staging değil) siteyi açıp kilit ikonunun (SSL) göründüğünü kontrol ettin mi?
Seriyi tamamladın
Bu seride, Webflow'un kime uygun olduğuna karar vermekten başladın; hesap açtın, tasarımın dört temel taşını (section, container, div, class) öğrendin, CMS ile tekrar eden içeriği yönetmeyi gördün, kendi alan adında yayına almayı kurdun ve şimdi SEO/hız temellerini, sık hataları biliyorsun. Bundan sonrası, öğrendiklerini kendi sitende tekrar tekrar uygulayarak pekiştirmek.
Bölüm kontrol listesi
- Sayfa başlığı, meta açıklama ve alt metin alanlarının nerede ayarlandığını biliyorum
- Görsel boyutunun hıza etkisini anladım ve büyük dosya yüklemekten kaçınacağımı biliyorum
- Class çorbası ve mobil kırılım ihmali gibi sık hataları tanıyorum
- Canlıya almadan önceki kontrol listesini kendi siteme uyguladım
Bu seriyi bitirdin. Haftalık bültende bu araçlardaki güncellemeleri de paylaşıyorum, istersen katıl: