Yeni sitemizi nasıl kurduk? Perde arkasından teknik bir tur.

Eski sitemiz güzeldi ama tek bir uzun sayfaydı. Ne yaptığımızı anlatıyordu, fakat bir ziyaretçinin "Netsis'ten nakit raporu alabilir miyim?" ya da "yerden ısıtma firması için site nasıl olmalı?" gibi somut sorusuna ayrı bir sayfayla cevap veremiyordu. Arama motorları ve yapay zekâ asistanları da tam olarak bunu arıyor: net bir soruya net bir cevap veren, kendi adresi olan sayfalar.

Yeni sitenin hedefini üç cümlede özetledik: her hizmetin, ürünün, sektörün ve referansın kendi sayfası olsun; her sayfa hem insana hem makineye kendini doğru anlatsın; site, müşterilerimize önerdiğimiz her şeyin canlı bir örneği olsun. Aşağıda bu hedefe nasıl ulaştığımızı adım adım anlatıyoruz.

Rakamlarla yeni site

Mimari: veritabanı yok, eklenti yok, çerçeve yok

İlk kararımız bir içerik yönetim sistemi kurmamak oldu. Kurumsal bir sitenin sayfaları sık değişmez; değiştiğinde de değişikliğin kimin tarafından, ne zaman yapıldığının bilinmesi gerekir. Bu yüzden her sayfayı tek bir Markdown dosyası olarak tuttuk ve bütün içerik sürüm kontrolünde (git) duruyor. Her düzeltme bir kayıt; geri almak bir komut.

Sayfaları üreten motor yaklaşık 1.300 satırlık sade bir PHP 8.3 uygulaması:

• Tek giriş noktası: Sunucu, dosya olmayan her adresi uygulamaya yönlendiriyor; uygulama adresi içerik klasöründeki dosyayla eşliyor. /hizmetler/seo-ve-geo adresi hizmetler/seo-ve-geo içeriğinden üretiliyor.
• Uzantısız, anlamlı adresler: .html ya da .php yok; adres okunduğunda sayfanın ne anlattığı anlaşılıyor. Sonda eğik çizgi (/) olan adresler tek biçime kalıcı olarak yönlendiriliyor.
• Ön bilgi (front matter): Her dosyanın başında sayfa başlığı, arama motoru açıklaması, giriş cümlesi, sırası ve türü var. Blog yazılarında tarih, kategori ve ilgili sayfalar da burada.
• Küçük bir işaretleme dili: Başlık, liste, tablo ve bağlantının yanında kendi eklediğimiz birkaç yapı var: ?? ile yazılan satırlar sıkça sorulan soru olup arama motorlarına SSS olarak bildiriliyor; !! öne çıkan kutu; [[children]] o bölümün alt sayfalarını kart olarak diziyor; [[tool:raporkur]] bir etkileşimli aracı sayfaya yerleştiriyor.

Veritabanı olmaması, saldırı yüzeyini ve bakım yükünü ciddi biçimde küçültüyor. Eklenti olmaması ise "bir güncelleme geldi, site bozuldu" sorununu ortadan kaldırıyor. Bu yaklaşımın hangi sitelere uyduğunu yönetim paneli seçimi yazımızda tartışmıştık.

İçerik mimarisi: her paragrafın bir sayfası var

Sitenin iskeletini ziyaretçinin sorabileceği sorulara göre kurduk:

1. Hizmetler: Her hizmet sayfası bir özet. İçindeki her ana başlık, o konuyu derinleştiren ayrı bir alt sayfaya bağlanıyor. Örneğin kurumsal web sitesi sayfasındaki "10 günde site" paragrafının kendi sayfası var.
2. Ürünler: IMFLEXI ve READERP'in her özelliği ve her hazır raporu ayrı sayfa. Böylece "alacak yaşlandırma raporu" arayan biri doğrudan o sayfaya düşüyor.
3. Sektörler: 16 sektörün her biri için o sektörün müşterisinin nasıl aradığı, sitede neler olması gerektiği ve mevzuat notları.
4. Referanslar: Her proje için sitenin ne yaptığı, nasıl kurgulandığı ve analiz tablosu; firmaların kendi logoları ve gerçek ekran görüntüleriyle.
5. Blog: On kategoride rehber yazılar; her yazı ilgili hizmet ve sektör sayfalarına bağlanıyor.

Bu kadar çok sayfayı tutarlı tutmak için bir yazım kılavuzu hazırladık: dil ve ton (sade, danışman gibi, abartısız), kullanılabilecek rakamlar, yazılmayacaklar (fiyat, doğrulanamayan iddia) ve SEO kuralları. İçeriklerin taslak aşamasında yapay zekâ destekli araçlardan yararlandık; her sayfayı bu kılavuza, gerçek verilere ve kendi deneyimimize göre kontrol ettik. Doğrulayamadığımız her cümleyi çıkardık. Bu dengeyi nasıl kurduğumuzu yapay zekâ ile içerik üretimi yazısında anlatıyoruz.

Tasarım: logodan doğan bir dil

Tasarımı logomuzdan türettik: mavi kıvrımlar, turuncu köşe ve lacivert yazı. Beyaz zemin üzerinde yumuşak renk geçişleri, kutusuz listeler ve bol boşluk kullandık. Giriş ekranında kendi cümlelerimiz yerine yaptığımız sitelerin gerçek ekran görüntüleri duruyor.

• Tek yazı tipi ailesi, kendi sunucumuzda; dışarıdan yazı tipi çağrısı yok.
• CSS değişkenleri ile renk ve ölçü sistemi; tek bir stil dosyası, hazır bir tasarım çerçevesi yok.
• Hareket azaltma tercihi: İşletim sisteminde animasyonları kısan ziyaretçilere kayan ve beliren efektler gösterilmiyor.
• Mobil ve tablet: Menü, asistan penceresi ve araçlar dar ekranlar için ayrı düzenleniyor. Tabletlerde klavye açıldığında pencerelerin ekrandan taşmaması için tarayıcının görünen alan bilgisini kullanıyoruz.

Hız: gereksiz olanı hiç yüklememek

Hızlı sitenin sırrı çoğu zaman bir şey eklemek değil, eklememektir. Stil dosyası yaklaşık 64 KB, ana betik 16 KB; sıkıştırılmış hâlde bunun küçük bir kısmı iniyor. Çerçeve, jQuery ya da ağır bir kütüphane yok.

• Görseller yalnız ekrana yaklaştıklarında yükleniyor; ekran görüntüleri sıkıştırılmış JPEG.
• Etkileşimli araçların betikleri yalnız aracın bulunduğu sayfada yükleniyor.
• Arama dizini sayfa açılırken değil, tarayıcı boştayken arka planda getiriliyor.
• Sunucu tarafında sayfa üretimi milisaniyeler sürüyor; ana sayfanın ilk yanıtı yaklaşık 25 ms.

Google'ın hız ölçütlerini Core Web Vitals rehberimizde ayrıntılı anlattık.

SEO: her sayfa kendini makineye de anlatıyor

Her sayfa üretilirken aynı kontrol listesinden geçiyor:

• Benzersiz başlık ve açıklama: Başlık 65, açıklama 160 karakteri aşmıyor; tekrarlayan başlık yok.
• Kanonik adres: Her sayfanın tek ve kalıcı adresi var.
• Yapılandırılmış veri (Schema.org): Kurum ve yerel işletme bilgisi (adres, telefon, çalışma saatleri, kurucular, uzmanlık alanları), konum yolu (breadcrumb), sayfa, hizmet, blog yazısı ve sıkça sorulan sorular. Ayrıntılar Schema.org yazımızda.
• Site haritası: Otomatik üretiliyor, her adresin gerçek güncelleme tarihiyle.
• Kalıcı yönlendirmeler: Eski sitenin adresleri yeni karşılıklarına 301 ile yönleniyor; aramalarda kazanılmış değer kaybolmuyor. Bu işin kontrol listesini site yenilerken trafik kaybı yazısında paylaşmıştık.
• İç bağlantı ağı: Her sayfa 3-6 ilgili sayfaya bağlanıyor. Her değişiklikten sonra çalışan bir denetim betiği kırık bağlantı, eksik açıklama, tekrarlayan başlık ve çok kısa sayfa arıyor.

Yapay zekâ aramaları (GEO): ChatGPT, Gemini ve Perplexity için

Artık pek çok kişi soruyu Google'a değil bir yapay zekâ asistanına soruyor. Asistanlar da cevabı anlaşılır, yapılandırılmış ve güvenilir kaynaklardan derliyor. Bu yüzden siteyi bu okurlar için de hazırladık:

• llms.txt: Firmamızın kısa özeti, temel bilgileri ve bütün sayfaların açıklamalı listesi. Ne olduğunu ve sınırlarını llms.txt yazımızda dürüstçe anlattık.
• llms-full.txt: Sitenin tüm içeriği tek bir düz metin dosyasında.
• Her sayfanın Markdown sürümü: Herhangi bir adresin sonuna .md eklendiğinde sayfanın sade metni geliyor. Bu sürümler arama motorlarında kopya içerik sayılmasın diye dizine kapalı ve asıl sayfayı gösteriyor.
• Yapay zekâ tarayıcılarına açık kapı: robots.txt dosyamız GPTBot, OAI-SearchBot, ClaudeBot, PerplexityBot ve Google-Extended gibi tarayıcılara içeriği okuma izni veriyor. Bu kararın artı ve eksilerini yapay zekâ botları ve robots.txt yazısında tartıştık.
• Varlık tutarlılığı: Firma adı, adres, telefon, kurucular ve ürün tanımları her sayfada ve her dosyada aynı. Yapay zekâ sistemleri çelişkili bilgiye güvenmiyor.
• IndexNow: Yeni ya da güncellenen sayfaları Bing'e anında bildirebiliyoruz; Bing dizini birçok yapay zekâ aramasının kaynaklarından biri.

Her sayfanın kendi paylaşım görseli

Bir sayfayı WhatsApp ya da LinkedIn'de paylaştığınızda çıkan görsele OG görseli denir. Eski sitede her sayfa aynı görseli kullanıyordu. Yeni sitede her sayfanın görseli, sunucuda sayfanın başlığı, bölümü ve açıklamasıyla otomatik üretiliyor; referans sayfalarında sitenin ekran görüntüsü de ekleniyor. Görseller önbelleğe alınıyor ve içerik değiştiğinde kendiliğinden yenileniyor.

Küçük bir teknik not: sunucudaki görüntü kütüphanesi Türkçe karakterleri ilk denemede boş kutu olarak çizdi. Metni karakter kodlarına çevirerek çözdük. "ı, ş, ğ" gibi harflerin her ortamda test edilmesi gerektiğini bir kez daha hatırladık.

Ziyaretçi için araçlar: anlatmak yerine göstermek

• READERP rapor kurucu: Nakit, alacak, ciro, stok ve bordro bloklarını sürükleyip bırakarak kendi ERP raporunuzu iki dakikada kurabiliyorsunuz. Kurduğunuz rapor tek tıkla iletişim formuna ya da asistana aktarılıyor.
• IMFLEXI ihtiyaç sepeti: E-ticaret özelliklerini sepete ekliyorsunuz. "Satın al" dediğinizde kart bilgisi değil, sizi tanımamızı sağlayan kısa ve eğlenceli bir brief açılıyor.
• Akıllı arama: Her sayfada Ctrl+K (Mac'te ⌘K) ya da "/" tuşuyla açılıyor. Türkçe karakterden bağımsız çalışıyor ("gida" yazınca "gıda" da çıkıyor), eş anlamlıları tanıyor; bulamazsa soruyu asistana aktarmayı öneriyor.
• Globya asistanı: Yapay zekâ destekli, 7/24 çevrimiçi. Sayfalardaki "asistana sorun" bağlantıları asistanı açıp o sayfanın konusuyla hazır bir soru gönderiyor.
• Küçük sürprizler: Sayfanın en altında beş oyunluk bir oyun salonu, gizli bir klavye kodu ve birkaç şaşırtıcı dokunuş. Hepsini bulmayı size bırakıyoruz.

Ölçüm: neyin işe yaradığını görmek

Mevcut ölçüm aracımızı (Microsoft Clarity) koruduk ve üzerine anlamlı olaylar ekledik: telefon ve e-posta tıklaması, form başlatma ve gönderme, asistanın hangi sayfadan açıldığı, araçların kullanımı, aramalar ve referans sitelerine gidişler. Böylece hangi sayfanın gerçekten iş getirdiğini görebiliyoruz. Ölçüm yalnız ziyaretçi çerez onayı verdiyse çalışıyor; onay yoksa hiçbir veri gönderilmiyor.

KVKK ve güvenlik

• Çerez onayı: Analitik yalnız açık rızayla yükleniyor, ret seçeneği eşit ağırlıkta.
• Formlar: Aydınlatma metni bağlantısı ve ayrı onay kutusu, bot koruması (görünmez tuzak alanı, süre kontrolü ve doğrulama), gönderim hızı sınırı.
• Güvenlik başlıkları: İçerik güvenlik politikası (CSP), HSTS, çerçeveleme ve tür koklama korumaları.
• İç klasörler dışarıya kapalı: İçerik kaynakları ve uygulama dosyaları doğrudan adresle açılamıyor.

KVKK'ya bakışımızı KVKK yaklaşımımız sayfasında anlattık.

Geçiş: tek adımda, hiçbir şey kırılmadan

Yeni siteyi önce ayrı bir adreste yayına hazırladık, arama motorlarına kapalı tuttuk ve her bölümü tamamlandıkça ekip olarak inceledik. Hazır olduğunda geçişi tek adımda yaptık:

1. Kök adres yeni siteye bağlandı; müşteri portalı, müşteri paneli, yönetim paneli ve API'ye dokunulmadı.
2. Eski adresler kalıcı olarak yeni karşılıklarına yönlendirildi.
3. Eski site silinmedi; yalnız ekibimizin erişebileceği, şifreli ve arama motorlarına kapalı bir adrese taşındı.
4. Site haritası, robots.txt ve llms.txt yenilendi.

Her adımı otomatik bir tarayıcıyla, masaüstü, tablet ve telefon boyutlarında ekran görüntüsü alarak test ettik. Bir müşterimize önerdiğimiz "mevcut siteye dokunmadan hazırla, hazır olunca tek adımda geç" yöntemini kendi sitemizde de uyguladık.

Bundan sonrası

Site bitmiş bir iş değil; yaşayan bir kaynak. Yeni referansları, yeni rehber yazıları ve ürünlerimizdeki gelişmeleri eklemeye devam edeceğiz. Ölçüm verisine bakıp hangi sayfanın daha iyi anlatılması gerektiğini göreceğiz.

Kendi siteniz için benzer bir yenileme düşünüyorsanız kurumsal web sitesi ve SEO ve GEO sayfalarımıza göz atabilir, ya da doğrudan ücretsiz ön analiz isteyebilirsiniz.