Başlık yazmak için hangi orijinal yazı tipi kullanılacak. Yazı tiplerine farklı roller atayın. İyi tipografi önemlidir - ünlü mükemmeliyetçi Steve Jobs buna ikna olmuştur.

  • 29.04.2019

Yazardan: tipografik işaretleme geniş bir alandır. İnsanlar hayatlarının yıllarını bu eski zanaata adar ve her zaman öğrenecek yeni bir şeyler vardır. Bu yazıda, siteniz için bir yazı tipi ve yazı tipi (bir veya daha fazla yazı tipi kümesi) seçerken göz önünde bulundurulması gereken ana noktalara genel bir bakış sunacağım. Sonra gibi sorular "Hangi yazı tipini seçmeliyim?" kendi kendine yok olacaksın.

Pratik tipografik işaretleme

Web için tasarım yaparken içeriğin değişeceğini hesaba katmanız gerekir. Büyük bir web sitesinin her başlığının karakter aralığına (harfler arasındaki boşlukları ayarlamak) zaman harcamak söz konusu bile değildir. Başka bir deyişle, kontrolü bırakıyorsunuz.

Bugün odaklanacağım pratik işaretleme... benim için bunu anlamak demek tam denetim web sitelerinizi yazarak asla elde edemezsiniz. Bir yazı tipi seçmek, boyut sorununa karar vermek - bunların hepsi tasarımcılar olarak etkileyebileceğimiz şeylerdir. Pratik işaretleme, kontrol ettiğiniz şeyi nasıl ve daha da önemlisi neden temizleyeceğiniz anlamına gelir. Hadi başlayalım.

Bir yazı tipi seçerken okunabilirlik

Bir web sitesi için yazı tipi seçmeden önce bazı soruları yanıtlamalısınız. Yazılanları ne yapıyorsun? Okuyorsun! Neden bu kadar çok web sitesi bu görevi bu kadar karmaşık hale getiriyor? İster küçük yazı tipi boyutları, ister gelişigüzel satır yükseklikleri, hatta düz çirkin yazı tipleri olsun - görünüşe göre pek çok site, içeriklerini düzgün bir şekilde okuyabilmenizi istemiyor!

Yazdıklarınızı okunabilir hale getirerek rakiplerinizin en az yarısını anında geride bırakacaksınız, bu gerçekten harika çünkü o kadar da zor değil!

Modern eğilimler ve web geliştirme yaklaşımları

Site oluşturmada hızlı büyüme algoritmasını sıfırdan öğrenin

Bir yazı tipi nasıl seçilir?

Web sitenizde hangi yazı tipini kullanacağınıza karar verirken şunları hatırlamanız önemlidir: çok akıllı olma... Helvetica'nın yaygın kullanımı nedeniyle kaç tasarımcının kullanmaktan hoşlanmadığını biliyorum. Katılıyorum, ancak bu ifade önemli verileri bir kenara bırakıyor: neden. İnsanlar Helvetica'yı çok sık kullanıyor çünkü çok iyi... Akla gelebilecek her tasarıma mükemmel uyum sağlar, hem küçük hem de büyük boyutlarda iyi çalışır.

Bunun gibi kötü bir yazı tipi yüklemek inançlarınıza aykırı olabilir, ancak işe yararsa işe koyulun.

Gövde kopyası muhtemelen tasarımın en okunaklı olması gereken kısmıdır, bu nedenle küçük boyutlarda iyi çalışan bir yazı tipi seçtiğinizden emin olun. Bununla ne demek istiyorum? Gövde metnini 10 piksele ayarlayabiliyorsanız ve hala ne hakkında yazıldığını ayırt edebiliyorsanız, bu, yazı tipinin okunabilirliğinin harika bir göstergesidir.

Bu, gövde kopyası için, peki ya başlıklar, onlar için hangi yazı tipini seçmelisiniz?

Büyük başlıkların okunabilirliğini hesaplamak, gövde metninin okunabilirliğini hesaplamaktan çok daha kolaydır. Orada ne yazıldığını hemen ayırt edebiliyorsanız, başlık yeterince okunabilir.

İyi haber şu ki, yeterince proje üzerinde çalıştıktan sonra, hangi yazı tiplerinin işe yarayıp hangilerinin yaramadığı konusunda harika bir fikriniz oluyor. O andan itibaren, hangi yazı tiplerini seçeceğinize daha iyi karar verebileceksiniz.

Web siteniz için doğru yazı tiplerini seçmenin bir formülü yoktur. Sıklıkla En iyi yol Hangisini durduracağınıza karar vermek, çalışması gerektiğini düşündüğünüz her birini denemek ve ardından karşılaştırmaktır. Yazı tipi seçimi aslında içgüdüseldir, ancak kullanıcının burada ne tür bir yazı tipi kullanıldığını düşünmeyeceği zamanın %90'ını hatırlamak önemlidir, bu nedenle okunabilirse, yeterince iyidir.

çift ​​seçimi

Çok nadiren (eğer varsa) sitede kullanıma uygun olduğu bir durum vardır. sadece bir kulaklık. Ortalama bir web sitesi çok fazla metin kullanır. Hepsi için tek bir kulaklığın işe yaraması mümkün değil! İyi tasarlanmış web sitelerinin büyük çoğunluğu iki tane kullanır: biri gövde metni ve diğeri başlıklar için.

Bir çift yazı tipi seçerken, birlikte nasıl görüneceklerini düşünmek önemlidir. "Yeterince benzerler mi?" "Çok mu benzer?" "Yeterince farklı değil mi?" Bütün bu soruları kendinize sormalısınız. Benim düşünceme göre, birlikte iyi çalışan bir çift yazı tipi bulmanın en iyi yolu, birçoğunu yan yana koymak ve hangisinin en iyi olduğuna karar vermektir. Denemeden öğrenemezsiniz.

Bazen iki sans-serif en uygunudur, diğer zamanlarda başlıklar için sans ve gövde kopyası için serif gerekir. Birbirlerine benzemeleri gerçekten önemli değil, önemli benzer davranmak... Bu, elbette, proje tasarımınızın geri kalanına bağlıdır. Hangi yazı tipini seçerseniz seçin, mesajınızı doğru bir şekilde iletmelidir ve bu, zıt yazı tipleri anlamına geliyorsa, iyi çalışmaya devam edin.

Kesinlikle tipografik olmasa da, renk her tür web sitesi için çok önemli bir detaydır. hakkında konuşmuyorum renk şemaları , ancak sitenin okunabilirliğini sağlamak için gereken kontrast hakkında daha fazla bilgi. Beyaz (veya açık) bir arka plan üzerindeki siyah metin, metin için en okunabilir renk olarak kabul edilir.

Gidip her şeyi beyaz üzerine siyah yapın demiyorum, sadece tasarım yaparken metninizin kontrastının farkında olmalısınız. Dikkatli olmazsanız size daha sonra cevap verebilir.

Benim düşünceme göre, bir ızgara kullanımı, Web'deki metnin pratik olarak işaretlenmesi için en önemli fikirdir. Harika yazı tiplerine, dolgulara ve renklere sahip olabilirsiniz, ancak iyi bir işaretleme eksikse, komik sans'ı da kullanabilirsiniz.

Metinlerle tasarımlar oluştururken ızgara kullanmak, projeniz için net bir denge ve geometrik yapı sağlar. Bu, kötü tasarım için sihirli bir düzeltme değildir, ancak baştan bir ızgara projesi oluşturursanız, en azından işaretlemenizin sağlam olacağından emin olabilirsiniz.

Peki ızgara tipografik düzenlerde nasıl bir rol oynuyor? Sadece şunu söyleyeceğim: Genel... Izgara, tipografik düzenin tüm temel ideallerini bünyesinde barındırır. Geometriktir, sabittir, kullanımı kolaydır ve ayrıca: güzel.

Metni bir ızgaraya hizalama - anahtar yöntem görsel hiyerarşi oluşturmak ve metninizin ne kadar büyük (veya küçük) olması gerektiğine dair harika bir gösterge.

Vurgulama

Daha önce de söylediğim gibi, eğer tipografik düzeniniz okunabilirse, o zaman zaten rekabeti %50 oranında geride bırakıyorsunuz, peki ya diğer yarısı? Buraya kadar geldiyseniz, o zaman birlikte net, tutarlı okunabilirlik kuralları bırakacağız ve benzersizliğin karanlık ve mistik dünyasına gireceğiz.

Web sitenizin öne çıkmasını mı istiyorsunuz? Adım 1. Benzersiz tipografik işaretleme uygulayın. Muhtemelen sizin için bu, benzersiz yazı tiplerini kullanmak anlamına gelir. Ama yazı tipini benzersiz yapan nedir? Bence bu çok sık kullanılmayan bir yazı tipi değil, diğer yazı tiplerinde olmayan bir mesaj veya duygu içeren bir yazı tipi.

Benzersiz Bir Yazı Tipi Seçme - Bölge duyumlar. hisler Bu yazı tipi farklı mı? Yoksa sadece farklı mı görünüyor? Herhangi bir proje için yazı tipi seçerken, tasarım hissini her zaman hesaba katmalısınız. Bu tamamen kişisel bir görüş olduğundan, benzersiz bir kulaklık bulmanıza yardımcı olamam. Sadece yazı tipi örneklerini gösterebilirim.

Tasarım Kabini çok benzersiz bir logo ve tasarıma sahiptir. Güçlü ama havalı, göz alıcı ama zarif. Bu projeye baktığımda, bu sitenin yüksek sınıfını hissediyorum. Bana "Ben ne yaptığımı biliyorum" diyor.

sıradışı olun

Tam boyutlu bir logoya sahip kaç web sitesi tanıyorsunuz? Ultra ince bir başlığa ne dersiniz? Son noktamdan farklı olarak, önemsiz olmak, başkalarının ne yaptığına bakmak ve sonra tam tersini yapmak anlamına gelir.

Savvy Belfast'taki adamlar zeki. Çoğu web sitesinin ne kadar sıkışık göründüğünü fark ettiler ve tüm anlamsız metinleri tek bir cümleyle değiştirmeye karar verdiler.

Bir an için sitelerine tek bir bakışla bile adlarını hatırlamadan edemiyorsunuz.

Tasarımınızı hizalayın

Tipografik işaretleme kendi başına bir şey değildir. Diğerleri gibi web tasarımının bir parçasıdır. Metin önemlidir, evet, ancak projenizi harika yapan şeyin sadece bir parçası olduğunu unutmamalısınız. Metni, tasarımın geri kalanını göz önünde bulundurarak oluşturmalısınız.

Karmaşık bir arka plan dokunuz varsa, o zaman belki iyi bir serif başlıklarınıza uyacaktır.

Buradaki bakış açım basit: şunu unutma bağlam... Tasarım alanı çok büyük ve bugün sadece bir bölümünden bahsediyorum. Başarılı bir web tasarımı oluşturmak için tüm parçaların başarılı bir şekilde harmanlanması gerekir. İşte amaç: Birisinin sitenizden alacağı bir izlenim yaratmak. Bu ile yapılamaz yalnız metin, veya sadece bir renk, hatta hakkında sadece diğer içerik!

Pek çok deneyim nasıl hissettiğinize göre belirlenir: mutlu, üzgün, şaşırmış, kızgın, falan filan. İnsanoğlunun çok çeşitli duyguları vardır ve tasarımlarımızla bu duyguları uyandırmak tasarımcılar olarak bizim görevimizdir.

Bugün bahsettiğim tüm şeyler arasında, bu açık ara en soyut olanı ve açıklaması biraz zor. Bunun yerine, size göstermeme izin verin.

Solid Giant'ı ilk kez ziyaret ettiğimde gülümsedim. Onu bir sonraki görüşümde ve hatta bir sonrakinde gülümsedim. Aniden bu projeyle bir yakınlık hissettim. Bu büyük, kabarık "G" unutulmayacak kadar sevimli!

Dürüst olmak gerekirse, bence harika.

duygusal tasarımÖğretmek imkansız, bu deneyimlenmesi ve ardından kendi projelerinizde oynanması gereken bir şey.

Site için bir yazı tipinin nasıl seçileceğine ilişkin dersin sonucu

İşte buradasınız ve yazının sonuna geldiniz. Umarım en azından bir şeyler öğrenmişsindir, eğer değilse de çok iyi. Okuduktan sonra biraz düşünmenizi istersem, o zaman şudur: Okunabilir olun, gerisi gelecektir. Üstelik artık web siteniz için hangi yazı tipini seçeceğiniz konusunda bir sorunuz yok.

Tipografik site düzeniyle ilgili en önemli şeyin ne olduğunu düşünüyorsunuz? Görüşlerinizi yorumlarda bırakın!

Bir internet pazarlamacısı olarak, dönüşümün sizi beslediğini bilirsiniz. Dönüşüm arayışında açılış sayfalarını optimize etmenin çok zaman ve çaba gerektirdiğini düşünüyorum. Ama dönüşüm meselelerinde, sadece grafik dizayn ve iyi yazılmış metin bir rol oynar.

Bugün size tipografiden, doğru yazı tiplerinin nasıl seçileceğinden ve yazı tiplerini seçmenin satışlarda size en az iyi bir metin yazarı veya profesyonel tasarımcı kadar yardımcı olabileceğinden bahsetmeyi öneriyorum. Metinleriniz iyi yazılmışsa, site modern görünüyor, ancak istenen dönüşüm oranı henüz elde edilmediyse bu makaleyi okuyun.

Tipografi nedir?

Basit bir ifadeyle, tipografi sıradan metnin sanatla kesişimini sembolize eder. Seri baskı için bir dizgi yazı tipinin icat edildiği 15. yüzyılda bir yerde ortaya çıktı. O zaman insanlar basılı metne kişisel stil ve "el yazısı" eklemeyi denemeye başladılar.

Bugün, sitenizi ziyaret edenler mal ve hizmet siparişi vermek için bir açılış sayfası veya bir bölüm açtığında, yalnızca bilgileri okumakla kalmaz, aynı zamanda harflerin şekline ve boyutuna, satırların uzunluğuna ve paragraflara görsel olarak bölünmesine de dikkat ederler. Site sayfasındaki sorunlarına çözüm arayışı, aynı kişilerin algı düzleminde yatmaktadır. Bu durumda, kararlar birkaç saniye içinde verilir.

Tipografinin nasıl çalıştığını ve nasıl doğru kullanılacağını anlamak, bilgilerinizi nasıl sunacağınız konusunda ipuçları sağlayacaktır. hedef kitle sizin için faydalı olan bir karara varmak istediğiniz

Tipografinin temel bileşenleri

Bir yazı tipinin seçimi ve kullanımı, çeşitli faktörlerin ve öğelerin birleşimine bağlıdır:

  • Yüz tipi - bu özelliğe yanlışlıkla "yazı tipi" diyoruz, ancak yüz, ortak bir tasarımla birleştirilen sembol, harf ve sayı gruplarını ifade eder. Örneğin, yazı tipi Garamond, Times, Arial'dir; onları yanlışlıkla "yazı tipi" olarak adlandırırız.
  • Yazı tipi, harflerin belirli bir boyutu, uzunluğu, genişliği ve ağırlığıdır. Pratikte şöyle görünür: Georgia yazı tipidir ve 9pt Georgia Bold yazı tipidir.
  • Çizgilerin uzunluğu, sol ve sağ uç alanlar arasındaki mesafeyi ve bu segmente uyan karakter ve kelime sayısını gösteren bir özelliktir.
  • Çizgiler arasındaki mesafe - harflerin yerleştirildiği ana çizgiler arasındaki boşluk, nokta sayısıyla ifade edilir.
  • Karakter Aralığı - Tek tek karakterler veya harfler arasındaki boşlukları belirtir. Çoğu yazı tipi için, seçilen stil ve boyutun doğal ve göze hoş görünmesi için karakter aralığı otomatik olarak ayarlanır.
  • Boşluklar ve karakter yoğunluğu - metindeki kelimelere ve satırlara karakterlerin yerleştirilmesinin yoğunluğundan ve tekdüzeliğinden sorumludur.

Tipografi neden bu kadar önemli?

Kelimelerdeki tek tek harfler birbirine çok yakın, yazı tipi boyutu çok küçük veya kelimeler çok yoğun olduğu için metninizi okuyucunun okuması zorsa, site ziyaretçilerinizin iki olası davranışı vardır.

Ya sitenizden ayrılacaklar, bu da dönüşümde bir düşüşe yol açacak ya da metni ayrıştırmaya çalışacaklar, ancak bu oldukça sıkıcı bir iş olacağı için yarısına bile ulaşamayacaklar. Sonuç olarak, site ziyaretçisi bu metnin içerdiği ana mesajdan çok metinle mücadeleyi hatırlayacaktır.

Tipografi, bilgiyi anlamak ve kavramak için kritik öneme sahiptir. Doğru yazı tipi, yazı tipi, karakter aralığı ve diğer tipografi bileşenleriyle mesajınızı alıcıya hızlı ve kolay bir şekilde iletebilirsiniz.

İnsanların İnternetteki metinleri nasıl okuduklarıyla ilgileniyorsanız, okuyucunun davranış kalıbının oldukça açık olduğunu göreceksiniz. Bu şablon değişebilir, ancak yalnızca metne farklı görsel hiyerarşiler uygulayarak. Uygun yazı tipleri seçilerek düzenlenebilen bu hiyerarşi ve yapıdır. Stile ek olarak, kullanabilirsiniz madde işaretli listeler ve diğer görsel farklılaştırma yöntemleri.

Metni yapılandırmada mükemmelliği elde etmek için, öncelikle, örneğin Gestalt'ın Algı İlkeleri gibi, okumaya değer olan bilgileri nasıl düzenleyeceğinizi anlamalısınız.

İnsanlar genellikle her şeyi organize etmeyi severler. Bu alışkanlık kök saldı insan doğası... Gestalt algı teorisine göre, görsel öğelerin gruplar halinde düzenlenmesi aşağıdaki beş bağlamsal faktöre dayanmaktadır:

  • benzerlik (harici olarak benzer nesneler - boyut, şekil, renk - birlikte algılanır);
  • bitişiklik (uzaydaki nesnelerin yakınlığı ve bir olay diğerine neden gibi göründüğünde birinden diğerine görsel geçiş);
  • kapalılık (birkaç nesne birlikte tam bir şekil oluşturur);
  • yakınlık (yakında bulunan nesneler birlikte algılanır);
  • şekil ve etrafındaki boşluk (figürün etrafındaki boşluk onun arka planı olarak algılandığında).

Metinlerinizle ilgili olarak benzerlik ve görsel tekdüzelik ilkelerini kullanarak, tüm metni görsel olarak aynı hale getirebilir, ancak aynı zamanda yazı tipi ve stilde, örneğin bir harekete geçirici mesaj gibi vurgulayabilirsiniz.

Sonunda, metinle çalışmak, bilgilerinizin algılanmasının kolay olduğu gerçeğine yol açmalıdır. Bu nedenle, metnin bölümlerinin tek bir bütün halinde birleştirilmesi gerekir, ancak aynı zamanda ana şeyi bir bakışta vurgulayın.

Araştırma ne diyor?

Temmuz 2012'de Yeni York Times, "İyimser misiniz yoksa kötümser misiniz?" adlı bir deney yaptı. Okuyuculara Sonsuzluğun Başlangıcı kitabından bir paragraf ve ardından evet veya hayır yanıtlarını ima eden iki soru sunuldu. İlginç bir şekilde, yanıtların kendileri, seçilen yazı tipi stiline ve belirli bir yazı tipinin taşıdığı duygusal arka plana insanların tepkileri kadar araştırmacıları ilgilendirmedi. Bir yazı tipi bir metnin inanılırlığını etkileyebilir mi? Deneyin yazarlarının bilmek istediği şey buydu.

40 bin katılımcının tamamı aynı paragrafı altı farklı ağırlıkta gördü: Baskerville, Helvetica, Comic Sans Yaklaşık. ed.), Bilgisayar Modern, Georgia, Trebuchet.

Sonuç olarak, aşağıdakiler netleşti. Comic Sans'ta yazılan ifadeler ve sorular en tartışmalı olanlardı. Helvetica da çok geride değil: Bu yazı tipinde yazılan ifadeler de anket katılımcılarını özellikle ikna etmedi. Ancak en büyük anlaşma ve güven, Baskerville tarzında yazılmış ifadelerden kaynaklandı.

İnternet pazarlamacıları için bir ders

Psikoloğa göre Baskerville yazı tipinin galip gelmesinin nedeni budur: görünüşte daha resmi ve güvenilirdir.

Şimdi ürünlerinizi satan sayfanıza bakın. Seçtiğiniz yazı tipi gerçek niyetinizi ve hedef kitlenize iletmek istediğiniz mesajı yansıtıyor mu?

Nişinizi düşünün. Kitlenizin doğru yazı tipiyle şekillendirilebilecek belirli bir ton veya ruh haline mi ihtiyacı var?

Boyut önemli mi?

Ayrıca Usability News'de yazı tipi boyutuyla ilgili ilginç bir deney yapıldı. Bu çalışma İnternetteki sekiz popüler yazı tipini karşılaştırdı: Courier New, Georgia, Arial, Century Schoolbook, Times New Roman, Comic Sans, Tahoma, Verdana. Aynı zamanda 10, 12, 14 puntoluk fontlar demonte edildi. Çalışma 60 katılımcıyı içeriyordu.

İşte ortaya çıkan şey: Verdana, Arial, Comic Sans en iyi 10, 12 ve 14 punto yazı tipi boyutlarında okundu.

İnsanların Times New Roman ve Arial'de yazılan metinleri en hızlı okuma şekli.

Ayrıca Arial ve Courier etkilendi en iyi yol Comic Sans tarafından yazılan metin güven uyandırmazken (en kötü sonucu gösterdi). Diğerlerinin yanı sıra en yüksek olumlu algı düzeyine Tahoma 10 pt, Courier 12 pt ve Arial 14 pt yazı tipleri neden olmuştur.

Serif ve Sans Serif hakkında tartışma

Bu çok net sonuçlara rağmen hangisi daha iyi kullanılır sorusuna net bir cevap bulunamadı: Serif (serif türü) veya Sans Serif (serif yazı biçimi). Ancak ikincisini okurken okumak daha kolaydır, çünkü çok net ve kullanışlıdır. küçük boyutlu harfler ve semboller. Bu, insanların metnin şekli ve tarzından çok içeriğine odaklanabilecekleri anlamına gelir.

Yazı tipleri ruh halini ve bilişsel performansı nasıl etkiler?

Microsoft'tan Dr. Kevin Larson ve MIT'den Dr. Rosalind Picard tarafından yapılan bir başka çalışma (PDF), ruh hali ile bilişsel performans arasında bir ilişki buldu. Ölçümler üç aşamalı iki aşamada gerçekleştirilmiştir. farklı özellikler: karşılaştırmalı süre, Likert ölçeği ve tanıma görevleri.

Yirmi gönüllü, her grupta on olmak üzere iyi ve kötü tipografi aldı. Çalışmanın ilk bölümünde, genel olarak iyi bir düzen ve tipografi ile, insanların okuma zamanını gerçekte olduğundan daha az algılama eğiliminde oldukları bulundu: metnin tamamını okumaktan çok daha az zaman harcadıklarını hissettiler. Okumaya ara vermiş olsalar bile.

Buradaki açıklama oldukça basittir: İyi biçimlendirilmiş ve iyi tasarlanmış bir metin içeriğiyle (biçimiyle değil) o kadar büyüleyicidir ki okuyucu onu "yutmuş" gibi görünür.

Metinlerin etkinliğini Likert ölçeğiyle ölçmeye yönelik deneyler, yalnızca ikinci denemede iyi tipografinin avantajını ortaya çıkardı.

Bilişsel görevlerin gerçekleştirildiği üçüncü bölümde, deneklere mum ile bir görev ve çağrışım bulma testi verilmiştir. İlk görev, metnin kötü bir yazı tipiyle yazıldığı bir grupta tek bir kişi değil, iyi tipografiye sahip bir grupta dört kişi tarafından çözüldü. İkinci görev, tipografisi iyi olan gruptaki katılımcıların %52'si ve tipografisi zayıf olan gruptakilerin %48'i tarafından tamamlandı (iyi tipografiye sahip grup da testte meslektaşlarından biraz daha az zaman harcadı).

Sağlanan bilgilerin iyi bir ruh hali ve olumlu bir şekilde algılanması, özellikle seçilen yazı tipine bağlı değildir. Bunun için iyi bir yazı tipi seçilirse, sorunları çözmek veya belirli bilgileri elde etmek daha kolay ve erişilebilir hale gelir.

Dönüşümleri artırmak için doğru yazı tipi nasıl seçilir?

  • Dışavurumun faydaya zarar vermesine izin vermeyin. Mevcut birçok yazı tipinden birini seçerek Metin düzeltici ya da site kontrol paneli, bir pastaneye birdenbire giren bir çocuk gibi yetişkin olmadan hep aynı cazibeyle karşı karşıyayız. Ancak, en tuhaf veya en tuhaf yazı tiplerini hatırlamak önemlidir. Güzel tasarım- okunabilirlik ve rahatlık açısından en iyisinden uzak. Güzel bir yazı tipi, okunmasının kolay olduğu ve size kazandıracağı anlamına gelmez. iyi satışlar sitenizdeki ürünler veya bilgiler.

  • Seçtiğiniz tipografinin metni tamamlaması gerektiğini, şekliyle anlamını boğmaması gerektiğini unutmayın. Metni okuduktan sonra, insanlar yazı tipini değil, bu metinde yer alan harekete geçirici mesajı veya bilgi mesajını hatırlamalıdır.
  • Her zaman iki ilkeyi aklınızda bulundurun: aynı metindeki farklı yazı tiplerinin ilişkisi ve karşıtlığı. Bir metinde iki farklı yazı tipinin kombinasyonu, aralarında geçiş yaparken okuyucunun aniden metinden uzaklaştığını hissetmeyecek şekilde olmalıdır. Helvetica ve Arial gibi çiftleri düşünün. Ve karşıtlık, yazı tiplerinin farklı görünmesini sağlamalı, ancak aynı zamanda içlerinde en az bir ortak özelliği muhafaza etmelidir.
  • Başarının anahtarının basitlik olduğunu unutmayın. Metninizi en sevdiğiniz yazı tiplerinden oluşan bir sergiye dönüştürmeyin.
  • Mükemmel yazı tipini bulmak için projenizin ve hedef kitlesinin kapladığı alanı araştırın. Resmi, sade bir yazı tipine mi ihtiyacınız var? İhtiyacın var mı büyük baskı? Pazarı ve taleplerini, müşterilerinizi etiketleri ve metinleri daha dikkatli okumaya teşvik eden faktörleri inceleyin.
  • Güven veren, rahat görünen ve okunması kolay bir tipografi seçin. Harfler ve kelimeler arasındaki boşluklara da dikkat edin - bunlar oldukça geniş olmalıdır.
  • Kullanmayın büyük harfler her kelimenin başında. İnsanların internette okuduğu tüm metinlerin %90'ı küçük harflerle yazılır.
  • Satırın uzunluğu çok kısa olmamalıdır, böylece sürekli satırın başına atlamanız gerekmez - bu okuyucuyu yorar. Ve çok uzun olmamalı. (En uygun metin genişliği 600 piksel olarak kabul edilebilir. "Ağ yakalamak"ta bu genişlik ayarlanır. - Yaklaşık. ed.)
  • Sözcüklerin ve satırların yoğunluğu, kullanıcının tüm metnin bir yığın halinde yığılmış gibi hissetmeyeceği şekilde olmalıdır.

İyi tipografi çok önemlidir - ünlü mükemmeliyetçi Steve Jobs buna ikna olmuştu.

Yazı dahil her ayrıntıda fanatik olmaya alışmış birinin fikri olmadan tipografinin etrafından nasıl dolaşabilirsiniz?

2005 yılında Stanford Üniversitesi mezunları ve öğrencileriyle konuşan, kurucusu ve ardından Genel Müdür elma Steve JobsÜniversitede sıradan disiplinlerle pek ilgilenmediğini, ancak yazı tiplerini ve Serif ile Sans Serif'i birleştirmenin özelliklerini çalıştığı hat derslerine kaydolduğunu söyledi. Bunu sadece kendi zevki için yaptı - ve on yıl sonra devrimciler için yazı tipleri üzerinde çalışırken bunu hayal bile etmedi. Macintosh bilgisayar onun için yararlı olacak bu bilgi ve deneyimdir (bu arada, Steve Jobs'un çalışanını tek bir cümle için "Yazı tipi ana şey değil" kovduğu bir efsane var - Yaklaşık. ed.).

Özetliyor

İnternet pazarlamacılarının özenle seçilmiş tipografinin metninizi tamamlayabileceğini ve geliştirebileceğini hatırlamaları önemlidir. Doğru tasarım ve yazı tipi seçimi metni daha zengin ve daha iyi hale getirirken, okunması zor olan metin metin yazarlığı dehasını bile kurtarmaz.

Web siteleri, haber bültenleri ve yeni başlayanlar için doğru yazı tiplerini belirlemenin en iyi yolu hala geçerliliğini koruyor. zaten varsa Açılış sayfası sayesinde iyi dönüşüm oranları sağlayan doğru tasarım ve tipografi, gelecekte bu şablonu geliştirin ve dönüşüm oranınızı artırmak için tipografinizi geliştirin.

Bir tasarımcının öğrenebileceği en değerli becerilerden biri yazı tipi seçimidir. Bunun nedeni metnin tasarımcı ve kullanıcı arasındaki ana iletişim yollarından biri olmasıdır. Tipografi tasarım için çok önemlidir.

Tipografi karmaşık ve güzeldir. Bazıları tüm kariyerlerini onunla çalışmaya adar. Neyse ki bizim için deneyimlerini detaylandırıyorlar, bu yüzden emrimizde bir sürü çevrimiçi tipografi kaynağımız var.

Bu makale şu şekilde tasarlanmıştır: küçük tanıtım tasarım için doğru yazı tipini nasıl seçeceğini öğrenmek isteyenler için. Bilinen seçeneklerle sınırlı olmamak üzere, mizanpajlarda kullandığınız yazı tipi kümesini ve bunların kombinasyonlarını genişletmeniz için sizi dürtükleyecektir.

Hedefinizi tanımlayın

Her şeyden önce, tasarımınızın amacını tanımlayın. Hangi bilgileri iletmek istiyorsunuz? Ne formatı?

V iyi tasarımlar tipografi amaca uygun. Bu önemlidir, çünkü belirli bir ruh hali yaratmaya, tasarımın tonunu ve stilini belirlemeye yardımcı olan yazı tipleridir.

Yaparsan, söyle tebrik kartı ile birlikte büyük miktarçizimler, yapıldıkları stille birleştirilecek bir yazı tipi seçin. Yazı tipi tasarımın geri kalanıyla uyumlu olmalıdır.

Görsellere ağırlık veren bir web sitesi tasarlıyorsanız, kullanıcının dikkatini onlardan uzaklaştırmayacak basit bir yazı tipi seçin. İletmek istediğiniz mesajı vurgulamanın bir yolu olarak yazı tipini kullanın.

Kitlenizi tanımlayın

Tasarım hedefinize karar verdikten sonra, bunu hangi kitle için yapacağınıza karar verin. Kullanıcılar hakkındaki bilgiler (yaş, ilgi alanları, kültürel geçmiş) yazı tiplerini seçerken verdiğiniz kararları etkileyebileceğinden bu adım çok önemlidir.

Örneğin, bazı yazı tipleri daha genç yaş için daha uygundur. Okumayı yeni öğrenen çocuklar, net harf ana hatlarına sahip çok okunaklı yazı tiplerine ihtiyaç duyarlar. Bunun iyi bir örneği Sassoon İlköğretim Okulu'dur. Sassoon Primary, Rosemary Sassoon'un, çocukların okuması en kolay olan yazı tiplerini araştırmasına dayanan bir projesidir.

Diğer yazı tipleri yaşlı insanlar için daha uygundur. Kural olarak, harflerin büyüklüğü, belirgin kontrast, yazı eksikliği ve dekoratif unsurlar ile ayırt edilirler.

Bir yazı tipi seçerken hedef kitlenizin özelliklerini ve ihtiyaçlarını göz önünde bulundurun. Basitçe söylemek gerekirse, kendinizi onların yerine koyun.

İlham arayın

Diğer tasarımcıların çalışmalarına göz atın. Bu yazı tiplerini kullanmaya karar verirken onları neyin yönlendirdiğini anlamaya çalışın.

İlham: yazı tipleri

Yeni yazı tipi fikirleri için, sizi istediğiniz havaya sokmak için harika bir kaynak olan CreativeBloq'un En İyi 100 Ücretsiz Yazı Tipine göz atın. CreativeBloq yazılarında yazı tiplerinin her birini seçerken izledikleri mantığı açıklıyor.

Ayrıca Invision tipografi kaynakları ile bir bütün oluşturmuştur. Orada ilham almak için tonlarca kaynak bulacaksınız.

Gerçek web sayfalarından biraz ilham almak istiyorsanız Typ.io'ya göz atmanızı tavsiye ederim. Site, Web'in her yerinden ilginç çözümler içeren bir kaynak koleksiyonu içerir. Ayrıca, her örnek için site, metnin altında CSS yazı tipi parametrelerini görüntüler.

Özel sitelere ek olarak, favori sayfalarınızı ziyaret edebilir ve orada ne kullandıklarını görebilirsiniz. Burası, farenizi metnin üzerine getirdiğinizde yazı tipi bilgilerini görüntüleyen bir Chrome uzantısı olan WhatTheFont aracının kullanışlı olduğu yerdir.

İlham: kombinasyonlar

Yazı tiplerinin kendilerine ek olarak, çalışma farklı varyantlar bunların kombinasyonları eşit derecede önemlidir. Doğru kombinasyonlar görsel hiyerarşiyi oluşturmaya yardımcı olur ve tasarımın anlaşılmasını kolaylaştırır.

Ziyaret etmeye değer ilk ilham kaynağı Typewolf. Typewolf, farklı sitelerden ilginç kombinasyon örnekleri içerir. Ayrıca yazı tipi yönergeleri ve ayrıntılı tipografi kılavuzları da sunarlar. Yazı tipleriyle çalışanlar için bu gerçek bir hazinedir.

FontPair, özellikle Google Fonts ile çalışmak için tasarlanmış en iyi eşleşmelerin nasıl seçileceğine ilişkin başka bir kaynaktır. Kaynak, stil kombinasyonlarına göre sıralama yeteneği sağlar (örneğin, sans-serif ve serif veya serif ve serif).

Son olarak, web, profesyonel tasarımcıların hazır kitleriyle doludur. Tipografi: Google Yazı Tipleri Kombinasyonları veya Tipografi: Google Yazı Tipleri Kombinasyonları Cilt 2 diyelim. Behance, Dribble ve diğer benzer sitelerde "yazı tipi eşleştirme" yazmanız yeterlidir.

Bir yazı tipi seçin

Artık teorik olarak temellendiğinize ve ilham kaynağınız olduğuna göre, seçim yapmaya başlayabilirsiniz. Seçim sürecinde üç ilkeyi hatırlayın: okunabilirlik, okunabilirlik, amaç.

Klasik ve okunması kolay yazı tiplerini seçin. Fantezi yazı tiplerini basit ve pratik olanlar lehine hendekleyin. Ve şu veya bu yazı tipinin amacını dikkate alın: örneğin bazıları başlıklar için gövde metninden daha uygundur.

Buna göre bir yazı tipi seçmeden önce hangi amaçla kullanacağınızı göz önünde bulundurun.

Yazı tipi kombinasyonları söz konusu olduğunda, onları çok karmaşık hale getirmeyin - kendinizi üç ile sınırlayın. farklı şekiller, daha fazla değil. Ayrıca, zıt yazı tiplerini seçin. Bu, kullanıcının bakışını yönlendirmeye yardımcı olacaktır: önce başlığa, sonra gövde metnine. kullanarak görsel kontrast da oluşturabilirsiniz. farklı boyutlar, renkler ve stiller.

Web fontları için Google Fonts, Typekit ve Font Squirrel kullanabilirsiniz. Açık Google yazı tipleri her şey ücretsizdir, Typekit ve Font Squirrel ücretsiz ve ücretli seçenekler sunar.

Boyutu ayarla

Artık kombinasyona karar verdiğinize göre, Sonraki adım- boyutları ayarlayın. Bunun için harika bir araç var.

Yazı tipi önemlidir. Her şey yolundayken fark etmediğiniz hava gibi. Çoğu insanın hangi yazı tiplerinin adı veya nasıl farklı oldukları hakkında hiçbir fikri yoktur (ve sorun değil), ancak kullandığınız yazı tipi projenize uymuyorsa sitenizde bir sorun olduğuna dair açık bir hisleri vardır.

yazı tipi ağırlığı nedir

Yazı tipi okunabilirliği

Hangi yazı tipini seçerseniz seçin, iyi okumalıdır. Özellikle kullanıyorsanız arka plan fotoğrafı... Küçük ayrıntılar içeren bir fotoğrafa ince bir yazı tipi koyarsanız, metin okunmayacaktır. Her zaman buna dikkat edin.

Ne yapılabilir? İlk olarak, arka plana uygun bir fotoğraf kullanın: büyük, homojen elemanlar... İkinci olarak, bir filtre kullanarak fotoğrafı karartın, daha pürüzsüz hale gelecek ve metin daha iyi okunacaktır. Üçüncüsü, "satır içi stil" uygulayarak belirli bir bloğun doygunluğunu artırmak mümkündür. Bu, ayarları sitenin tamamı için değil, yalnızca metnin bir kısmı için belirlediğiniz anlamına gelir. Metni seçmeniz ve parametreleri düzenleyici aracılığıyla ayarlamanız gerekir.

Bu şekilde uygulanacak stil en üstte Genel Ayarlar her zaman öncelikli olacaktır. Bu nedenle, site ayarlarındaki parametreleri aniden değiştirirseniz ve değişiklikler görünmezse, bu yere "satır içi stil" uygulanır. Kaldırmak için metni seçmeniz ve "temizle" simgesini tıklamanız gerekir.

Örnek 1: Metin çok okunaklı değil

Örnek 2: Metin iyi okuyor

Yazı tipi seçme konusu ilginizi çekiyorsa, projenize yakın iyi siteler bulun ve hangi yazı tiplerini kullandıklarına bakın. What Font tarayıcı uzantısı bunu belirlemeye yardımcı olacaktır.

Ayrıca, kullanılan yazı tipine göre web sitesi ve baskı örneklerini toplayan ve sıralayan bir kaynak olan http://fontsinuse.com/ adresindeki Bağımsız Tipografi Arşivi'ne de göz atabilirsiniz.

Metinle çalışırken sık sık kendimize şu soruyu sorarız: belirli bir resim için bir yazı tipi nasıl bulunur veya belirlenir?"... Örneğin, bir PSD dosyası buldunuz ve içinde belirli bir güzel yazı tipi test kaydı ile. Elbette bu girişi düzenlememiz gerekiyor, ancak yalnızca Photoshop böyle bir yazı tipinin paylaşılan kitaplıkta yüklü olmadığına ve metin değişirse kaybolacağına dair bir bildirim yazar. Ancak bu yazı tipine ihtiyacımız var, çünkü bu yazı tipinin genel konseptine mükemmel bir şekilde uyuyor. PSD dosyası... İşte bu noktada kendimize şu soruyu soruyoruz: yazı tipini nerede bulabilirim? Bu arada, temel ilke ve yeteneklere aşina olmanızı tavsiye ederim. Kendiniz için çok faydalı ve yeni şeyler bulacağınızdan eminim.

Aslında, bir resimden bir yazı tipi bulmak veya tanımlamak artık bir sorun değil. İnternette büyük olasılıkla bunu yapmanıza yardımcı olacak birçok hizmet var.

Yeterince derine inerseniz, kural olarak, çoğu kişi yazı tiplerini aramak için siteler önerir. Yazı tipi ne ve ne yazı tipi... Aslında ben en çok ikincisini beğendim, o yüzden size detaylı olarak anlatacağım. Ama önce Genel kavram, bu tür hemen hemen her hizmetin üzerine inşa edildiği.

Siteler size bir resim yüklemenizi önerir, ardından sistem analiz etmeye ve uygun bir yazı tipi aramaya başlar. Kural olarak, eşleşmenin daha fazla doğruluğu için, klavyeden ilgili pencerelere ek olarak harflerin girilmesi önerilir, örneğin:

resimleri seçmeniz önerilir büyük beden, en az 100 piksel ve resimdeki kelimeler ideal olarak beyaz zemin üzerine net siyah harflerle ve en az 4 harf uzunluğunda çizilmelidir. Tüm bunlar, makinenin resminizi yazı tipi tabanıyla karşılaştırabilmesi için gereklidir ve kural olarak, böyle bir tabanın on binlerce adı vardır ve çıktı, istenen yazı tipine mümkün olduğunca yakın bir yazı tipidir.

Bu tür birkaç siteyi test ettikten sonra ve resimden aynı yazı tipini arıyordum, en uygun ve etkili sitenin olduğu sonucuna vardım. Ne yazı tipi. Geri kalanlar, yayınlarında güçlü ve sıklıkla yanılıyorlar.

Ana avantajlardan biri, aradığınız yazı tipini ücretsiz olarak indirmeniz için teklif edilme olasılığıdır.

Hizmeti açıyorsun.

İlk olarak, kullanmak istediğiniz yöntemi belirleyin.

1. Gözat düğmesine tıklayın ve istenilen resim... Benim örneğim:

2. Bilgisayarınızda değilse, ancak İnternet'te bir yerde takılıyorsa, bu resmin url adresini belirtin.

Ardından Devam'a tıklayın.

Not

Ne kadar aradıysam da bulamadım benzer hizmet Rus arayüzü ile. Ancak bu korkutucu değil, çünkü burada her şey sezgisel ve nereye tıklayacağınızı çabucak anlayabilirsiniz.

Asıl sorun, böyle bir hizmette Rus alfabesinin harflerini içeren bir yazı tipini asla bulamayacağınızdır, çünkü bunlar henüz Kiril alfabesini desteklememektedir. Ancak bunun tersini doğrulayan örnekler biliyorsanız - yorumları yazın, şüphesiz herkes için faydalı olacaktır.

Gördüğünüz gibi, programın kendisi harflerin yerini tanıdı ve onları ayrı ayrı ayırdı. Ardından klavyedeki hangi harflerin bu resimlere karşılık geldiğini uygun alanlara girmesini ister.

Aşağıda bile, arama sonuçlarını etkileyen üç kontrol vardır.

1. Yalnızca ücretsiz yazı tiplerini veya ücretsiz alternatif yazı tiplerini görüntüleyin... Burada bir onay işareti şu anlama gelir: Arama Sonuçları yalnızca ücretsiz meslektaşları içerecektir.

2. Yalnızca ticari yazı tiplerini veya ticari alternatif yazı tiplerini görüntüleyin- burada tam tersine - sadece ücretli analoglar.

3. Tüm yazı tiplerini göster- olası tüm yazı tipleri aynı anda görüntülenecektir.

İstediğiniz onay kutusunu seçtikten sonra Devam'a tıklayın.

Aralarında en benzer yazı tipini aradığınız aynı arama sonuçları görünecektir. Kolaylık sağlamak için, istediğiniz sistem her zaman sağ alt köşede gösterilir.

Gördüğünüz gibi, bana uygun seçenek, adının altında ilk sırada görüntüleniyor. "Yaz Crushes"... Bu arada, kutuyu işaretledim, böylece bana sadece ücretsiz analoglar teklif edildi. Bu nedenle, kolayca tıklayabilirim "Yazı tipini indirmek için buraya tıklayın" resimden tanımladığım yazı tipini indirmek için.

Bu tür hizmetler oldukça faydalıdır ve bu tür hizmetler ile çalışan ustalar tarafından mutlaka not edilmelidir. grafik editörleri... Sadece Kiril alfabesini destekleyebilecek bazılarının olacağını umabiliriz.

Metinde bir hata bulursanız, onu seçin ve Ctrl + Enter tuşlarına basın. Teşekkürler!