İçindekiler
Web Tasarımı ve Arama Motoru Optimizasyonu: SEO Odaklı, Üst Sıralara Çıkan Bir Web Sitesi Nasıl İnşa Edilir
Çoğu ekip, web tasarımı ve arama motoru optimizasyonunu ardışık aşamalar olarak ele alır. Önce tasarım. Sonra optimizasyon. Bu sıralama, ürün geliştirmede yapabileceğiniz tek en pahalı hatadır.
Bir SEO denetimi yapısal sorunları ortaya çıkardığında — zayıf başlık hiyerarşisi, render'ı engelleyen script'ler, semantik olmayan markup, eksik hreflang attribute'ları — artık bir yama değil, yeniden tasarım söz konusudur. SEO'yu tasarım sürecine ne kadar erken entegre ederseniz, bunu doğru yapmanın maliyeti o kadar düşük olur.
Bu yazı, web tasarımı ve SEO'nun pratik kesişimini ele alıyor: tasarım sırasında alınan hangi kararların en büyük SEO etkisini yarattığını, iyi yürütülmüş SEO odaklı bir web sitesinin pratikte nasıl göründüğünü ve küresel ekiplerin teknik arama kalitesinden ödün vermeden pazar genişlemesini nasıl düşünmesi gerektiğini.
Web Tasarım Kararları SEO Sonuçlarını Neden Belirler
Arama motorları web sitenizi kullanıcıların deneyimlediği şekilde deneyimlemez. Bir HTML akışı alırlar, linkleri takip ederler, yapılandırılmış veriyi parse ederler ve içerik sinyallerinden alaka düzeyini çıkarırlar. Her tasarım kararı bu süreci ya destekler ya da zorlaştırır.
Site Mimarisi ve Crawl Verimliliği
SEO için en belirleyici tasarım kararı URL yapısıdır. Düz bir mimari — içeriğin büyük çoğunluğuna ana sayfadan iki veya üç tıkla ulaşılabildiği — crawl bütçesinin navigasyon yüküne değil içeriğe harcanmasını sağlar.
Derin iç içe geçme sorunlara yol açar. /store/category/subcategory/sub-subcategory/product-name adresindeki bir ürün sayfasının crawl edilmesi, doğal şekilde link verilmesi ve kullanıcıların anlaması daha zordur. /products/product-name adresindeki bir sayfa ise bu üç sorunu aynı anda çözer.
Dahili linkleme mimariden kaynaklanır. Tasarım, bağlamsal linklerin yalnızca navigasyon menülerinde değil, gövde içeriğinde nerede görüneceğini de hesaba katmalıdır. Navigasyon linkleri, her sayfada tekdüze göründükleri için crawler'lar tarafından içerik içi linklere kıyasla daha düşük değerde tutulur.
Core Web Vitals ve Performans-Tasarım İlişkisi
Google'ın Core Web Vitals'ı — Largest Contentful Paint (LCP), Interaction to Next Paint (INP) ve Cumulative Layout Shift (CLS) — doğrudan tasarım etkileri olan sıralama sinyalleridir.
LCP, en büyük görünür öğenin render edilmesinin ne kadar sürdüğünü ölçer. Çoğu sayfa için bu bir hero görseli veya sayfanın üst kısmındaki bir başlıktır. LCP'yi etkileyen tasarım kararları:
- Görsel formatı ve sıkıştırma (WebP'ye karşı PNG'ye karşı JPEG)
- Hero'nun HTML'de mi render edildiği yoksa JavaScript aracılığıyla mı enjekte edildiği
- Font'ların önceden yüklenip yüklenmediği veya görünmez metin flaşına neden olup olmadığı
CLS, beklenmeyen layout kaymasını ölçer. Görseller, reklamlar ve gömülü öğeler için yüklenmeden önce açık alan ayıran tasarımlar, öğeler geldikçe içeriği aşağıya iten tasarımlardan daha iyi puan alır.
INP ise yanıt verebilirliği ölçer. Ana thread'i büyük ölçüde bloke eden ağır JavaScript framework'leri daha düşük puan alır. Buradaki tasarım kararı, bir sayfanın gerçekten ne kadar etkileşime ihtiyaç duyduğu ile varsayılan olarak ne kadar JavaScript dahil edildiğidir.
SEO baştan yerleştirilmiş bir web sitesi tasarımı, design system'de görsel boyutları belirtir, herhangi bir kod yazılmadan önce font yükleme stratejisini tanımlar ve JavaScript kalıplarını performans bütçesi kısıtlarına göre seçer — geriye dönük değil.
Semantik HTML ve Başlık Hiyerarşisi
Arama motorları, içerik organizasyonunu anlamak için başlık yapısını kullanır. Tek bir h1, mantıksal bir h2 yapısı ve her bölüm içinde h3 alt bölümleri bulunan bir sayfa, net konu sinyalleri sağlar. Başlıkların semantik anlam yerine görsel ağırlığa göre seçildiği bir sayfa ise gürültü üretir.
Bu öncelikle bir design system sorunudur. Bir design system başlıkları görsel olarak tanımlarken semantik olarak tanımlamadığında — "büyük metin için H1 stilini kullan" — geliştiriciler başlıkları yanlış uygular. Semantik anlam çöker. Düzeltme için ya bir design system güncellemesi ya da geliştiricilerin güvenilir biçimde görmezden geldiği bir politika belgesi gerekir.
Doğru yaklaşım, başlık düzeylerini design system düzeyinde semantik olarak tanımlamak ve görsel stilleri ayrı ayrı eşleştirmektir. Bir h2, nasıl stillendirildiğinden bağımsız olarak belge taslağında her zaman bir h2'dir.
En İyi SEO Web Siteleri: Ortak Noktaları Nelerdir
En iyi SEO web sitelerini incelemek tutarlı bir örüntü ortaya koyuyor. Üst sıralardaki siteler tek bir rekabet avantajına dayanmıyor. Birden fazla sinyali birleştiriyorlar: güçlü teknik temeller, içerik derinliği, yapılandırılmış veri ve link otoritesi.
Teknik Temel
Rekabetçi SERP'lerde en iyi performans gösteren siteler şu özellikleri paylaşır:
- Medyan bağlantı hızlarında mobilde 2 saniyenin altında LCP
- İçerik sayfalarında 0,1'in üzerinde sıfır CLS
- URL parametrelerinden, sondaki eğik çizgilerden veya oturum tanımlayıcılarından kaynaklanan yinelenen içerik olmaksızın temiz canonical uygulaması
- Yayında programatik olarak güncellenen, taranabilir sayfa envanterini doğru biçimde yansıtan XML sitemap'ler
- Crawler'ın sayfaları render etmesi için ihtiyaç duyduğu CSS veya JavaScript'i engellemeden herkese açık olmayan sayfaları (admin panelleri, API uç noktaları, staging URL'leri) engelleyen Robots.txt
Bunlar optimizasyon değil, temel gereksinimlerdir. Bu gereksinimleri karşılamayan siteler, içerik kalitesinden bağımsız olarak yapısal bir dezavantajla rekabet eder.
İçerik Derinliği ve Konu Otoritesi
Üst sıralardaki siteler, konuları yüzeysel değil kapsamlı biçimde ele alarak konu otoritesi inşa eder. "Proje yönetimi yazılımı" hakkında tek bir blog yazısı olan bir site, 40 ilgili soruyu kapsamlı şekilde yanıtlayan — metodolojiler, entegrasyonlar, ekip büyüklükleri, fiyatlandırma modelleri ve karşılaştırmalar dahil — bir sitenin gerisinde kalır.
Bu bir yazarlık kararı değil, içerik mimarisi kararıdır. İçerik ağırlıklı bir sitenin bilgi mimarisi, herhangi bir içerik yazılmadan önce konuları URL'lere açıkça eşlemelidir. Sütun sayfalar nelerdir? Destekleyici küme sayfalar nelerdir? Birbirlerine nasıl link veriyorlar?
Konu otoritesi birikerek büyür. Her iyi yürütülmüş küme sayfası, sütun sayfanın otoritesini artırır ve tersi de geçerlidir. Konu derinliğine yatırım yapan siteler, zamanla yapısal olarak üst sıradan düşürülmesi daha zor hale gelir.
Yapılandırılmış Veri
Schema markup doğrudan sıralamaları iyileştirmez, ancak arama sonucu alanını genişletir. Zengin sonuçlar — FAQ açılır menüleri, inceleme yıldızları, nasıl yapılır adımları, makale meta verileri — sıralamaları artırmadan tıklama oranlarını yükseltir. CTR kendi başına bir kalite sinyalidir.
En iyi performans gösteren siteler yapılandırılmış veriyi seçici değil, tutarlı biçimde uygular. Ürün sayfalarında Product ve Offer schema'sı bulunur. Blog yazılarında yazar Person entity'leri içeren Article schema'sı vardır. SSS bölümlerinde FAQPage schema'sı mevcuttur. Veriler görünür içerikle tam olarak eşleşir — yapılandırılmış veri ile görünür içerik arasındaki tutarsızlıklar manuel kalite cezalarını tetikler.
Web Tasarımı ve SEO: Pratik Uygulama İlkeleri
Mobile-First Zorunludur
Mobil trafik çoğu sektörde masaüstü trafiğini aşıyor. Google önce sitenizin mobil sürümünü indexler. Masaüstü için tasarlayıp ardından mobil için uyarlamak, hem daha kötü bir mobil deneyim hem de daha kötü bir index girişi üretir. Önce mobil tasarlayın, ardından daha büyük ekranlar için geliştirin.
Bu; tipografi, dokunma hedef boyutları, navigasyon kalıpları, görsel ölçekleme ve layout yoğunluğunu etkiler. Mobile-first tasarım kısıtı, siteleri daha hızlı ve kullanılabilir yapan kararları zorlar — bu da daha iyi SEO sonuçları üretir.
URL Tasarımı Bir Tasarım Kararıdır
URL'ler açıkça tasarlanmalıdır. Bunlar kalıcı tanımlayıcılardır. Yayından sonra bir URL değiştirilmesi 301 yönlendirmesi gerektirir ve bu da küçük ama gerçek bir link değeri maliyeti taşır. URL'leri tasarım aşamasında doğru yapmak, sonradan düzeltmekten çok daha ucuzdur.
İyi URL tasarımı:
- Kelime ayırıcı olarak tire kullanan küçük harf kullanır
- Sayfa için birincil anahtar kelimeyi içerir
- İçerik gerçekten zaman endeksli değilse tarihleri hariç tutar (haberler, changelog'lar)
- Bir adlandırılmış entity'nin parçası olmadıkça stop word'leri hariç tutar
- Hatırlanabilir ve paylaşılabilir olacak kadar kısadır
Sayfa Hızı Bir Tasarım Kısıtıdır
Sayfa hızını, ekran genişliğini ele aldığınız gibi bir tasarım kısıtı olarak ele alın. Tasarım başlamadan önce bir performans bütçesi tanımlayın: maksimum JavaScript payload'u, maksimum görsel ağırlığı, maksimum üçüncü taraf istek sayısı. Tasarım kararlarını bu bütçeye göre değerlendirin.
Bu, SEO ve performans mühendisliğinin tasarımlar finalize edildikten sonra bir inceleme slotuna değil, tasarım masasına dahil olmasını gerektirir. İnceleme aşamasında bir tasarımı değiştirmenin maliyeti, ilk keşif sırasında farklı bir karar vermenin maliyetinin on katıdır.
SEO Web Sitesi Örneği: İyi Yürütülmüş Bir Lansman Nasıl Görünür
Yeni bir ürün landing page'i yayına alan bir SaaS şirketini ele alalım. Bu sürecin iyi yürütülmüş bir SEO web sitesi örneği şöyle görünür:
Lansman öncesi (tasarım aşaması)
- Anahtar kelime araştırması, birincil terimi ve destekleyici küme anahtar kelimelerini belirler
- URL, anahtar kelime önceliğine ve bilgi mimarisi uyumuna göre seçilir
- Sayfa şablonu, içerik bölümlerine eşlenen başlık hiyerarşisiyle tanımlanır
- Görsel varlıklar, boyutlar, format ve alt metin yönergeleriyle belirtilir
- Yapılandırılmış veri schema'sı seçilir ve içerik schema alanlarına eşlenir
Geliştirme aşaması
- Performans bütçesi, otomatik CI kontrolleri (Lighthouse, WebPageTest) aracılığıyla uygulanır
- Semantik HTML, tasarım tarafından belirtilen başlık yapısına göre doğrulanır
- Canonical etiketi, meta açıklaması ve Open Graph etiketleri template haline getirilir ve doldurulur
- XML sitemap, yayında programatik olarak güncellenir
Lansman sonrası
- Sayfa, Google Search Console aracılığıyla indexleme için gönderilir
- Yapılandırılmış veri, Rich Results Test'te doğrulanır
- Core Web Vitals, Search Console ve gerçek kullanıcı izlemesinde takip edilir
- İlgili sayfalardan dahili linkler ilk 48 saat içinde eklenir
Bu süreç karmaşık değil. Disiplinli. Sıralanan bir site ile sıralanmayan bir site arasındaki fark genellikle içerik kalitesi değil, teknik ve yapısal ayrıntılardaki tutarlı yürütmedir.
Küresel SEO ve Pazar Genişlemesi: Uluslararasılaştırma Katmanı
Tek bir dil için web tasarımı ve arama motoru optimizasyonu yeterince karmaşıktır. Birden fazla dil ve pazarda sıralanan bir site inşa etmek, her kararı daha da karmaşık hale getirir.
Hreflang Uygulama Sorunu
Hreflang attribute'ları, arama motorlarına hangi dil ve bölge için sayfanın hangi versiyonunu sunacaklarını söyler. Doğru uygulandığında, dil varyantları arasındaki yinelenen içerik cezalarını önler ve kullanıcıların uygun versiyona yönlendirilmesini sağlar.
Yanlış uygulandığında — ki bu sık gerçekleşir — tam tersini üretir. Yaygın başarısızlık modları:
- Eksik dönüş linkleri:
/en/pagesayfasının/de/page'e işaret eden bir hreflang'i varsa,/de/pagesayfasının da/en/page'e geri işaret eden bir hreflang'i olmalıdır. Eksik dönüş linkleri direktifin görmezden gelinmesine neden olur. - Tutarsız URL formatları: Hreflang etiketleri arasında mutlak ve göreli URL'lerin karıştırılması veya sondaki eğik çizgi tutarsızlıkları, parse hatalarına yol açar.
- Sitemap dışında bırakma: Hreflang'de listelenen ancak sitemap'lerden hariç tutulan sayfalar, crawler'lar tarafından daha düşük güvenle değerlendirilir.
Ölçekte hreflang'i manuel olarak yönetmek mümkün değildir. Bir lokalizasyon veri kaynağından otomatik üretim, güvenilir tek yaklaşımdır.
Uluslararası Siteler İçin URL Yapısı
Uluslararası siteler için üç geçerli yapı mevcuttur:
| Yapı | Örnek | Değiş Tokuş |
|---|---|---|
| ccTLD | example.de, example.fr | En güçlü coğrafi hedefleme sinyali, en yüksek bakım maliyeti |
| Subdomain | de.example.com, fr.example.com | Orta düzey coğrafi hedefleme, ayrı crawl bütçeleri |
| Alt dizin | example.com/de/, example.com/fr/ | Domain otoritesini paylaşır, yönetimi daha kolaydır |
Alt dizin, çoğu ekip için en pratik seçimdir. Link değerini tek bir domain'de toplar ve birden fazla TLD veya subdomain yönetiminin operasyonel yükünü azaltır.
Çeviri Kalitesi Bir SEO Faktörü Olarak
Makine çevirisi iki nedenden dolayı zayıf sıralanan içerik üretir. Birincisi, anadili konuşanların bilgi arama şeklini yansıtmayan çevrilmiş içerik, herhangi bir pazardaki arama hacminin büyük çoğunluğunu oluşturan uzun kuyruklu sorguları kaçırır. İkincisi, düşük kaliteli çevrilmiş içerik, arama kalitesi değerlendiricilerine düşük kaliteli sayfalar olduğunu işaret eder.
Etkili uluslararası SEO, kaynak dil anahtar kelimelerinin doğrudan çevirisini değil, pazara özgü anahtar kelime araştırmasını gerektirir. "Proje yönetimi yazılımı" Almancaya kelimesi kelimesine çevrilir, ancak Almanya'daki gerçek arama hacmi, İngilizce konuşulan pazarlara kıyasla farklı ifadelere, marka adlarına ve sorgu amaçlarına dağılmıştır.
Better-i18n'in Ölçekte Uluslararası SEO'yu Nasıl Desteklediği
Üstüne SEO gereksinimleri katmanlanmış düzinelerce dil varyantında çevirileri yönetmek, dosya tabanlı çeviri sistemlerinin verimli biçimde yönetemeyeceği iş akışı karmaşıklığı yaratır.
Better-i18n, çeviri yönetimini deployment pipeline'ından ayırarak uluslararası SEO'nun operasyonel tarafını çözer. Meta başlıklar, meta açıklamaları ve yapılandırılmış veri dizeleri gibi SEO açısından kritik öğeler dahil çeviri güncellemeleri, bir build tetiklemeden doğrudan CDN'e yayınlanır. Bir lokalizasyon yöneticisi, bir pull request açmadan Almanca meta açıklamasını düzeltebilir ve 30 saniyeden kısa sürede yayına alabilir.
Bu SEO açısından önemlidir çünkü arama motoru yeniden tarama döngüleri günler ve haftalar olarak ölçülür. Hatalı bir meta açıklamasının bir sayfada geçirdiği her saat, boşa harcanan crawl bütçesi ve tıklama potansiyelidir. Hızlı yayın döngüleri, bir SEO sorununu tespit etmekle çözmek arasındaki geri bildirim döngüsünü sıkıştırır.
Better-i18n ayrıca AST tabanlı key taraması sağlar; bu sayede sayfa başlıkları, meta açıklamaları, Open Graph etiketleri ve yapılandırılmış veri alanları gibi SEO açısından kritik template'lerde kullanılan çeviri key'lerinin her dil varyantında her zaman mevcut olduğu garanti edilir. Bu alanlardaki eksik çeviriler, boş meta etiketleri üretir; bu ise kusurlu çevirilerden daha fazla sıralama zararı verir.
SEO'ya Zarar Veren Yaygın Web Tasarımı Hataları
JavaScript ile Render Edilen İçerik
İçeriği tamamen client-side JavaScript aracılığıyla render eden single-page application'lar, arama motorları için zorluklar yaratır. Googlebot JavaScript'i çalıştırsa da render işlemi ertelenmiş ve ikincil bir crawl dalgasında gerçekleşir; bu, içeriğin yayından günler veya haftalar sonra indexlenemeyebileceği anlamına gelir.
Server-side rendering veya static generation, hızla indexlenmesi gereken içerik için tercih edilir. Kimliği doğrulanmış ürünün sıralama gerektirmediği SaaS uygulamaları için client-side rendering kabul edilebilir. Ayrım önemlidir: pazarlama sayfaları, blog yazıları ve landing page'ler client-side render edilmemelidir.
Orphan Sayfalar
Kendisine işaret eden dahili linki olmayan sayfalar, düzensiz biçimde ya da hiç taranmaz. İçerik mükemmel olabilir ve crawler tutarlı biçimde ziyaret etmediği için hiç sıralanmayabilir. Her yayımlanan sayfanın, ilgili ve indexlenmiş bir sayfadan en az bir dahili linki olmalıdır.
Destekleyici Sayfalarda İnce İçerik
Rekabetçi pazarlarda, destekleyici sayfalar — kategori sayfaları, etiket sayfaları, konum sayfaları — çoğunlukla minimal benzersiz içerikle programatik olarak oluşturulur. Arama motorları bu sayfaları tanımlar ve değersizleştirir. Bir sayfa kullanıcıya gerçek değer sağlamıyorsa, ya zenginleştirilmeli ya da noindex direktifi ile index dışında bırakılmalıdır.
Sayfa Deneyimi Sinyallerini Görmezden Gelmek
Core Web Vitals öneriler değildir. LCP, INP veya CLS eşiklerinde tutarlı biçimde başarısız olan siteler sıralama düşürme için adaydır. Bu, Search Console'da ölçülebilir. Sitenizin Core Web Vitals raporu, önemli sayıda sayfada zayıf performans gösteriyorsa, bu gelecekteki bir risk değil, aktif bir sıralama baskılama olayıdır.
Uzun Vadeli Organik Performans İçin İnşa Etmek
En iyi performans gösteren SEO siteleri bir kez optimize edilip pasif biçimde sürdürülmez. Aktif izleme, düzenli içerik güncellemeleri ve sürekli teknik sağlık kontrolleriyle yaşayan sistemler olarak ele alınırlar.
Sürdürülebilir bir SEO operasyonu şunları içerir:
- Haftalık: Crawl hataları, kapsam sorunları ve yeni sıralama fırsatları için Search Console'u inceleyin
- Aylık: Core Web Vitals'ı gerileme açısından denetleyin, dahili link yapısını gözden geçirin, eski içeriği güncelleyin
- Üç aylık: Tam teknik denetimler yapın, rakip link profillerini inceleyin, sorgu verilerine dayalı olarak konu kümelerini genişletin
- Yıllık: Bilgi mimarisini yeniden değerlendirin, site yapısının mevcut içerik envanterine uygun olup olmadığını değerlendirin
Bugün alınan web tasarımı kararları, SEO seçeneklerinizi yıllarca kısıtlar. Semantik başlık standartları olmadan inşa edilmiş bir design system, düzeltmek için geriye dönük bir refactor gerektirir. Anahtar kelime araştırması yapılmadan seçilen bir URL yapısı, değiştirmenin yönlendirme maliyetini karşılamadığınız sürece kalıcı olarak yetersizdir.
SEO'nun birikmeli doğası, tasarım ve uygulama aşamasında tutarlı biçimde uygulanan disiplinin aylar ve yıllar içinde hızlanan getiriler ürettiği anlamına gelir. Güçlü teknik temeller, semantik yapı ve uluslararası lokalizasyonla doğru biçimde başlayan bir site, yalnızca birinci günde daha iyi sıralanmakla kalmaz — bu temelden yoksun rakiplerin kolayca çoğaltamayacağı avantajlar biriktirir.
Web tasarımı ve arama motoru optimizasyonu ayrı disiplinler değildir. Farklı bakış açılarından ele alınan aynı disiplindir. Bunu anlayan ekipler, sıralanan siteler yayımlar. Bunları ayıran ekipler ise zamanlarını önlenebilir hasarı geri almakla geçirir.
Better-i18n, ekiplerin çok dilli içeriği ölçekte yönetmesine yardımcı olur — hızlı CDN teslimatı, otomatik key doğrulama ve deployment gerektirmeyen çeviri güncellemeleriyle. Uluslararası bir site inşa ediyor veya ölçeklendiriyorsanız, ücretsiz plan iş akışının ekibinize uygun olup olmadığını görmek için yeterlidir.