Bir web sitesinin markayı yansıtması, logoyu sol üst köşeye koymakla olmuyor. Marka kimliği; renklerin, yazı tiplerinin, boşlukların, fotoğraf seçiminin ve dil tonunun birlikte oluşturduğu tutarlı bir bütün. Ziyaretçi bu bütünü bilinçli olarak analiz etmez, ama saniyeler içinde bir izlenim edinir: burası ciddi mi, güncel mi, güvenilir mi, bana uygun mu?
Kurumsal sitelerde sık gördüğüm sorun, kimliğin hiç kurulmamış olması değil; parça parça kurulmuş olması. Ana sayfada bir renk, iletişim sayfasında başka bir mavi tonu, blogda farklı bir yazı tipi. Her bölüm tek başına makul görünür, bütün ise dağınık hissettirir.
Bu yazıda bir web sitesi için marka kimliğinin nasıl kurulacağını, uygulanabilir adımlarla anlatacağım.
Kimlikten Önce: Marka Ne Söylüyor?
Görsel kararlara geçmeden önce sözel bir netlik gerekir. Üç soruya net cevap verebilmelisiniz: Kime hitap ediyorsunuz? Rakiplerinizden farkınız ne? Ziyaretçinin sizden ne hissetmesini istiyorsunuz?
Üçüncü soru en çok atlanan ama görsel kararları en çok belirleyen sorudur. “Güvenilir ve kurumsal” hissi ile “genç ve erişilebilir” hissi tamamen farklı renk, yazı tipi ve fotoğraf tercihleri gerektirir.
Bu cevapları üç ila beş sıfatla yazın ve tasarım sürecinde her kararı bu sıfatlara karşı test edin.
Renk Sistemi Kurmak
Renk seçimi, “marka rengimiz mavi” demekle bitmiyor. İşleyen bir renk sistemi katmanlıdır.
Birincil renk. Markanın ana rengi. En çok tanınan ve en az kullanılan renktir — evet, en az. Birincil renk her yerde kullanıldığında vurgu gücünü kaybeder.
İkincil renk. Birincil rengi destekleyen, bölüm ayrımlarında ve ikincil öğelerde kullanılan ton.
Vurgu rengi. Yalnızca eylem çağrılarında kullanılan, dikkat çeken renk. Bu rengin siteye başka hiçbir yerde girmemesi, tıklama oranını doğrudan artırır. Ziyaretçi bilinçaltında “bu renk tıklanabilir demek” öğrenir.
Nötr tonlar. Metin, arka plan, kenarlık ve ayraçlar için kullanılan gri skalası. Bir sitenin görsel kalitesi, çoğu zaman renkli tonlardan çok nötr skalanın inceliğine bağlıdır. Saf siyah (#000000) metin yerine koyu gri kullanmak, okuma konforunu belirgin biçimde artırır.
Durum renkleri. Başarı, uyarı ve hata mesajları için ayrı tonlar. Bunlar marka renginden bağımsız olmalı; kırmızı hata, yeşil başarı beklentisi evrenseldir.
Kontrast kontrolü. Her metin-arka plan kombinasyonunun okunabilir olduğundan emin olun. Açık gri zemin üzerine açık gri metin, tasarım dergilerinde şık görünür ama gerçek kullanıcıyı zorlar.
Tipografi Ölçeği
Yazı tipi seçimi kadar, o yazı tipinin nasıl kullanıldığı önemlidir.
Yazı tipi sayısını sınırlayın. İki yazı tipi çoğu site için yeterlidir: biri başlıklar, biri gövde metni. Tek bir yazı tipinin farklı ağırlıklarını kullanmak da güçlü ve tutarlı bir sonuç verir.
Bir ölçek tanımlayın. Başlık boyutlarını rastgele değil, matematiksel bir orana göre belirleyin. Örneğin her seviye bir öncekinin belirli bir katı olsun. Bu, sayfalar arası tutarlılığı otomatik olarak sağlar.
Satır uzunluğunu kontrol edin. Bir satırda 60-80 karakter, okuma için ideal aralıktır. Geniş ekranlarda metin bloğunun genişliğini sınırlamak, okuma konforunu ciddi biçimde artırır.
Satır yüksekliğini ferah tutun. Gövde metninde satır yüksekliği, yazı boyutunun yaklaşık 1,6 katı olduğunda okuma akıcı hale gelir.
Performansı unutmayın. Her yazı tipi ağırlığı ek bir dosya demektir. Üç ağırlık yeterliyken dokuz ağırlık yüklemek, her ziyarette ödenen bir maliyettir. Yazı tiplerini kendi sunucunuzdan servis edin.
Boşluk Sistemi
Tasarımın en az konuşulan ama en çok fark yaratan unsuru boşluktur. Sıkışık bir sayfa ucuz, ferah bir sayfa güvenilir hissettirir.
Boşlukları da bir sisteme oturtun: belirli bir temel birim seçin ve tüm boşlukları bu birimin katları olarak kullanın. Rastgele belirlenmiş boşluklar, gözle fark edilmese bile bütünde dağınıklık hissi yaratır.
Bölümler arası boşluk, bölüm içi boşluktan belirgin biçimde büyük olmalı. Bu fark, ziyaretçiye içeriğin nerede başlayıp nerede bittiğini anlatır — hiçbir çizgi çekmeden.
Görsel Dil
Fotoğraf ve grafik seçimi, markanın en hızlı algılanan tarafıdır.
Tutarlılık kurun. Fotoğraflarınızın ışık tonu, doygunluğu ve çerçeveleme biçimi benzer olmalı. Farklı kaynaklardan toplanmış görseller, ne kadar kaliteli olursa olsun, bir arada dağınık durur.
Stok fotoğrafa dikkat. Herkesin kullandığı, aşırı sahnelenmiş kurumsal fotoğraflar güven değil mesafe yaratır. Bütçe elverdiğinde kendi çekiminizi yaptırın; elvermiyorsa daha sade ve az kullanılan görselleri tercih edin.
İkon setini tek kaynaktan seçin. Farklı çizgi kalınlıklarına ve stillere sahip ikonların bir arada kullanılması, en sık yapılan tutarsızlıktır.
Görsel işleme kuralı belirleyin. Köşe yuvarlaklığı, gölge kullanımı, çerçeve stili — bunları bir kez kararlaştırın ve her yerde aynı şekilde uygulayın.
Tasarım Sistemini Belgeleyin
Kimliğin zamanla dağılmasını önlemenin tek yolu, kararları yazılı hale getirmektir. Basit bir tasarım sistemi belgesi şunları içermeli:
- Renk kodları ve her rengin nerede kullanılacağı
- Yazı tipleri, ağırlıklar ve boyut ölçeği
- Boşluk birimleri
- Buton stilleri (birincil, ikincil, pasif durumlar)
- Form alanı görünümleri
- Kart ve bölüm şablonları
- Görsel oranları ve işleme kuralları
- Yapılmaması gerekenler listesi
Son madde önemlidir. “Marka rengini arka plan olarak kullanmayın”, “logoyu esnetmeyin”, “üçten fazla yazı tipi ağırlığı kullanmayın” gibi net yasaklar, bir sonraki kişi projeye dahil olduğunda kimliği korur.
WordPress’te Uygulamak
Bu sistemi WordPress’te sürdürülebilir biçimde uygulamanın yolu, kararları merkezî olarak tanımlamaktır. Blok temalarda `theme.json` dosyası tam olarak bunun içindir: renk paleti, tipografi ölçeği ve boşluk birimleri burada tanımlanır ve tüm site bunları kullanır.
Bunun pratik faydası şudur: marka rengi değiştiğinde tek bir yerden güncellersiniz, tüm site değişir. Renkleri sayfa sayfa elle girdiğiniz bir sitede aynı değişiklik günler sürer ve mutlaka bir yer gözden kaçar.
İçerik ekibine de sık kullanılan bölümleri hazır desen olarak sunun. Boş sayfadan başlayan her kullanıcı, kendi tasarım kararlarını verir ve kimlik zamanla erir.
Dil Tonu da Kimliğin Parçası
Marka kimliği tartışmaları genellikle görsel unsurlarda kalır, oysa sitenin nasıl konuştuğu en az renk paleti kadar belirleyicidir. Aynı bilgiyi veren iki cümle, tamamen farklı marka algısı üretebilir.
Dil tonunu belirlemek için birkaç ekseni kararlaştırın: resmi mi samimi mi, ciddi mi esprili mi, teknik mi sade mi, “siz” mi “sen” mi. Bu kararları yazılı hale getirin ve örneklerle destekleyin.
En faydalı yöntem, “böyle yazarız / böyle yazmayız” biçiminde karşılaştırmalı örnekler hazırlamaktır. “Formu doldurun, size dönelim” ile “Talebinizi iletmek için lütfen aşağıdaki formu eksiksiz doldurunuz” arasındaki fark, iki farklı markadır.
Bu kılavuz, farklı kişiler içerik ürettiğinde tutarlılığı korur. Sitede beş farklı kişinin yazdığı beş farklı sesle konuşan bir marka, ne kadar güzel tasarlanmış olursa olsun dağınık hissettirir.
Kimliği Zamanla Koruma
Bir tasarım sistemi kurmak, işin yarısıdır. Diğer yarısı, aylar geçtikçe sistemin erimesini önlemektir.
Erime genellikle küçük istisnalarla başlar. Bir kampanya için farklı bir renk kullanılır, bir sayfada başka bir yazı tipi denenir, bir buton “daha dikkat çeksin diye” farklı biçimde tasarlanır. Tek tek hiçbiri sorun gibi görünmez; altı ay sonra site kendi kimliğine benzemez.
Bunu önlemenin yolları: yeni bölümleri sıfırdan tasarlamak yerine mevcut desenlerden kurmak, içerik üretenlere hazır blok desenleri sunmak, üç ayda bir sitenin tamamını gözden geçirip sapmaları düzeltmek ve tasarım sistemi belgesini güncel tutmak.
Ayrıca yeni bir kişi projeye dahil olduğunda, ilk iş olarak bu belgeyi okumasını sağlayın. Kimlik, aktarılmadığı sürece korunmaz.
Kimlik Kararlarını Test Etmek
Marka kimliği kararları öznel görünür, ancak bazı kısımları ölçülebilir. Yeni bir renk paleti veya tipografi ölçeği uygulamadan önce birkaç kontrol yapın.
Metin okunabilirliğini gerçek cihazlarda deneyin; ekran parlaklığı düşük bir telefonda okunmayan bir gri, tasarım ekranında sorunsuz görünebilir. Kontrast oranlarını ölçün. Renkleri gri tonlamaya çevirip hiyerarşinin korunup korunmadığına bakın.
Bir de basit bir dış göz testi yapın: siteyi hiç görmemiş birine gösterip markayı üç sıfatla tarif etmesini isteyin. Söyledikleri, hedeflediğiniz sıfatlarla örtüşüyorsa kimlik işini yapıyor demektir.
Sonuç
Marka kimliği, güzel görünmekle ilgili bir mesele değil; tanınabilir ve tutarlı olmakla ilgili. Sınırlı sayıda renk, iyi kurulmuş bir tipografi ölçeği, disiplinli bir boşluk sistemi ve tutarlı bir görsel dil — bu dördü, çok daha pahalı görünen sitelerin arkasındaki asıl sırdır.
Sitenizin marka kimliğini kurmak veya mevcut kimliği bir tasarım sistemine oturtmak isterseniz iletişime geçebilirsiniz.