murattunalı.

Web Tasarım + Geliştirme.

Editoryal art direction’dan statik, hızlı kuruluma: tasarım ve kod aynı elden, aynı disiplinle.

Çok dilli mimari (TR · EN · DE)
Performans: LCP < 0,8s hedefli kurulum

Siteyi tasarlayan el teknik SEO’sunu da kurar: hız, erişilebilirlik ve taranabilirlik sonradan eklenen bir kontrol listesi değil, ilk taslağın koşuludur.

SÜREÇ

NELER DAHİL

  • Editoryal tasarım + tip sistemi
  • Çok dilli mimari (TR · EN · DE)
  • Motion koreografisi — reduced-motion dahil
  • Erişilebilirlik: AA taban
  • Performans: LCP < 0,8s hedefli kurulum

ÖLÇÜLÜ ŞEMALAR

En büyük içerik boyaması — üç canlı proje

fersantekstil.com 0,62s
karcem.com.tr 0,44s
mikroyazilimdestek.com 0,33s
Bar ölçüm, sağ kenar 0,8 saniyelik bütçe. Değerler vaka sayfalarındaki ölçüm şeridiyle aynı kaynaktan gelir; elle yazılmaz.

Düzen kayması — ölçülen üç değer

fersantekstil.com 0,001
karcem.com.tr 0,004
mikroyazilimdestek.com 0,001
Skalanın tamamı Google’ın «iyi» eşiği, kesikli çizgi bu stüdyonun kendi bütçesi. Barlar ölçülmüş kayma — küçüklükleri mesajın kendisi.

JavaScript yükü — her build’de tartılır

vendor 31 KB
kendi kod 34 KB
toplam 65 KB
Bu sitenin kendi yükü: build sırasında gzip’lenerek ölçülür, sağ kenar 150 KB’lik tavan sözleşmesi. Vendor GSAP ailesi; gerisi bu sitenin kendi kodu.

NEDEN BÖYLE

Neden CMS değil

Bu soru fiyatla değil ölçümle cevaplanır. Bir sayfanın açılış hızını belirleyen şey, tarayıcının ilk boyamadan önce indirmek ve çalıştırmak zorunda kaldığı bayt miktarıdır. Eklenti mimarisi o baytı yönetilemez kılar: her eklenti kendi stilini ve betiğini getirir, hiçbiri diğerinin bütçesini bilmez, ve toplamı kimse görmez. Bu sitenin ölçülen değerleri şöyle: stil dosyası sıkıştırılmış hâlde 12,4 kilobayt, kütüphaneler 55,7 kilobayt, kendi kodu 28 kilobayt, üçüncü taraf betik sıfır.

Statik olmanın bedeli de var ve saklanmıyor: içerik değiştiğinde bir üretim komutu koşmak gerekir ve bir yönetim paneli yoktur. Bu takas her proje için doğru değildir. Günde birkaç kez içerik giren bir haber sitesinde yanlış karardır. Kurumsal tanıtım sitesi, portfolyo ya da hizmet sitesinde doğrudur, çünkü içerik seyrek değişir ve hız ile bakım maliyeti sürekli önemlidir. Takasın tam listesi ayrı bir rehberde duruyor.

Performans bir teslim kalemi, bir vaat değil

Bütçe projenin başında yazılır ve sonunda ölçülür. Burada kullanılan eşikler Google’ın «iyi» sınırının altındadır: en büyük içerik boyaması 0,8 saniye — Google 2,5 diyor; düzen kayması 0,05 — Google 0,1 diyor; etkileşimden sonraki boyama 200 milisaniye. Bu sitede ölçülen sonuçlar: ilk bayt süresi 0,302 saniye ve düzen kayması 0,001, yani iyi eşiğin yüzde biri.

Rakamlar tek seferlik bir denetimden değil, her değişiklikte koşan bir süitten geliyor. Süit bugün 1641 ölçüm yapıyor ve bir kısmı doğrudan performansa bakıyor: kaydırma sırasındaki kayma oturum penceresi mantığıyla ayrıca hesaplanıyor, animasyon kare bütçesi ölçülüyor, JavaScript toplamı bayt bayt denetleniyor. Bir bütçe aşılırsa derleme sessizce geçmez, test kırmızı yanar. Performansın tamamı ve bütçenin nasıl kurulduğu ayrı yazıldı.

Erişilebilirlik ek kalem değil

WCAG 2.2, W3C’nin 5 Ekim 2023’te yayımladığı sürümdür ve 21 Haziran 2025 tarihli Cumhurbaşkanlığı Genelgesi kamu kurumlarının siteleri için A seviyesini referans alır. Bu kurulumda taban AA’dır ve ayrı fiyatlandırılmaz. Ölçülen değerler: gövde metni kâğıt zemine karşı 18,15:1 kontrast veriyor — AAA eşiği olan 7:1’in iki buçuk katı. Odak halkası 10,22:1. Dokunma hedefleri en az 44 piksel.

Erişilebilirliğin ek kalem sayılması, sonradan eklenebileceği varsayımına dayanır. Ölçüldüğünde bu varsayımın yanlış olduğu görülür: kontrast bir renk kararıdır, odak görünürlüğü bir stil kararıdır, klavye sırası bir işaretleme kararıdır. Üçü de tasarım aşamasında verilir; sonraya bırakılırsa verilen kararı geri almak gerekir. Neyin ne olduğu ve seviyeler arasındaki fark ayrıca anlatıldı.

Devirde ne var

Kod ve içerik kaynağının tamamı devredilir. Paket üç şey içerir: belgelenmiş dosya yapısı, tek komutla koşan üretim akışı ve doğrulama süitinin kendisi. Sonuncusu en önemlisidir, çünkü site el değiştirdikten sonra da bir iddianın hâlâ doğru olup olmadığını ölçebilirsiniz. Kilitli panel yok, zorunlu abonelik yok, kaynağı görmediğiniz bir katman yok.

Bu kurulumun neden böyle olduğu tek bir cümleye iniyor: ölçülemeyen bir iyileştirme yapılmış sayılmıyor. Aynı disiplin yöntem sayfasında ilkeler hâlinde, hizmet özetinde ise üç hizmetin nasıl tek karar setinden beslendiği olarak duruyor. Bir tasarım fikri bütçeye sığmıyorsa eleniyor ve neden elendiği yazıya geçiyor.

KAPSAM

Kurumsal web tasarım: kimin için

Kurumsal web tasarım burada «büyük şirket» demek değil; birden çok dilde konuşan, birden çok ekibin dokunduğu ve yıllarca yaşaması gereken site demek. O ölçekte belirleyici olan görsel değil sözleşmedir: tasarım token’ları, şablon düzeyinde şema ve yayına çıkmadan koşan denetim. Bu sitenin kendisi o sözleşmeyle kuruldu.

Premium ve özel web tasarım — şablon neden kullanılmıyor

Özel web tasarım pahalı olduğu için değil, ölçülebilir olduğu için seçilir. Hazır şablon ilk gün hızlı, üçüncü ay ağırdır: kullanılmayan betikler, taşınamayan bileşenler, kırılan erişilebilirlik. Premium web tasarım bu depoda bir sıfat değil bir bütçe satırıdır — JS bütçesi ve kritik CSS baştan yazılır ve nöbetçiyle korunur.

Custom website development: çok dilli mimari

Üç dilli bir sitede maliyet çeviride değil mimaride birikir: URL yapısı, x-default, dil seçici ve şema çevirileri. Custom website development tam bu yüzden tercih edilir — bu katmanlar sonradan eklenemez, ilk gün kurulur. Kurulum örneği bu sitede canlı: üç dil, karşılıklı hreflang kümesi, tek üretici.

Üretici ve ihracatçı firmalar için

Ürün kataloğu, sertifika ve teklif akışı taşıyan sitelerin kendi kuralları var: ürün bilgisi PDF’te değil sayfada, her pazar kendi dilinde, satış bir teklif isteğiyle başlar. Bu kuralların ayrıntısı B2B web sitesi sayfasında.

Siteyi yenilerken sıralamayı korumak

Yeni site, eski sitenin Google’da biriktirdiği her şeyi taşımak zorundadır: eski adreslerin her biri yeni sitede karşılığına yönlendirilir, başlıklar ve iç bağlar korunur, geçişten sonra izlenir. Bu iş tasarımdan ayrı bir teslim kalemidir — site yenileme ve taşıma.

Erişilebilirlik ve hız: ayrı denetim olarak da

Her yeni sitede erişilebilirlik ve hız teslimin parçasıdır. Var olan bir siteniz varsa ikisi ayrı bir iş olarak da yapılır: web erişilebilirlik denetimi WCAG ölçütleriyle, site hızı optimizasyonu Core Web Vitals ile ölçer ve kaynağında düzeltir.

Kiminle çalışırsınız?

Tek kişiyle: tasarımı, kodu ve ölçümü aynı kişi yapar ve teslim eder. Deneyim, yayımlanmış işler ve açık kaynak çalışmalar künyede yazılı; yöntem yaklaşım sayfasında.

KONUM: İSTANBUL

İstanbul, TR — uzaktan çalışırız; gerekirse yerinde.

SIK SORULAN SORULAR

KAYNAKLAR