Font olayı

Elinde bir bardak kahve ile odasına geldi. Aklı başında değil gibi bir hali vardı. Sanki bir şey hatırlamaya çalışıyor ama başaramıyordu. Sandalyesini altına doğru çekti farkında olmadan. Oturdu. Kahvesi artık masasının üstündeydi. Arkasına yaslandı, bu saçma sapan giriş yazısını nereye vardıracağımı düşünüyordu. Klavyesine dokundu. Önce hafifçe. Tek tek tuşlara vurdukça aklında bir soru yankılanıyordu. Adeta sonsuzluk gibi geçen bir süreden sonra kendi kendine sordu “Ne bok yiyorum lan ben. Alt tarafı fontlarla ilgili bişiler yazıcaz şunun şurasında…”Daha önce hatasız bir tasarım yapmak için dikkat edilmesi gereken 4 maddeyi açıklamış ve daha sonra bunlardan rengi incelemiştir bu sayfaların yazarı. Daha önce okumadıysanız, onlardan başlamanızı tavsiye ediyorum. Bugün ise font konusuna eğiliyoruz. Hazırsak eğilelim, olmadı kırılalım. Arkamızdan “kırıldı ama bükülmedi” derler! Ho ho ho

Ufaktan bir terminoloji ile girelim. Fontlar kendi aralarında görünüş olarak 3’e ayrılırlar. 1) Serif 2) Sans Serif 3) Script. Serif’li fontlarda harflerin üstünde ve altında ince bir çizgimsi dalga vardır ve bu da düz beyaz sayfa üzerinde yazının altında ve üstünde bir çizgi olmasını sağlayarak okuma kolaylığı oluşturur. Romalılar duvara yazı kazarken çekiçle vurdukları şey (adı neyse artık) kaymasın diye yapmaya başlamışlar bu dalgayı ilk olarak. Sans Serif ise bu Serif’sel çizginin olmadığı fontlardır. Yani serifsiz fontlar sans serifdir. Son olarak script ise el yazısı gibi görünen fontlardır. Bunların haricinde fontlar, open type, true type, postscript gibi bir formatsal ayrım yaşarlar. Bu salakça dalgayı aslında pek tınmasak da olur ama kısaca Apple, Adobe, Microsoft gibi büyük firmaların bir font formatı oluşturma davasıdır. Farkları bizi (ya da beni pek) ilgilendirmez, sadece open type fortların mac ve pc’de çalışabildiklerini bilsek bize yeter. Bu ultra yararlı bilgi hüzmesinden geçip, gelelim işin tasarımla ilgili kısmına.

Bir tasarımda metin kullanmak genellikle 2 çeşitte vücut bulur. Bunların her ikisi de tasarımımızın nasıl görüneceğini etkiler. Nasıl herhangi bir görsel öğeyi kompozisyonumuza eklediğimizde (imaj, illüstrasyon vs), sayfamızın bir kısmını kaplayıp, belli bir renk ağrılığı ve sayfada kullandığımız yere göre bir denge oluşturuyorsak, sayfamıza eklediğimiz metinler de aynı şekilde çalışır. Hangi fontu seçtiğimiz, ne büyüklükte kullandığımız, sayfanın neresine yerleştirdiğimiz hep tasarımımız üzerinde belli bir etki yaratır. Yukarıda 2 çeşit metin kullanabiliriz demiştim. Bunlara a) artistik kaygı ile eklenen metinler ve b) okunması için eklenen metinler diyebiliriz. Artistik kaygı ile eklenen metinler, genellikle başlık gibi büyük olarak kullanılırlar. Bunlar başlık olmak zorunda değildir, konu ile ilgili bir konsept kelimesi (ya da 2-3 kelime) olabilirler. Mesela deniz kirliliği ile ilgili bir tasarım yapıyoruz ve büyük bir su altı resmimiz var, bunun resmin bir yerine büyük puntolarla “Doğa Ana” yazmamız gibi. Bu bir başlık değildir ama tasarımımızda ilk göze çarpacak olan öğelerden birisi olacak ve genel tasarım hakkında oluşturmak istediğimiz fikri&hissi destekleyecektir. İlk olarak deniz altı resmini görüp, doğa ana lafını okuyan insanlarda “Deniz&doğa” ile ilgili bir şeye baktıkları hissini uyandıracaktır. Dikkat edilmesi gereken şey böylesi “artistik amaçla kullanılan büyük yazıların da bir leke yarattığı ve sayfamızda bir ağırlık oluşturduğudur.

Diğer metin kullanımı ise okunacak yazıları yazmamızla ilgilidir. Buradaki amacımız artık sadece tasarımımıza bakan insanların “evet güzel bir şeye” bakıyorum hissinden çok, net ve okunması zor olmayan bir metne bakıyor olmasını sağlamaktır. İlk tasarım yazısında belirttiğim gibi her tasarım bir mesaj vermek için yapılır ve büyük ihtimalle bu uzun metnin okunması bu mesaj için önemlidir. Dolayısıyla insanlar, güzel gözüken ama alt alta geldiklerinde okunması zor olan uzun bir metni okumak istemezler. Aslında insanlar, özellikle ülkemizde bir bok okumak istemezler açıkçası. O yüzden işimiz biraz daha zordur ama bunu metin yazarı problem etsin şimdilik. Okunması için yazılan uzun metinlerde dikkat edilmesi gereken diğer unsur gramatik doğruluk ve küçük harf kullanımıdır. Uzun bir yazıyı nokta virgül olmadan, hep büyük harfle yazarsak okunurluğu baltalamış oluruz. Ayrıca bu tür metinleri genellikle sola yaslamak önemlidir. Bir sürü pepe tasarımcı sadece güzel gözüktüğü için okunacak metinleri kelime araları açılacak şekilde her iki yana yaslarlar, bu tesadüfi bir şeydir. Bazen kelime araları çok açılmaz, ama çoğu kez kelime araları fazlaca açılır ve okunurluk sorunları baş gösterir. İlla her iki yana da hizalamak istiyorsak satır sonlarında (-) tire işareti kullanabiliriz.

Sonuç olarak artistik yazıları gösterişli harflerden oluşan büyük puntolarla ve tamamen büyük harf kullanarak yazabiliriz. Bu kısa bir metin olacağı için okuma ile ilgili bir sorun olmayacaktır Ama okunacak yazıları imla kuralları, sola yaslama, küçük harf kullanımı gibi şeylere dikkat ederek tasarımımıza eklemeliyiz. Ayrıca bunların tasarımda nereye konduğu, diğer görsel öğelere göre nasıl hizalandıkları önemlidir. Bu tür hizalamalar için bir grid kullanmak iyi sonuç verecektir.

Şu ana kadar bir tasarımda 2 tür metin kullandığımızı ve bunları kullanırken dikkat etmemiz gereken şeylerden bahsettik. Bunlar nispeten fonksiyonel tavsiyelerdi. Bundan sonraki kısımlar, font özellikleri, uyandırdıkları hisler, hangi fontu nasıl bir tasarımda kullanabiliriz gibi konulara odaklanacak.

Daha önce itiraf ettiğim gibi bu işe ilk başladığımda bir fontun diğerine göre farkı beni pek ilgilendirmiyordu. Sonuçta farklı görünen harflerdi bunlar ve bu kimin umurunda diye düşünüyordum. Ha garamond, ha helvetica, ne ki yani… Daha fazla yanılamazdım herhalde. Bugün biliyorum ki her fontun bir karakteri vardır ve bu karakter eğer tasarımımıza uymuyorsa o fontu kullanmamalıyız. Ayrıca internet erişimi sayesinde bir sürü font sitesinden milyonlarca font indirebiliriz. Bunların birçoğu birbirine benzer zaten. O yüzden belki de 20 tane font ailesi seçip, tüm tasarımlarımızı bu fontlarla yapabiliriz. Herhangi bir tasarımda genellikle tek bir font ailesi seçip kullanıyorum ben. Mesela futura ya da helvetica gibi. Aynı ailenin condensed (dikey) yada extended(yatay) üyelerini, light ya da black üyelerini kontrast/farklılık yaratmak için kullanabilirsiniz. Bazen sadece artistik olarak nitelendirdiğim metin için farklı bir font, geri kalan her şey için de farklı bir font kullanabilirsiniz. Ama aynı tasarımda bence 3’ten fazla font kullanmaya başlamışsak genellikle profesyonel görünümden uzaklaşmış oluruz. Örneğin astv’nin kurumsal kimliğini değiştirirken tüm işi helvetica’ya dayadım. Logo’nun kendisi helvetica extended zaten. Geri kalan yerlerde de bir metin varsa bu helvetica’nın farklı türleri. Uzun yazıları roman, başlıkları yer kısa ise condensed, geniş ise extended, yüksek dikkat çekek istediğim yerlerde black, zarif görünmesini istediğim yerlerde light…

Aşağıdaki örnekleri inceleyelim.

Bu tasarımda elimizde güzel bir resim var ama dandik font seçimleri, fazla font kullanımı, gereksiz ortalama gibi sebeplerden dolayı tasarım hatalı bir duruma düşmüş. Tüm fontları aynı aileden seçerek (Helvetica) ve hizalama yaparak işe biraz daha profesyonel bir görünüm kazandıralım. En alttaki script font seçimi zaten manyakça. En ufak bir okunurluk yok orada. O kısımda da okunaklı bir font seçelim. Bu font artık tasarımımızın başka bir kısmı olduğu için helvetica’dan devam etmemize gerek yok. Okuması kolay serifli bir font da oraya veriyoruz.

Başlıkta condensed bir font ve tamamen küçük harf kullanılmış (helvetica neue thin condensed 37) . Hemen altında alt başlık daha yatay (helvetica neue bold extended 73). Dikkat edin, bu fontlardan biri condensed diğeri extended ve tatlı bir dinamizm yaratıyorlar. Altındaki okunacak olan kısım da ise 9 punto ile roman tip bir kullanım var (helvetica neue medium 65). Aynı aile fontlarını kullandığım için fontlar arasında bir çakışma yok. Metin adamın bakış hizasında ve odağı kendisine çekiyor. Okunacak kısım extended yada condensed olmadığı için okuması kolay. Sadece burada sağa metni sağa yaslamış olmam okuma zorluğu yaratabilir ama yine de çok uzun olmadığı için çok fazla da sorun çıkarmıyor. En alt kısımda da her hangi bir okuma sorunu yok. Siyah bar biraz daha genişletilip firma bilgileri daha farklı yapılabilirdi ama uğraşmaya üşendim. 1 imaj, bir başlık ve kısa bir metin ve alt kısım… Görüldüğü üzere atla deve değil. Tek dikkat edilen, metnin hizalanması ve birbiri ile uyumlu, aynı aileden seçilen fontların kullanılması. Bu ikinci tasarım süper oldu be falan demiyorum asla. Sadece tek göstermek istediğim, font seçimi ve hizalamaları doğru kullanırsak 1-2 hamle de daha profesyonel görünen bir tasarımın ortaya çıkacağı.

Peki hangi tür tasarım için hangi fontu seçmeliyiz? Bu konuda kesin kurallar koymak imkansız ama yine de fontların uyandırdığı hislere dikkat etmemiz gerek. Bunlar bizim farkında olmadan yıllardır görsel olarak tutulduğumuz bombardıman altında, bilinçaltımızda oluşan eşleşmeler. Aşağıda bazı örnekler var.

Bunları da ezbere bilmemiz gerekmiyor. İnterwebler milyon tasarımcının işleri ile dolu. Tek yapmanız gereken istediğiniz tarzda bir site bulup nasıl bir font kullandıklarına bakmak. O fontu nasıl bulabileceğimizi birazdan anlatacağım. Diğer bir yöntem dafont.com gibi bir siteye gidip, fontlar arasında gezinmek. Ayrıca bir ton font ve tipografi bloglarına gidip, best 20 commercial fonts falan gibi şeyleri de okuyup bu fontları indirebilirsiniz. Son olarak son bir ipucu daha vereyim. Fontların normal kern’leri (harfler arasındaki uzaklık. Default olarak sıfırdır.) genelde çok açıktır. Bu kern’i -1 yaparsak (bazı fontlarda daha da kısabiliriz) genellikle hoş bir etki bırakır. Son olarak çeşitli Türk forumlarında gördüğüm “klavyene sağlık dostum” lafına değineyim. Bu nasıl bir laftır lan? Beşyüz açıdan eleştiririm olm ben bu lafı ve sarfedicisini. Klavyene sağlık dendi mi o klavyeye battalgazi’nin oğlu seyit battal gibi dalasım geliyor valla.

Bazı güzel font blogları

http://ilovetypography.com/
http://typographica.org/
http://fontstruct.fontshop.com/ (Kendi fontunu online yap)
http://www.typeforyou.org/

not: istenen fontun bir resmi varsa elimizde ve fontun ne olduğunu bilmiyorsak http://new.myfonts.com/WhatTheFont/ adresine gidip o resmi upload ediyoruz, site bize bazı sorular soruyor, onları yanıtlayarak o fontun, ya da ona çok benzeyen bir fontun adını öğreniyoruz. Sonra www.fontyukle.com ’a bi bakıyoruz.

Reklamlar

Etiketler:

About cenkozmercan

I do the things that I like to do and if 1 is good, 10 is a whole lot better.

9 responses to “Font olayı”

  1. batu says :

    yine ben cenk harbiden özledim
    görüşelim fon mont anlamam ben anorak

  2. evronas says :

    olm sunny philly yuzunden basim belaya girdi zaten. en son blogspot o post’u sildi. amerigan artizler birligi sikayet edip duruyomus meger o postu. dediler uyarimiz olsun sana, bu postu ya degistir yeniden yayimla, ya da sil. sonra yumusamislar ama.. hodja sana killik olsun istemeyiz, bir harf degistirsen bile tekrar yayinlayabilirsin ameriganlar ugrassin sen kasma kendini demisler.

    yine de sildimdi ben, geri kalan 400kusur diziye zeval gelmesin diye.

    batuyu aradim gecen. cimnastik salonunda bodi yapip duruyomus, baska da bi olayi yokmus. steroid de basıyomuş ayrıca, şişkinlik varmış.. bodi bitkisi vardı bi.

    • cenkozmercan says :

      batu & body = aynı cümlede. hahahahahahahahahha
      ayrıca gel wordpress’e özgür ol bebeim….bi gün fbı gelcek kapına haberin yok ho ho

      body bitkisi ellerinden öper

  3. Anonim says :

    Font olayını çözdüğümüz iyi oldu. Teşekkürler.

  4. Anonim says :

    ben hala çözemedim, meğersem çözemeyecek kadar kazmaymışım.

    • cenkozmercan says :

      En hiçbirşey seçemediğin anda helvetica’yı tavsiye ederim. Ya da son zamanlarda iyice moda olan dinpro (ya da türkiyede dinbek diye de bilinir – özellikle tümü büyük harf kullanımlarında çok güzel gözüküyor bence) aban.

      Her hangi kullandığın bir fontu tüm aile olarak kullanırsan (condensed, extended, roman, bold,italic vs.) ve başlık için daha kalın, uzun metin için roman olarak güzel bir bütünlük sağlarsın.

  5. Anonim says :

    Gerçekten çok başarılı bir paylaşım. Öğrenci topluluğundaki arkadaşlara görsel tasarım üzerine mini bir kurs veriyorum ve bu hafta yazı tiplerini anlatacaktım. Bu metin başlı başına yeterli giriş için…

Bir Cevap Yazın

Aşağıya bilgilerinizi girin veya oturum açmak için bir simgeye tıklayın:

WordPress.com Logosu

WordPress.com hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Twitter resmi

Twitter hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Facebook fotoğrafı

Facebook hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Google+ fotoğrafı

Google+ hesabınızı kullanarak yorum yapıyorsunuz. Çıkış  Yap / Değiştir )

Connecting to %s

%d blogcu bunu beğendi: