Web'de Yazınızı Nasıl Daha Çekici Yapabilirsiniz?
Günümüzün dünyasında bir tasarımcı için, özellikle de web üzerinde evrensel olarak bulunan başlık etiketlerinin ve web güvenli yazı tiplerinin her zaman çok uygun varsayılan ayarları ile, türün nasıl yerleştirildiğine az dikkat etmeleri alışılmadık bir şey değildir.
Etkileşimli tasarımcılar olarak, tipografiye geldiğinde biraz daha zaman alabiliyorsak, sonuçların “değirmencilikten kaçma” yaratımına karşı tasarımın benzersiz, iyi bir düşüncesini göstermesi daha doğru olacaktır.
Hayran olduğun tasarımcıların ve tasarımların çoğunun iyi tipografi örnekleri sergilediği iyi bir şans.
Times New Roman'da 13px setiyle birlikte 24px H1 etiketlerinin varsayılan senaryolarından daha cazip olması için, ayarlanan ayar türünde uyguladığım birkaç adımı göstereceğim.
Varsayılan ayarları halletmeyin, herkes bunu yapıyor.
Burada, takip etmek için bir parça vücut kopyasının yanı sıra bir istikametin genel görünümü var. Bu tam olarak seni çekmiyor ya da diğer tüm örneklerden ayrı olarak kendini gösteriyor, değil mi? Dolayısıyla, metin örneğini görsel olarak daha çekici hale getirmek için, önce yazı tipi seçimimizde birkaç değişiklik yapacağız.
Başlığınla daha fazla görsel ağırlığa sahip olacak bir yazı tipi seçin
Yazı tipi seçimi tam olarak “tipografi” olmamakla birlikte, aslında bir sayfadaki türün diğer öğelerden ayırt edilmesine yardımcı olmak için özlü bir bileşendir. Yazı tipi yüzünün başlangıcıyla, her yerde tasarımcılara büyük miktarlarda seçenekler sunulur.
Burada FontSquirrel.com gibi ücretsiz bir font sitesinde kolayca bulunabilecek bir Extra Condensed Gotik Stil yazı tipi kullandım. Bunu durup düşünürsek, “Yoğunlaştırılmış” adı bir anlam ifade etmelidir, çünkü aslında normal bir kitap tarzı aile üyesinden daha yoğundur, tam olarak bir başlığın dışında istediğimiz şeydir: Kullanıcıyı çeken bir şeydir. ve gerçekten kendini vücut kopyasından ayırır. Dikkatinizi orijinalden daha iyi tutmayı başarıyor ancak metni daha da geliştirmek için yapabileceğimiz birkaç şey var.
İki satır CSS ile daha çekici hale getirin
Anında değişiklik harflerde; Artık hepsi kapitalize edilmişler, ancak artık her harf arasında (gazete tasarımından aktarılan bir teknik) negatif karakterlere sahipler.
Bu özelliklerin ikisi de CSS, { text-transform: uppercase; ve harf aralığı: -Xpx; }. Bu iki satırı kodlama değerinde değişiklikler yaparak, özellikle orijinalin üzerinde görsel ağırlıkta büyük bir iyileşme sağlar.
Son ufak tefek işler yap
Bir sonraki adımda, vücut paragrafında kullanılan yazı, aslında başlık metnini daha iyi anlatan daha temiz bir sans-serif'e dönüştü. Çok daha görsel olarak çekici bir tasarıma yaklaşıyoruz, ancak daha fazla temizlemek için yapabileceğimiz birkaç değişiklik var.
Yeşil göstergelerin gösterdiği gibi, eşit olmayan marjlar ve tipografların “yetim” olarak adlandırmaktan hoşlandıkları şeyler vardır. Bu, paragrafın son satırına düşen tek bir kelimedir. Metnin geri kalanıyla karşılaştırıldığında görsel olarak çok eşit olmayan bir ağırlık oluşturur ve bu sorun metni yavaşça yeniden yazarak kolayca çözülebilir.
Marjlar söz konusu olduğunda, herkesin eşit olması gereken bir kural yoktur. Bununla birlikte, genç bir web tasarım kariyerine başlıyorsanız, dizinizdeki kuralların ötesine uzanmanıza ve hedefinizi görsel olarak gerçekleştirmenize olanak tanıyan teknikleri tecrübe edip öğrenene kadar, eşit miktarda kar marjına sahip olmak iyi bir uygulamadır.
Yetimizi kaldırarak ve kenar boşluklarını ayarlayarak daha dengeli bir görsel tuval oluşturduktan sonra, sonucunu görebileceğiniz, iyi yerleştirilmiş bir örnek örneği görebilirsiniz.
Web tipografi için en iyi ipuçlarınız neler? Yorumlarda bize bildirin!