WEB TASARIM NEDİR? 2026 REHBERİ: STRATEJİ, TASARIM, GELİŞTİRME VE DÖNÜŞÜM

Web Tasarım Nedir? 2026 Rehberi: Strateji, Tasarım, Geliştirme ve Dönüşüm

Web tasarımı; dijital varlıkların nasıl göründüğünü, nasıl çalıştığını ve nasıl dönüşüm yarattığını belirleyen teknik bir disiplindir. Sadece görsel estetiğe odaklanmayan süreç, 4 katmanlı bir mimari sunar: strateji + UI/UX + ön yüz geliştirme + performans/SEO. Geliştirdiğim kurumsal altyapılar, 2026 standartlarında Core Web Vitals limitlerini karşılar (LCP < 2.5s, CLS < 0.1). Kodlama, mobil öncelikli indeksleme kurallarına dayanır. Sayfalar WCAG 2.1 erişilebilirlik standartlarına doğrudan entegre olur. Türkiye pazarındaki küçük ve orta ölçekli kurumsal projeleri 2-5 hafta içinde teslim ediyorum; bütçeler ise projenin kapsamına göre 15.000-75.000 TL aralığında belirlenir.

Sektörde geçirdiğim 15 yılı aşkın sürede; tek sayfalık açılış sayfalarından çok dilli SaaS panellerine, e-ticaret platformlarından kurumsal portallara uzanan 200'ün üzerinde projeyi bizzat yönettim. Kendi pratiğimde gördüğüm yüzeysel "site yapma" iddialarını çürütmek ve işin teknik boyutunu göstermek için buradayım. Değer üreten web siteleri ile bütçe tüketenler arasındaki temel fark, tasarım yetkinliğinden ziyade sürecin doğru kurgulanmasında yatar. Metni incelediğinizde bütçenizi doğru yönetmeyi, kaynakları doğru katmanlara aktarmayı ve boş vaatleri ayırt etmeyi öğreneceksiniz. Hedefimiz net: doğru kurgu, yüksek performans.

Web Tasarımının Sade Tanımı

Web tasarım, ziyaretçilerin dijital platformda temas ettiği her noktayı kurgulama, görselleştirme ve yayına alma operasyonudur. Sadece estetik unsurlara odaklanmak yanıltıcı sonuçlar doğurur. Renk paletleri, tipografi seçimleri ve görseller işin yalnızca yüzeyini temsil eder. Arka plandaki mekanizma; hedef kitle analizi (kime, hangi mesajın iletileceği), bilgi mimarisi (sayfaların konumlandırılması), kullanıcı deneyimi akışı (ziyaretçinin sonraki adımı nereden atacağı), teknik altyapı (sayfanın açılış hızı) ve dönüşüm oranı optimizasyonu (hedef aksiyona ulaşma oranı) katmanlarından oluşur. Başarı, tüm parçaların entegre çalışmasına bağlıdır.

Kendi pratiğimde karşılaştığım somut bir vaka konuyu netleştiriyor: 2018 yılında bir danışanım sınırsız bütçeyle sadece görsel şıklığa odaklanan bir taleple geldi. Üç aylık mesai sonunda yayına aldığımız arayüz estetik beklentileri karşılıyordu. Altı ay sonra ise trafik almalarına rağmen satış yapamadıklarını belirten bir geri dönüş aldım. Sorunun kaynağı netti: projeyi işlevsel bir sistem yerine sadece görsel tasarım odaklı kurgulamıştık. Yaşanan deneyim sonrasında, stratejik brief sürecini tamamlamadan yeni projelere başlamama prensibini edindim.

Web Tasarım ve Web Geliştirme: Sıkça Karıştırılan İkili

Aynı projenin farklı katmanlarını oluşturan iki kavram, iş süreçlerinde tamamen farklı görev tanımlarına işaret eder. Web tasarım; arayüz görünümü, kullanıcı akışı, marka kimliği entegrasyonu ile mobil ve masaüstü cihazlardaki yerleşim şemalarını belirler. Web geliştirme ise hazırlanan görsel şablonları çalışan koda dönüştürür. Kod, tasarıma işlev kazandırır. Süreç; HTML/CSS/JavaScript (ön yüz), PHP/Python/Node.js (arka yüz), veritabanı mimarisi, form entegrasyonları ve performans optimizasyonu adımlarını kapsar. Yönettiğim projelerde kurumsal ekiplerin tasarımcı ve geliştirici rollerini net çizgilerle ayırdığını, butik işlerde ise tek uzmanın iki alanı birden (full-stack) üstlendiğini görüyorum. Sektördeki rol ayrımlarını, işleyişi ve teknik gereksinimleri Web developer nedir ve front-end developer nedir başlıklı yazılarımda detaylandırdım; inceleyebilirsiniz.

Modern Web Tasarımının 4 Katmanı

Yönettiğim projelerde, profesyonel web sitelerinin dört temel katman üzerine kurulduğunu gördüm. Sıralamayı atlamak, sonraki aşamalarda teknik çökmelere yol açar.

1) Strateji Katmanı

Sitenin kime, hangi mesajla ve hangi aksiyonu aldırmak üzere kurulacağı sorusunu yazılı olarak yanıtlayarak işe başlıyoruz. Hedef kitle, rekabet analizi, konumlandırma (positioning), birincil ve ikincil dönüşüm hedefleri (form doldurma, demo talebi, satın alma, bülten kaydı) ilk aşamada netleşir. Planlamayı göz ardı eden projeler, yayına girdikten altı ay sonra "ziyaretçi var ama dönüşüm yok" çıkmazıyla karşılaşır. Yatırım boşa gider.

2) UI / UX Tasarım Katmanı

Stratejik planlama belgelendikten sonra kullanıcı arayüzü (UI) ve kullanıcı deneyimi (UX) tasarım sürecine geçiyoruz. Bilgi mimarisi (sayfa hiyerarşisi), tel kafes (wireframe), prototip (etkileşim akışı) ve Figma üzerinde hazırlanan görsel tasarımlar sürecin çıktılarını oluşturur. UI "nasıl görünüyor", UX ise "nasıl hissettiriyor" sorusuna yanıt arar. Aralarındaki farkları UI vs UX rehberinde inceleyebilirsiniz.

3) Geliştirme (Front-end + Back-end) Katmanı

Görsel tasarımları çalışan koda dönüştürdüğümüz aşamadayız. Ön yüzde HTML (yapı), CSS (görünüm), JavaScript (etkileşim) ve ihtiyaç halinde Bootstrap kütüphaneleri kullanılır. Arka yüzde projenin gereksinimlerine göre PHP, Python, Node.js veya headless CMS (WordPress, Strapi) tercih edilir. Geliştirme aşamasındaki temel karar, özel kodlama mı yoksa hazır şablon mu kullanılacağıdır. Karar, tamamen projenin hedeflerine göre şekillenir.

4) Performans + SEO Katmanı

Yayına alım öncesinde hız, erişilebilirlik, mobil uyum ve teknik SEO optimizasyonlarını tamamlıyoruz. Günümüz standartlarında Core Web Vitals limitlerini karşılamayan siteler arama sonuçlarında geride kalır. LCP (Largest Contentful Paint) için 2.5 saniyenin, CLS (Cumulative Layout Shift) için 0.1'in, INP (Interaction to Next Paint) için 200 milisaniyenin altını hedefliyoruz. Google'ın web.dev performance rehberi ölçüm yöntemlerini doğrudan aktarır. MDN'in performans dokümantasyonu süreç için pratik kontrol listeleri sunar.

Başarılı Web Sitelerinin 6 Yapısal Özelliği

  • Net birincil mesaj: Kullanıcılar ilk 5 saniye içinde sunduğunuz değeri anlamak zorundadır. Giriş ekranındaki başlık, alt başlık ve birincil CTA (eylem çağrısı) bileşimi hedef kitleyi yakalama görevini üstlenir. Netlik kazandırır.
  • Mobil öncelikli tasarım: Ziyaretçi trafiğinin büyük bölümü telefonlardan gelir. Yönettiğim projelerde tasarım sürecini mobil öncelikli başlatıp masaüstü versiyona uyarlıyorum. Mobil deneyim önceliklidir.
  • Hız: Sayfa açılış süresini 2.5 saniyenin altında tutmak zorundasınız. Görselleri WebP/AVIF formatlarıyla optimize edin, gecikmeli yükleme (lazy-load) sistemini kurun ve critical CSS kodlarını satır içine alın. Hız doğrudan dönüşümü etkiler.
  • Erişilebilirlik (WCAG 2.1 AA): Klavye navigasyonuna uygun, ekran okuyucularla entegre çalışan ve renk kontrastı standartları karşılayan yapılar inşa edin. Türkiye sınırlarında yasal zorunluluk bulunmuyor; ancak küresel ölçekte profesyonel standart kabul edilir. Smashing Magazine erişileəlirlik arşivi güncel referans kaynağıdır.
  • Dönüşüm odaklı bilgi mimarisi: Her sayfa ya net bilgi aktarmalı ya da kullanıcıyı doğrudan aksiyona yönlendirmelidir. İki farklı odağı aynı anda sunmaya çalışan sayfalar hedefinden sapar.
  • Teknik SEO temelleri: Semantik HTML yapısını kurun; schema.org işaretlemelerini, çok dilli projelerde hreflang etiketlerini, XML site haritasını, robots.txt ve canonical tanımlamalarını eksiksiz yapılandırın. Arama motorları sitenizi doğru taramalıdır. Profesyonel web sitelerinin olmazsa olmaz özellikleri başlıklı yazımda detayları inceleyebilirsiniz.

Sıfırdan Web Sitesi Süreci: 7 Adım

  1. Keşif ve Brief: Yönettiğim projelerde her zaman ilk sıraya koyduğum adımdır; hedefleri, rakipleri ve kullanıcı profilini analiz ederek yol haritasını netleştiririz.
  2. Bilgi mimarisi ve içerik planı: Ziyaretçinin site içindeki yolculuğunu tasarlıyoruz. Sayfa yapılarını ve her sayfada yer alacak mesajları netleştirip içerik hiyerarşisini kuruyoruz.
  3. Wireframe ve prototip: Görsel tasarımdan önce sayfa akışını netleştiriyoruz. Düşük çözünürlüklü iskelet çizimlerle kullanıcı deneyimini test edilebilir hale getiriyoruz.
  4. Görsel tasarım (Figma): Marka kimliğini dijital dünyaya aktarıyoruz. Figma üzerinde mobil ve masaüstü arayüzleri, kullanıcı alışkanlıklarını gözeterek çiziyoruz.
  5. Geliştirme: Onaylanan tasarımları çalışan bir sisteme dönüştürüyoruz. Arayüzü HTML, CSS ve JS ile kodlayıp arka yüz sistemlerini kuruyoruz.
  6. İçerik entegrasyonu ve SEO: Arama motoru görünürlüğü için teknik altyapıyı kuruyoruz. Metinleri, görselleri, meta etiketleri ve schema işaretlemelerini sisteme işliyoruz.
  7. Test ve canlıya alma: Yayından önce son kontrolleri yapıyoruz. Tarayıcı uyumluluğu, mobil performans ve erişilebilirlik denetimlerini tamamlayıp projeyi canlıya alıyoruz.

Modern Standartlar: Core Web Vitals, Mobil Öncelik, Erişilebilirlik

Teknik altyapı standartları, Google sıralamalarını ve kullanıcı deneyimini doğrudan belirler:

Core Web Vitals: LCP, CLS ve INP metriklerinin tamamında hedef değerleri yakalamak zorundasınız. PageSpeed Insights aracıyla ücretsiz ölçüm yapabilirsiniz. Gerçek kullanıcı deneyimini yansıtan saha verileri (CrUX), Google sıralama algoritmasında doğrudan ağırlığa sahiptir. Kendi pratiğimde, saha verisi zayıf sitelerin arama sonuçlarında gerilediğini sıkça gördüm.

Mobil öncelikli indeksleme: Arama motorları tarama ve dizine ekleme işlemlerinde sitenizin mobil sürümünü temel alır. Masaüstü arayüzünüz hatasız görünse bile mobil deneyimdeki aksaklıklar sıralama kaybı yaşatır. Tasarım aşamasına doğrudan mobil prototiplerle başlamanızı tavsiye ederim.

Erişilebilirlik (WCAG 2.1 AA): Avrupa Birliği sınırlarında European Accessibility Act 2025 ile yasal zorunluluklar devreye giriyor. Türkiye'de henüz yasal yaptırım bulunmasa da küresel standartlarda projeler üretmek için ilgili kurallara uymalısınız. Denetimler; klavye navigasyonu, görsel alt etiketleri, renk kontrastı ve ARIA tanımlamaları üzerinden yürütülür. Nielsen Norman Group'un erişilebilirlik rehberleri teknik gereksinimleri anlamak için güvenilir kaynaklar sunar.

Web Sitesi Maliyetleri (Türkiye Pazarı)

Türkiye dijital pazarında yönettiğim projelerden edindiğim deneyimle güncel bütçe aralıklarını aşağıda listeledim:

  • Tek sayfa landing/şablon: 5.000 - 15.000 TL (Bireysel çalışmalar, kısa süreli tanıtımlar ve butik etkinlikler için tercih edilir).
  • Kurumsal site (5-15 sayfa): 15.000 - 50.000 TL (KOBİ ölçeğindeki işletmeler, hizmet sunan markalar ve danışmanlık firmaları için uygundur).
  • Özel tasarım ve özel kodlama: 50.000 - 150.000 TL (Orta ve büyük ölçekli işletmeler, çok dilli yapılar veya marka odaklı projeler için tasarlanır).
  • E-ticaret platformu: 30.000 - 200.000+ TL (Ürün sayısı, ödeme altyapıları ve depo entegrasyonlarının kapsamına göre belirlenir).
  • SaaS / web uygulaması: 150.000 - 1.000.000+ TL (Geliştirme süreci işlevselliğe bağlı olarak 3 ila 12 ay süren projeleri kapsar).

Bütçenizi planlarken tüm gider kalemlerini görmek isterseniz, hazırladığım web sitesi fiyatları analizini okuyabilirsiniz.

Hangi Sitelere Kurumsal Web Tasarım Gerekmez?

Sektör genelinde her işletmenin mutlaka profesyonel bir web sitesine ihtiyaç duyduğu savunulur. Pratik ise farklı istisnaları önümüze koyuyor:

  • Tek kişilik freelance hizmetler ve sosyal medya tabanlı işler: Profil yönlendirme araçları ve aktif sosyal medya hesapları ilk aşamada işinizi görür. Erken dönemde yüksek bütçeli web tasarımlarına bütçe ayırmak gereksiz maliyet üretir.
  • Ürün-pazar uyumunu henüz yakalayamamış girişimler: Satış modelinizi ve sunduğunuz çözümü netleştirmeden site yaptırmayın. İş modeli oturmadan harcanan bütçe doğrudan kayba dönüşür.
  • Kısa süreli etkinlikler: Belirli bir takvime sıkışmış organizasyonlar için kalıcı kurumsal altyapılar kurmak kaynak israfıdır. Tek sayfalık açılış sayfaları (landing page) hedefi yakalamanızı sağlar.

Sayılan durumların dışındaysanız, web sitesi lüks değil, doğrudan satış kanalınızın temel taşına dönüşür. Kendi pratiğimde, doğru kurgulanmış bir sitenin işletmeleri nasıl büyüttüğünü defalarca gözlemledim. Sürecin tamamını birlikte yürütmek isterseniz, sunduğum web tasarım hizmeti sayfasından önceki çalışmaları ve iş modelini inceleyebilirsiniz. Sektöre adım atmak isteyenler için hazırladığım 7 adımda web tasarımcısı olmak rehberi yol gösterir.

Projeniz için brief göndermek isterseniz, sağ alt köşedeki formdan talebinizi 3 adımda iletin; 24 saat içinde dönüş yapıyorum.

SSS

Sıkça Sorulan Sorular

Yazıyı atlayıp doğrudan cevaba ulaşmak isteyenler için kısa notlar.

Web tasarım nedir, kısaca?
Web tasarım; web sitesinin nasıl göründüğünü, nasıl çalıştığını ve nasıl dönüşüm yarattığını birleştiren disiplindir. Strateji, UI/UX, geliştirme ve performans olmak üzere 4 katmandan oluşur.
Web tasarım ile web geliştirme arasındaki fark nedir?
Web tasarım "nasıl görünmeli, kullanıcı nereden nereye gitmeli" sorularına cevap verir. Web geliştirme ise tasarımı koda çeviren süreçtir: HTML, CSS, JavaScript (ön yüz) ve back-end teknolojileri kullanır. İkisi farklı uzmanlık alanlarıdır.
Modern web tasarımının kaç katmanı vardır?
Dört katman bulunur: (1) Strateji: kime, ne mesajla, hangi aksiyon için, (2) UI/UX tasarım: bilgi mimarisi, wireframe, prototip, görsel tasarım, (3) Geliştirme: HTML/CSS/JS ve back-end kod, (4) Performans ve SEO: Core Web Vitals, hız, erişilebilirlik.
Web sitesi yapmak ne kadar sürer?
Tek sayfa landing 1 hafta, kurumsal 5-15 sayfa site 2-5 hafta, özel tasarım ve özel kod 6-12 hafta, e-ticaret 4-12 hafta, SaaS veya web uygulaması 3-12 ay sürer. Süreç içerik teslim hızınıza ve revizyon turlarına bağlıdır.
Web sitesi maliyeti ne kadar olur?
2026 Türkiye pazarında: landing 5.000-15.000 TL, kurumsal 15.000-50.000 TL, özel tasarım 50.000-150.000 TL, e-ticaret 30.000-200.000+ TL, SaaS 150.000-1.000.000+ TL aralığındadır. Bütçe içerik miktarı, dil sayısı ve özel kod ihtiyacına göre değişir.
Core Web Vitals nedir, neden önemli?
Google'ın kullanıcı deneyimini ölçen üç ana metriğidir: LCP (en büyük içerik 2.5s altı), CLS (görsel kayma 0.1 altı), INP (etkileşim cevabı 200ms altı). Üçü de yeşil olmazsa sitenin Google sıralamasında kayıp yaşama riski artar.
İyi bir web sitesinin temel özellikleri nelerdir?
Net birincil mesaj (5 saniye kuralı), mobil öncelikli tasarım, 2.5s altı hız, WCAG 2.1 AA erişilebilirlik, dönüşüm odaklı bilgi mimarisi ve teknik SEO temelleri (semantik HTML, schema, hreflang, sitemap, canonical) aranır.
Mobil-first ne demek?
Tasarım sürecini mobil ekrandan başlatıp masaüstüne genişletmek demektir. Google mobil indexing kullanır; yani sitenizin mobil sürümünü esas alır. Trafiğin %60-70'i mobilden geldiği için mobil öncelikli yaklaşım artık zorunlu standarttır.
Hangi durumda kurumsal web tasarıma ihtiyaç yoktur?
Üç istisna: (1) Tek kişilik freelance işler için Linktree + Instagram yeterli, (2) ürün-pazar uyumu bulamamış başlangıç şirketleri önce ürünü oturtmalı, (3) tek seferlik etkinlik markaları için basit landing yeterlidir.
Web sitesi için WordPress mi, özel kod mu?
Projeye bağlıdır. Hızlı çıkış + içerik yönetimi öncelikse WordPress veya headless CMS (Strapi) iyi seçimdir. Özel etkileşim, performans, marka odaklı tasarım gerekiyorsa özel kod daha esnek ve hızlı sonuç verir. KOBİ'lerin çoğunda WordPress yeterlidir.
Web sitesi yapmadan önce neye dikkat etmeliyim?
Brief'iniz hazır olmalı: hedef kitle, rakipler, ana mesaj, birincil dönüşüm hedefi, içerik kaynağınız (metin/görsel kim hazırlayacak), bütçe ve teslim tarihi netleşmeden tasarım sürecine girmeyin. Atlanan brief, 6 ay sonra "trafik var dönüşüm yok" sorununu yaratır.
Erişilebilirlik (WCAG) sitemde zorunlu mu?
AB'de European Accessibility Act 2025 ile birçok sektörde yasal zorunluluk geldi. Türkiye'de yasal değil ama profesyonel standarttır. Klavye navigasyonu, alt etiketleri, renk kontrastı, ARIA etiketleri minimum gerekliliklerdir.
Web tasarımcı kim, ne yapar?
Web tasarımcı, stratejiyi anlayan, bilgi mimarisi kuran, UI/UX tasarlayan, gerekirse ön yüz koduna çeviren profesyoneldir. İyi bir web tasarımcı sadece "güzel ekran" değil, kullanıcının aksiyon alacağı bir sistem kurar.
Web sitemi kendim mi yapsam, profesyonele mi versem?
Kişisel blog veya tanıtım sayfası için WordPress + hazır tema ile kendiniz yapabilirsiniz. Marka odaklı kurumsal site, e-ticaret veya SaaS için profesyonel tasarımcı/geliştirici şarttır. Sahte tasarrufun maliyeti çoğunlukla 12 ay sonra ödenir.
Web sitemi ne sıklıkla yenilemeliyim?
Tam yenileme (rebuild) 5-7 yılda bir gerçekleşir. Aralarda görsel ufak iyileştirmeler, performans güncellemeleri ve içerik tazeleme yapılmalıdır. Mobil davranışı, hızı veya Core Web Vitals metrikleri yetersiz kalan siteler tam yenileme gerektirir.
Özetle:
Özkan Göçer Profil Fotoğrafı

Özkan Göçer

Growth Engineer & Dijital Pazarlama Uzmanı

Özkan Göçer, 15 yılı aşkın saha tecrübesi ve tamamladığı 200'den fazla proje ile Growth Engineer ve Dijital Pazarlama Uzmanı olarak hizmet vermektedir. Reklamcılık ve Web Tasarımı eğitimini modern W3C standartları ve UI/UX prensipleriyle harmanlayarak bu rehberi kaleme almıştır.


Yukarı Çık