Zayıf yazı tipi seçimi WordPress web tasarımınızı tehlikeye atıyor mu?
Bir Web Geliştirici Sözlüğü diye bir şey varsa, “Nerede Olduğunuzu lanetleyin” olarak tanımlanan tipografi kelimesini bulabilirsiniz. Gerçekten aptal görünüyor. Bir yazı tipi gibi küçük bir şey nasıl olabilir ve web tasarımında bu kadar çok kaosa neden olabilir? Web tasarımındaki diğer tüm şeyler gibi yazı tipi seçeneklerinin genel web sitesi alımı üzerinde önemli bir etkisi vardır. Ton. Denge. Akış. Bunlar, kötü bir yazı tipi seçmenin sadece birkaç yoludur, web siteniz üzerinde olumsuz bir etkiye sahip olabilir ve her şeyi dağınık hale getirir. WordPress temasının varsayılan yazı tipi seçimine güvenmekten bıktıysanız ve daha etkili tipografi ile tasarlamak istiyorsanız, bunu yapmanıza izin veren ipuçları ve araçlar üzerinde okuyun.
İyi tipografi örnekleri Gearoid.io’ya ait doğru yapılır.Web Design’da Fontları daha etkili bir şekilde kullanma kılavuzunuz neyin net olduğunu tartışarak başlayalım: orada çok fazla yazı tipi var. Varsayılan sistem yazı tiplerinden sadece birini kullanırsanız daha verimli olacak gibi görünüyor, değil mi? Kesinlikle daha kolay olsa da, büyük olasılıkla daha etkili olmayacak – ve nedenini açıklayacağım. Web sitesinde yazılan kelimeler şirketin veya kişinin sesidir (dijital).
Diğer insanların ve siteniz gibi görünen yazı tiplerine güvenmek, karışıklıklarda kaybolacaktır.
Varsayılan yazı tipini iki kez düşünmeden kullanın ve insanlar görecek.
Yanlış rengi seçin ve alakalı ve geniş fikirli mesajların okunması çok zor olabilir.
Eğlenceli, neşeli bir yaşam tarzı anlamına gelen bir yazı tipi seçin ve insanlar düğmenizi ciddiye alamayabilir.
Yaptığınız yazı tipi seçeneklerinde tehlikede olan birçok şey var. Ve filtrelenecek binlerce tipografik seçenek olduğundan, bunalmış hissetmesi kolay. Bununla birlikte, sizi ikna edeyim, web sitesi mesajınızı anlar almaz, seçimi daraltacak bir dizi önemli soruyu cevaplayabilirsiniz. Tipografi kullanarak web sitenizi şekillendirmeye ve güçlendirmeye başlamadan önce , bunun tüm sitelerde kullanmak için bir yazı tipi bulmakla ilgili olmadığını unutmayın. Aşağıdaki ipuçlarını ve araçları incelediğinizde, tüm web sitelerinizde kullanacağınız çeşitli metin türlerini ve hedefleri düşünün:
Kahramanların Resim Metni
başlıklar
Alt yazı
İç sayfalar için içerik metni
Fonksiyonel tipografi (CTA gibi)
Logo türü
navigasyon metni
Köprü metni
metin şekli
Gördüğünüz gibi, bir tipografide yaptığınız seçimin geniş bir etkisi vardır, bu nedenle bunu tek tek almak önemlidir. Hazır mısın?
Aşağıdaki ipuçlarının her birinin yazı tipi seçeneklerini daraltmak için ipuçları, daha iyi ve daha etkili bir tipografik seçim yapmak için size bir rehber verecektir. İpucu 1: Yazı tipinizi eşleştirme web sitenizde farklı bir yazı tipi kullanırken, yazı tipinin birlikte nasıl çalışacağını düşünün. Çok fazla kontrast işe yaramasa da, metin türü arasındaki farkı dikkat çekmek için oldukça çarpıcıdır. Dengeli bir yazı tipi eşleştirmeyi düşünün. Uyumlu olmalı, ancak uygun olmamalıdırlar. Çarpıcı, ama hayal kırıklığı değil. Bunlardan bazıları
İşte bazı yaygın kurulum önerileri:
Serif + sans serif
El Yazısı + Komut Dosyaları
İnce yazı tipi + ağır yazı tipi
Depoolf, tipografik ilham ve kaynaklar için harika bir kaynaktır. Divilo, yazı tipi kurulumu ve tasarım ilham kaynağı için kaynağımdır. Bu siteyi çevirerek saatler geçirebilirim! İpucu 2: Bu egzersizden geçtikten sonra aşırıya kaçmayın, web siteniz için iyi çalışacak 10 veya daha fazla yazı tipi tam bir listeniz olduğunu görebilirsiniz. Ancak, özellikle web tasarımında çok fazla şeyin kullanıcı deneyimi için kötü olabileceğini unutmayın. Ana yazı tiplerinizin seçimini minimumda tutun. İki veya üç farklı yazı tipini seçin, ardından Site çevresindeki farklı metin türlerinde varyasyonlar sağlamak için farklı stillere güvenin. İpucu 3: Yazı tipi seçimleri tarzınızı özelleştirin, önemli olmasına rağmen, bir web sitesi tasarlamada son yaptığınızdan biri olabilir. Sitenizin estetiğini renk, görüntüler ve beyaz alan yoluyla yaptıktan sonra, aynı stili yansıtan bir yazı tipi bulmalısınız. Bunu yapmaya alışık değilseniz, tüm marka seçimlerinizi tanımlayan kapsamlı bir sayfa tarzı kılavuz yapın. Bu, hikayeyi marka kişiliğiniz hakkında da tasarım seçeneklerinizden daha iyi görselleştirmenize yardımcı olacaktır.
WordPress.org, WordPress logosunun nasıl görüleceğini ve kullanılan renkleri ve yazı tiplerini ayarlayan bir stil kılavuzuna sahiptir.
İpucu 4: Sesinizi özelleştirin Stil ve ses tasarım açısından biraz farklıdır. Stil kapsamlı bir kimlikle ilgilidir. Bu nedenle hukuk bürosu, web sitelerinde sandalye yazı tipini kullanmaktan kaçınabilir. Ancak ses, mesajınızın tonu hakkında daha fazla bilgi. Sesiniz daha fazla uzatmadan düz bir ton iletiyor mu? Yoksa daha büyük ve daha cesur bir ifade için uygun mu? Her yazı tipinin varsayılan bir tonu vardır, bu nedenle mülkünüze uygun olduğundan emin olmanız gerekir. Boru 5: Minimalist ve paralaks stilleri sayesinde ana sayfa yazı tiplerinizi tedavi edin, ana sayfa artık büyük metin paragraflarından oluşmaz. Özlü. Cesur. İlginç. Ayrı ev sayfası logosu metni alışılmadık bir şekilde görüntüler.
Son zamanlarda ana sayfanın bir kopyasından hepimiz beklediğimiz şey budur. Ve bu nedenle, şimdi ana sayfanın metnini düzenleyerek daha fazla eğlenebiliriz. Bu, yukarıdaki ipuçlarının göz ardı edilmesi gerektiği anlamına gelmez, ancak bu, düz açık alanlara derinliği artıracak kadar güçlü olan daha büyük tipografi, şık tipografi ve tipografi kullanabileceğiniz anlamına gelir.
İpucu 6: Sadece okunabilirlik için değil, aynı zamanda bina hiyerarşisi açısından da önemli yazı tipi boyutunun önemli bir ölçüsünü yapın. Kabul edilebilecek en küçük yazı tipi boyutu için standart öneriler (genellikle içerik metninde bulunur) 16 pikseldir. Sıkı knning veya daha ince kuvvetli yazı tipleriniz varsa, daha büyük bir piksel ile başlamayı düşünün. Ardından, referans için temel boyutu kullanarak başlık türünün türünü güçlendirdiğinizden emin olun. Yazı tipi boyutunun her sayfadaki satırın uzunluğunu nasıl etkileyeceğini (okunabilirliği etkileyebilecek) hatırlamak da önemlidir. İdeal olarak, yazı tipi seçiminiz her satırda 45 ila 75 karakter üretmelidir. Pip 7: Yaratıcı olun, ancak çok yaratıcı olmayın Web tasarımı her zaman kontrol eğitimidir, değil mi? Kafanızda bir fikir var, onu koymak için biraz deli olursunuz (çünkü her şey çok havalı görünüyor!) Ve sonra kontrol etmeniz gerekiyor. Yazı tipleriyle aynı şeyi yapmanızı öneririm. İlk yazı tipi koleksiyonunuzu seçerken yaratıcı olmaktan çekinmeyin. Sonra, daraltmanın zamanı geldiğinde, muhafazakar ve yaratıcı iyi bir karışım bulun. Aşağıdaki ipuçlarının her birinin web tasarımında yazı tiplerini kullanmak için ipuçları, web siteniz tasarımında tipografi kullanmanın en iyi yolu hakkında bir rehber verecektir. İpucu 8: Duyarlı Tipografi Yapın Duyarlı tasarım açısından, hatırlamanız gereken tipografik ile ilgili bir dizi faktör vardır:
Minimum yazı tipi boyutu (16 pikselden az değil)
Kenning
Önde gelen
Sayfanın ve bölümün etrafında dolgu
Belirli alanlarda kullanılan yazı tipi sayısı
Belirli alanlarda kullanılan yazı tipi boyutlarının sayısı
“Duyarlı” yazı tipini bulmaya gerek yok. Önemli olan, trafik platformunun okunabilirliğini göz önünde bulundurarak web sitenizi tasarlamanızdır. CSS’nizi pürüzsüz tipografi veya duyarlı tipografik ayarlar için nasıl yöneteceğinizi öğrenmek istiyorsanız, Smashing Magazine’in denemeye değer birkaç öğreticisi vardır. Tasarımınızda hangi rengin kullanılacağına karar verirken, aşağıdaki şeyleri düşünün:
Yazı tipi rengi renk paletinize paralel olmalıdır.
Bu malzeme paletinin seçmenlerini görürseniz, önerilerinin her zaman metnin rengini içerdiğini göreceksiniz. Bu renkler okumayı kolaylaştırmak için her zaman siyah olacaktır.
Sitenizde renkleri sürekli olarak kullanın. Bir köprü açık mavi ise, her şey açık mavi olmalıdır. Bu, ziyaretçilerin görsel ipuçlarınızı daha kolay öğrenmelerine yardımcı olur.
Yazı tipleri arasında zıt renkleri kullanmaktan ve sitede kullanılan diğer renklerle kontrast kullanmaktan korkmayın. Bu, ziyaretçilerin dikkatini daha iyi çekmeye yardımcı olacaktır.
İlişkileri göstermek, hiyerarşi yapmak veya en önemli mesaja dikkat çekmek için renkleri kullanın.
Başlık metni için daha koyu ve daha cesur renkler kullanılmalıdır, çünkü renk doğal olarak dikkat çeker.
Daha hafif metin içerikte kullanılabilir, ancak bir arka planla okuyacak kadar ağır kalmalıdır.
“Meşgul” kısmı metnin etrafında olmasına rağmen, yoğun bir resmin üzerine metin yerleştirmekten kaçının. Okumanın daha küçük bir ekranda rahatsız edilmeyeceğinden emin olmadıkça, resimdeki metin tasarımından uzak durmak her zaman daha güvenli. En sevdiğiniz iki renk seçin ve malzeme paleti ana renklere ve metni eşleştirmek için tavsiye verir.
İpucu 10: Web’deki göz hareketleri ve okuma davranışı hakkındaki en son araştırmalara göre tarama ve okunabilirlik yeteneğini artırın, web sayfalarının sadece% 20’si okunur. Bu nedenle, ziyaretçilerinizin normal olmamasını ummak yerine, en kötü olasılık için hazır olun ve etiket başlığı ( Alt başlıklar için H2, H3, H4, vb.). Bu başlıkta daha cesur bir yazı tipi seçimi kullanarak, ziyaretçilerin okumak istedikleri kısma atlamalarını kolaylaştıracaksınız. Yazı tiplerini daha verimli bulmak ve kullanmak için kaynaklar şimdi, sizin için en uygun yazı tipi türü hakkında zaten iyi bir fikriniz olmalı. Bir sonraki adım yazı tipini tanımlamak ve ardından site tasarımınızda kullanmaktır. İşte başlamanıza yardımcı olacak bazı araçlar:
Kolay Google Font Eklentisi
Google şu anda kullanılabilecek 800’den fazla yazı tipine sahiptir. Web sitelerini ziyaret edebilmenize ve oradaki yazı tiplerini filtreleyebilmenize rağmen, bunun yerine kolay Google Fonts eklentisini kullanmanızı öneririm. Bu, web sitenizde gerçek zamanlı olarak farklı olan Google yazı tiplerini test etme ve tasarımınızın yanında görünümün bir resmini verme yeteneği sunacaktır. Kolay Google Fonts eklentisiyle ilgileniyor mu? Detaylar
Sincap
Web siteniz için doğru yazı tipini bulmak için zaman ayırmak istiyorsanız, sincap yazı tipi ile başlamanızı öneririm. Diğer birkaç ücretsiz yazı tipi olmayabilir, ancak teklifleri daha uzmanlaşmış gibi görünüyor. Yazı tiplerini tasarımcılar için en önemli türe (Serif vs. Sans Serif gibi) ayırırlar, bu nedenle yazı tiplerinizi daha verimli bulmak istiyorsanız buradan başlayın. Yazı tipi sincaplarıyla ilgileniyor musunuz?
Yazı tipi yapısı
Bazılarınız için, site yazı tipiniz için sahip olduğunuz vizyon, çevrimiçi olarak mevcut olanlarla eşleşmeyebilir. Belki de başkalarının sahip olmadığı özel yazı tipleri yapmayı tercih edersiniz. Öyleyse, ücretsiz bir fontstruct yazı tipi yapıcı kullanabilirsiniz. FontStruct ile ilgileniyor musunuz? Detaylar
Yazı tipi eşleştirme
İçinde havalı görünen metin içeren fotoğraflarınız veya resimleriniz olduğunu ve gerçekten hangi yazı tipinin kullanıldığını bilmek istiyorsunuz. Yazı tipini tanımlamanıza yardımcı olabilecek bazı tasarım yazılımları olmasına rağmen, yazı tipi eşleştirme aracını kullanın. Metin içeren resimleri yükleyin ve aracın sizin için en uygun yazı tipini bulmasına izin verin. Font eşleştiricilerle ilgileniyor musunuz? Detaylar
Yazı tiplerinin kombinasyonu
Canva’nın yaptığı her şeyin büyük bir hayranıyım. Tasarım araçlarının çoğu kullanılabilir ve tüm üslerinizi karşılamak için iyi işler yapmıştır. Yani, bu “kolay tipografi” yazı tipi çifti ile gelmeleri şaşırtıcı değil. Siteniz için iyi çalışan bir yazı tipi bulduysanız, ancak yanında ne ekleneceğinden emin değilseniz, bunu kullanmak iyidir. Bu, sadece yazı tipi uyumluluğunuzu kontrol etmek istiyorsanız da işe yarar. Yazı tiplerinin bir kombinasyonu ile ilgileniyor musunuz? Detaylar
Herhangi bir yazı tipi eklentisi kullanın
Yazı tipinizi seçtikten sonra, herhangi bir yazı tipi eklentisini kullanın, yazı tipini sisteme yüklemenize ve hemen kullanmaya başlamanıza yardımcı olur. Alternatif seçenek, CSS kullanarak WordPress sitenize yeni bir yazı tipi eklemektir. Hangi yazı tipi eklentilerini kullanmak ister misiniz? Detaylar
Sarma peki tüm bunlardan alınabilecek büyük bir ders nedir? Çevrimiçi olarak binlerce yazı tipi tarafından korkutulmaya gerek yok. En iyi uygulamayı ve doğru araçları kullanarak, mükemmel yazı tipini bulmanız ve ziyaretçilerinizi etkileyecek şekilde kullanmanız çok daha kolay olacaktır.
Size: Yeni yazı tipi seçiminin web sitenizi etkilediği zaman hakkında aşağıdaki yorumlarda bize söyleyin (negatif veya pozitif). Etiket:
tasarım
yazı tipi