Web Sitesi Tasarım Süreci: 8 Adımda Fikirden Yayına

Web sitesi tasarım süreci, çoğu işletme için belirsiz bir "kara kutu" gibi görünür: brif verilir, bir süre sonra tasarım gelir, beğenilmezse revizyon istenir. Oysa süreç açıkça tanımlandığında hem zaman hem bütçe kontrol altında kalır. Bu yazıda bir işletme sitesinin sekiz adımda nasıl yürütüldüğünü, her adımın çıktısını ve sizden beklenenleri anlatıyoruz.

Web Sitesi Tasarım Süreci Kaç Adımdan Oluşur?

Sürecin standart bir hali olmasa da iyi yürütülen projeler benzer sekiz adımdan geçer. Aşağıdaki tablo özet bir harita sunar; her adımı sonraki başlıklarda açıyoruz.

Adım	Çıktı	Sizden beklenen
1. Keşif	Yazılı brif ve hedefler	Amaç, kitle, rakipler
2. Kapsam ve site haritası	Sayfa listesi, işlev listesi	Onay
3. Tel kafes	Sayfa düzeni taslakları	Yerleşim geri bildirimi
4. Görsel tasarım	Ana sayfa ve örnek iç sayfa tasarımı	Marka dosyaları, geri bildirim
5. İçerik	Metin, görsel, referans	İçerik teslimi veya onayı
6. Geliştirme	Çalışan site (test ortamında)	Ara kontroller
7. Test	Hata ve iyileştirme listesi	Kabul testi
8. Yayın ve ölçüm	Canlı site, ölçüm kurulumu	Son onay

1. Keşif: Amacı Yazıya Dökmek

Keşif görüşmesi, projenin en ucuz ve en değerli adımıdır. Sitenin amacı, hedef kitle, rakipler, beğendiğiniz ve kaçındığınız örnekler ve başarı ölçütü konuşulur. Çıktı, iki tarafın da imzalayabileceği kısa, yazılı bir brif olmalıdır. Hazırlık için 12 soruluk kontrol listemizden yararlanabilirsiniz.

2. Kapsam ve Site Haritası

Bu adımda sayfa listesi, işlevler (form, randevu, ödeme, panel) ve entegrasyonlar yazılı hale getirilir. "Dahil olan" ve "dahil olmayan" listelerini ayrı ayrı yazmak, sonradan çıkacak kapsam tartışmalarını önler. Sayfa yapısının nasıl kurulacağını sayfa yapısı ve bilgi mimarisi yazımızda ele aldık.

3. Tel Kafes (Wireframe)

Tel kafes, sayfaların renksiz ve görselsiz düzenidir. Amacı "hangi blok nerede, hangi sırayla" sorusunu netleştirmektir. Yerleşim tartışması görsel tasarımın renkleri ve fotoğraflarıyla karışmaz; böylece geri bildirim yapıya odaklı kalır. Bu aşamadaki bir düzeltme, kodlama sonrasındaki aynı düzeltmeden belirgin biçimde ucuzdur.

4. Görsel Tasarım

Renk paleti, tipografi, düğme ve kart bileşenleri belirlenir. Genellikle ana sayfa ve bir örnek iç sayfa tasarlanır; onaydan sonra diğer sayfalar aynı bileşenlerle çoğaltılır. Kaliteli bir tasarım sistemi tutarlılığı sağlar ve ileride yeni sayfa eklemeyi kolaylaştırır. Profesyonel bir tasarımın ölçütlerini 12 ölçütlük listemizde bulabilirsiniz.

5. İçerik: Sürecin Sessiz Darboğazı

Web projelerinde gecikmenin ana kaynağı teknik iş değil içeriktir. Metinler geç gelir, görseller uygun çözünürlükte olmaz, referanslar için müşteri onayı beklenir. Bunu yönetmek için:

• İçerik teslim tarihini projenin başında takvime yazın.
• Metinleri sayfa bazında ve başlık yapısıyla birlikte hazırlayın.
• Gerçek fotoğrafları (ekip, ofis, iş örnekleri) stok görsele tercih edin.
• Referans yayımlamak için müşteriden yazılı izin alın.

6. Geliştirme

Onaylanan tasarım koda dökülür. Bu aşamada formlar, entegrasyonlar, çok dillilik gibi işlevler kurulur; ayrıca mobil uyum, hız ve teknik SEO altyapısı geliştirmeyle birlikte ele alınır, sonradan eklenmez. Teknoloji tercihinin sonuçlarını WordPress ve Next.js karşılaştırmamızda anlattık.

7. Test

Yayından önce şu testler yapılmalıdır:

• Cihaz ve tarayıcı: Telefon, tablet, masaüstü; Chrome, Safari, Firefox ve Edge.
• Hız: Core Web Vitals eşikleri (LCP 2,5 saniye altı, INP 200 ms altı, CLS 0,1 altı). Ayrıntı: web sitesi hızı ve Core Web Vitals.
• Formlar: Gönderim, e-posta ulaşımı, hata mesajları ve spam koruması.
• Erişilebilirlik: Klavye ile gezinme, kontrast, görsel alternatif metinleri.
• Bağlantılar: Kırık link, 404 sayfası ve yönlendirmeler.

8. Yayın ve Ölçüm

Yayın günü bir kontrol listesiyle yönetilir. Eski bir siteniz varsa değerli sayfalarını yeni karşılıklarına 301 ile yönlendirmek en kritik adımdır; atlanırsa arama motorundaki görünürlük düşebilir. Ardından:

1. Alan adı, SSL ve DNS yönlendirmelerini doğrulayın.
2. robots.txt ve site haritasının doğru olduğunu kontrol edin.
3. Sitenin Google Search Console'a eklendiğinden ve site haritasının gönderildiğinden emin olun.
4. Telefon, form ve WhatsApp tıklamaları için ölçüm olaylarını çalıştırın.
5. İlk haftalarda Search Console'daki tarama ve indeks raporlarını izleyin.

Süreyi Ne Uzatır, Ne Kısaltır?

Süreyi uzatan	Süreyi kısaltan
Geç veya eksik içerik	Baştan hazır metin ve görsel
Farklı kişilerden gelen çelişkili geri bildirim	Tek karar verici, toplu geri bildirim
Kapsamın süreç içinde büyümesi	Yazılı ve onaylı kapsam
Belirsiz marka kimliği	Hazır logo ve renk dosyaları
Çok sayıda özel entegrasyon	Sınırlı ve net işlev listesi

Onay ve Sorumluluk Matrisi: Kim Neyi Yapıyor?

Web projelerinde gecikmenin sık nedeni, kimin neyi ne zaman yapacağının belirsiz olmasıdır. Aşağıdaki matris (RACI mantığında sadeleştirilmiş), her aşamada kimin yürüttüğünü ve kimin onayladığını netleştirir. Kendi projeniz için bir kopyasını çıkarıp iki taraf da imzalayabilir:

Aşama	Yürüten	Onaylayan	Bilgilendirilen
Keşif ve brif	Tasarım ekibi	İşletme sahibi	İlgili ekip üyeleri
Kapsam ve site haritası	Tasarım ekibi	İşletme sahibi	Satış ve pazarlama
Tel kafes	Tasarım ekibi	İşletme sahibi	—
Görsel tasarım	Tasarım ekibi	İşletme sahibi	Pazarlama
İçerik hazırlığı	İşletme (metin), ekip (yerleşim)	İşletme sahibi	—
Geliştirme	Yazılım ekibi	Tasarım ekibi	İşletme sahibi
Test	Yazılım ekibi ve işletme	İşletme sahibi	—
Yayın ve ölçüm	Yazılım ekibi	İşletme sahibi	Tüm ilgililer

Tabloda en önemli sütun "onaylayan"dır. Her aşamada tek bir onaylayan bulunması, çelişkili geri bildirimleri ve sonu gelmeyen revizyon turlarını büyük ölçüde önler.

Örnek Takvim: Küçük Bir Kurumsal Site İçin Haftalık Akış

Aşağıdaki takvim, az sayfalı bir kurumsal sitenin nasıl ilerleyebileceğini gösteren tahmini bir örnektir; bir taahhüt değildir. Gerçek süre kapsama, içerik hazırlığına ve geri bildirim hızına göre değişir.

Dönem	Çalışma	Kritik bağımlılık
1. hafta	Keşif, kapsam, site haritası	Brifin ve marka dosyalarının teslimi
2. hafta	Tel kafes ve görsel tasarım	Tek seferde toplu geri bildirim
3. hafta	İçerik yerleşimi ve geliştirme başlangıcı	Metin ve görsellerin hazır olması
4. hafta	Geliştirme tamamlama, test, düzeltmeler	Kabul testi için zamanında yanıt
5. hafta	Yayın hazırlığı, yönlendirmeler, ölçüm kurulumu, yayın	Alan adı ve DNS erişimi

E-ticaret, çok dillilik veya özel entegrasyon içeren projelerde bu takvim ciddi ölçüde uzar. Bu yüzden sözleşmede süreyi "kapsam onaylandığında netleşir" diye tanımlayan bir ekip, baştan kesin tarih vaat eden bir ekipten çoğu zaman daha dürüsttür.

Kapsam Kayması Nasıl Yönetilir?

Kapsam kayması (scope creep), proje sürerken küçük eklemelerin birikip süreyi ve maliyeti büyütmesidir. "Şu sayfayı da ekleyelim", "bu formu da uzatalım" gibi talepler tek tek masum görünür. Yönetimi için üç pratik kural:

1. Kapsamı yazılı ve onaylı tutun: "Dahil olanlar" ve "dahil olmayanlar" ayrı listelenmiş olsun.
2. Her yeni talebi üç soruyla değerlendirin: Sitenin amacına hizmet ediyor mu? Ne kadar ek süre ve maliyet gerektiriyor? Sonraki sürüme bırakılabilir mi?
3. Değişiklikleri yazılı bir talep olarak alın: Sözlü eklemeler unutulur ve tartışma yaratır.

Amaç değişikliği engellemek değil, değişikliğin maliyetini görünür kılmaktır. Ziyaretçiye gerçekten fayda sağlayan bir ekleme, bilinçli karar olarak sürece girmelidir.

Yayın Günü İçin Kontrol Listesi

Yayın günü stresli bir gündür; bir liste, unutulan kritik ayrıntıları yakalar. Aşağıdaki maddeleri gruplar halinde kontrol edin:

Teknik

• Alan adı, DNS ve SSL sertifikası doğru çalışıyor; HTTP adresleri HTTPS'e yönleniyor.
• Test ortamının arama motorlarına kapalı olduğu, yayın ortamının ise açık olduğu doğrulandı.
• Formlar gerçek e-posta adresine ulaşıyor; spam koruması çalışıyor.
• Hata sayfası (404) doğru durum kodunu dönüyor ve ziyaretçiye yol gösteriyor.
• Yedekleme ve güvenlik güncellemeleri planlandı.

SEO

• Eski adreslerin yeni karşılıklarına 301 yönlendirmesi test edildi.
• robots.txt siteyi engellemiyor; site haritası doğru ve erişilebilir.
• Her sayfada benzersiz title ve meta description, tek H1 var.
• Site Search Console'a eklendi ve site haritası gönderildi.

İçerik ve yasal

• Yazım ve içerik son kez okundu; yer tutucu metin ve "lorem ipsum" kalmadı.
• İletişim bilgileri (telefon, e-posta, adres) doğru.
• Gizlilik, KVKK ve çerez metinleri yayında.

Ölçüm

• Analiz aracı kurulu; telefon, form ve WhatsApp tıklamaları olay olarak tanımlı.
• Bir test eylemi yapıp verinin analiz aracında göründüğü doğrulandı.

Süreçte Sık Yapılan Hatalar

• İçeriği en sona bırakmak: Tasarım boş kutularla onaylanır, gerçek metin gelince düzen bozulur. İçerik, tasarımdan önce veya en azından birlikte hazırlanmalı.
• Çok kişili ve çelişkili onay: Herkesin ayrı görüş bildirdiği projede süre uzar. Tek karar verici belirleyin.
• Tasarımı yalnızca masaüstünde onaylamak: Mobil görünümü onaylamadan geliştirmeye geçmek, geç bir aşamada büyük değişikliğe yol açar.
• Alan adı ve DNS erişimini son güne bırakmak: Alan adının kimde olduğu, hangi sağlayıcıda tutulduğu ve erişim bilgileri çoğu zaman unutulur; yayın günü sürpriz gecikme yaratır. Bu bilgileri projenin başında toplayın.
• Test ortamının arama motorlarınca indekslenmesi: Yayın öncesi ortam kapalı olmalı; aksi halde kopya içerik sorunu ve yanlış adreslerin arama sonuçlarında görünmesi riski doğar.

Sürece Kimler Katılır?

Bir web projesinde tek kişi her işi yapmaz; roller net olduğunda süreç hızlanır. Tipik roller şunlardır:

• Proje sorumlusu: Takvimi, kapsamı ve iletişimi yönetir; işletme tarafındaki tek muhatabınızdır.
• Tasarımcı: Bilgi yapısını, tel kafesleri ve görsel dili oluşturur.
• Yazılım geliştirici: Tasarımı koda dökür, hız, güvenlik ve entegrasyonları kurar.
• İçerik sorumlusu: Metinleri düzenler, başlık yapısını ve arama uyumunu kontrol eder.
• Sizin tarafınızdaki karar verici: Onayları verir ve içerik teslimini yönetir. Çoğu projede en kritik roldür.

Küçük ekiplerde bir kişi birden çok rolü üstlenebilir; önemli olan rollerin ve onay yetkisinin yazılı olmasıdır.

Sözleşmede Bulunması Gereken 8 Madde

Aşağıdaki liste hukuki tavsiye değildir; bir web projesinin sözleşmesinde ele alınmasında fayda olan başlıkları özetler. Kesin hukuki metin için bir hukuk danışmanına başvurun.

1. Kapsam: Sayfa listesi, işlevler ve entegrasyonlar; dahil olmayanlar da yazılı.
2. Teslimler: Ne teslim edilecek (tasarım dosyaları, kaynak kod, yönetim paneli erişimi).
3. Takvim: Aşama tarihleri ve iki tarafın bağımlılıkları (içerik teslim tarihi gibi).
4. Revizyon kuralları: Geri bildirim turu sayısı ve kapsam dışı değişikliklerin nasıl fiyatlanacağı.
5. Fikri mülkiyet ve sahiplik: Kod, tasarım ve alan adının kime ait olacağı.
6. Ödeme planı: Ödemelerin hangi teslimlere bağlandığı.
7. Yayın sonrası destek: Destek süresi, kapsamı ve sonrasındaki bakım koşulları.
8. Gizlilik ve veri: Paylaşılan bilgilerin gizliliği ve kişisel verilerin (KVKK kapsamında) korunması.

Bu maddelerin hepsinin yazılı olması, süreçte çıkabilecek anlaşmazlıkların çoğunu daha başlamadan çözer.

Özet Notlar: Süreç İçin 5 Cümle

• Süreç sekiz adımdan oluşur ve her adımın net bir çıktısı ile onay noktası olmalıdır.
• Süreyi en çok teknik iş değil, içeriğin hazırlanması ve onayların gecikmesi belirler.
• Kapsamı yazılı ve onaylı tutun; değişiklik taleplerini kayda alıp maliyetini görünür kılın.
• Tek bir karar verici ve toplu geri bildirim turları, revizyon sayısını belirgin biçimde azaltır.
• Yayın gününü bir kontrol listesiyle yönetin; eski adresleri yönlendirmeyi ve ölçümü unutmayın.

Süreçte Ekibi Değerlendirirken Sorulacak Sorular

Bir tasarım ekibi seçerken sürecin şeffaflığı, teknik yeterlik kadar önemlidir. Şunları sorun: Her adımın çıktısı nedir? Onay noktaları nerede? Kapsam değişikliği nasıl yönetiliyor? Yayından sonra destek nasıl işliyor? Daha ayrıntılı bir liste için web tasarım firması seçim rehberimize bakabilirsiniz.

ORCA Software'de projeler bu adım mantığıyla yürütülür ve her adımın sonunda onay alınır. Kendi projeniz için kapsam ve takvim konuşmak isterseniz bize yazın; web site geliştirme hizmetimizin ayrıntılarına da göz atabilirsiniz.

Web Sitesi Tasarımı Rehber Serisindeki Diğer Yazılar

Bu yazı, işletmeler için web sitesi tasarımını farklı açılardan ele alan bir serinin parçası. İlgilendiğiniz konuya doğrudan geçebilirsiniz:

• İşletmeler için web sitesi tasarımı rehberi
• Profesyonel web sitesi tasarımının 12 ölçütü
• Kurumsal web sitesi sayfa yapısı ve bilgi mimarisi
• Mobil uyumlu web sitesi tasarımı
• Web sitesi hızı ve Core Web Vitals
• SEO uyumlu web sitesi tasarımı
• Yapay zekâ aramaları için web sitesi tasarımı
• Dönüşümü düşüren web sitesi tasarım hataları
• Yerel işletmeler için web sitesi tasarımı