Rus web yazı tipleri. Standart yazı tiplerini kullanmayı deneyin. Web yazı tiplerinin ağırlığı ne kadar olmalıdır?

Herkese iyi günler!!! Bugün yazı tiplerinden bahsedeceğiz. Yabancı bir yoldaş bize bu konuda yardımcı olacaktır. Deneyimi dikkatlice okur ve benimseriz.

Kuşkusuz, font çözüm seçimi sitenin algılanmasında büyük rol oynamaktadır. Sonuçta, çoğu site neredeyse tamamen metinlerden oluşur.

Tomas Laurinavicius, web tasarımcılarının çalışmalarında en çok hangi yazı tiplerini kullanmayı sevdikleriyle ilgileniyordu.

Web sitesi ve blog tasarım yaratıcıları arasında en popüler ve favori yazı tiplerini belirlemek için küçük bir sosyolojik araştırma yaptı.

Ayrıca, belirli bir durum için hangi yazı tipinin en uygun olduğunu bulmak için web tasarımcılarıyla kısa bir röportaj yaptı. Thomas anketinin sonuçlarını hongkiat.com'da paylaştı.

Anket sırasında, web tasarımcıları 73 farklı yazı tipini belirledi - 46 ücretsiz ve 27 ücretli.

Web tasarımcıları için en sevilen fontlar şunlardı: Helvetica, Arial, Georgia, Gotham, Myriad Pro, DIN, Futura, League Gothic, Cabin, Corbel.

Sunulan yazı tiplerinin hepsinin Kiril stiline sahip olmadığı akılda tutulmalıdır - özellikle ücretsiz sürümde.

En İyi 10 Web Tasarımcısının Favori Ücretsiz Yazı Tipi

Ankete katılan tasarımcılar, web grafikleri için en iyi 10 yazı tipini seçti. Bu, Arial, Verdana, Times New Roman, Georgia veya Tahoma gibi işletim sisteminde yüklü olan varsayılan yazı tiplerini hesaba katmadı. (Bu biraz garip - işletim sistemindeki yazı tipi önce gelir).

En İyi 10 Web Tasarımcısının En Sevdiği Ücretli Yazı Tipleri

Aşağıdaki liste, web grafikleri ve tasarımında kullanılan en popüler ticari yazı tiplerini içerir. Bazıları çok pahalıdır, ancak kalitesi kendisi için konuşur ve maliyeti haklı çıkarır.

Hey Habr!

Dağlarca makale zaten yazılmıştır. farklı taraflar web yazı tipleriyle çalışırken pek çok çalışma örneği toplanmıştır, ancak her gün web yazı tiplerinin ne olduğu konusunda temel bir yanlış anlama ile karşılaşmaya devam ediyoruz. Herkesin bu konuyla ilgili google materyalleri için zamanı yok, bu yüzden sık sorulan soruları yanıtlamaya çalıştım. Bu materyal, öncelikle yazı tipi teknolojilerinin inceliklerini henüz araştırmamış olanların ilgisini çekecektir.

01. Neden web yazı tiplerine ihtiyacımız var, neden standart olanları kullanmayalım?

aklıma gelen ilk şey standart yazı tipleriçok sıkıcı ve onların yardımıyla orijinal bir şey yapmak zor. Kural olarak, çoğu yalnızca kullanıcılara değil, aynı zamanda web tasarımcılarına da melankoli ve umutsuzluk getirir. Bu durumda standart olmayan yazı tipleri daha anlamlıdır ve ayrıca bir büyüklük sırası vardır, bu yüzden seçim yapabileceğiniz çok şey vardır. Yine de, yazı tipi markanın ayrılmaz bir parçasıdır, bu nedenle her şirket böyle bir teknik fırsat ortaya çıktığı için onu daha aktif kullanmaya çalışmaktadır.

Ve standart yazı tiplerini, özellikle birçok mobil işletim sistemi desteklemediği için (örneğin, Arial, Taһoma, Verdana ve Georgia) tamamen terk etmek mümkün olacaktır. Ancak, ne yazık ki, yıllardır 96 DPI ekranlara ve georgia verdans'a ayarlanan endüstri, hızlı değişikliklere tam olarak hazır değildi ve eski Windows işletim sistemlerinde, özelliklerden dolayı standart olmayan yazı tiplerini görüntüleme konusunda hala sorunlar var. rasterleştirme mekanizmasının

02. İyi bir web yazı tipi nasıl seçilir?

Bir yazı tipi, yalnızca kağıt üzerinde veya illüstratörde bir fırça ile oluşturulmuş sayısallaştırılmış bir harf kümesi değildir, aynı zamanda çeşitli ortamlarda ve farklı ortamlarda %98 ince ayar ve cilalama, ipucu verme ve test etmedir. farklı boyutlar. Böyle bir yazı tipi iyi görünüyor, stili mükemmel, yazıcıda veya ekranda onunla ilgili herhangi bir sorun olmayacak, iyi kalite yayıyor.

Ancak, bir yazı tipi seçerken, bu bile çok daha önemli değil, yazı tipinin kullanım yöntemine ve kendisine verilen görevlere uygunluğu ve uygunluğu. Yazı tipleriyle çalışıyorsanız, her şeyin nasıl çalıştığını anlamalısın hangi teknolojiler kullanılıyor. Bu, bir dizi anlaşılmaz ezberlenmiş kuralı akılda tutmamaya, uyum sağlamaya ve başlamaya yardımcı olacaktır. Örneğin, kendine saygısı olan her yazıcı, ofset baskı için TrueType yazı tiplerinin kullanılmasının neden istenmediğini, hangi yazı tiplerinin metin yazı tipi olarak kullanılabileceğini ve hangi yazı tiplerinin yalnızca başlıklar veya dizinler için kullanılabileceğini bilir. Bunu bilmiyorsa, büyük bir tirajı yeniden basması gerekecek ve işte sürekli sürprizleri ve sorunları olacak. Hiç kimsenin web tasarımcılarından herhangi bir talepte bulunmaması şaşırtıcı.

03. Tarayıcılar yazı tiplerini nasıl oluşturur?

Oldukça sık duydum, derler ki, tarayıcılar yazı tiplerini kendileri oluşturur, bu yüzden her yerde farklı görünürler. Ancak aslında, işletim sisteminin özel bir grafik alt sistemi, yazı tiplerinin oluşturulmasında yer alır: Windows'ta bu GDI veya doğrudan yazma, ve OS X ve iOS'ta - çekirdek metin(ve önceki QuickDraw). Toplamda 3 ortak yazı tipi rasterleştirme (oluşturma) mekanizması vardır: iki renkli (siyah beyaz) piksel, tek renkli piksel (genellikle kenar yumuşatma veya normal kenar yumuşatma olarak adlandırılır) ve alt piksel. Alt piksel, oluşturulan görüntünün yatay çözünürlüğünü artırmak ve netliği artırmak için her pikselin 3 parçaya (kırmızı, yeşil ve mavi) bölündüğü LCD ve plazma ekranların özelliğini kullanır.

Ancak tarayıcılar, işletim sistemi tarafından sağlananlardan kendi oluşturma yöntemlerini seçer. Örneğin, GDI'nin bir parçası olarak 3 görüntü oluşturma seçeneği vardır: siyah / beyaz, normal kenar yumuşatma ve alt piksel temiz tip. İkincisinin özelliği, yumuşatmanın alt piksellerin düzenine göre yalnızca yatay olarak gerçekleşmesidir. Bu yüzden kullanırken, türün yatay ve çapraz vuruşlarında genellikle korkunç dişler görüyoruz. Neyse ki Microsoft, mekanizmayı yavaş yavaş geliştirmeye başladı ve GDI, dikey kenar yumuşatmanın ortaya çıktığı DirectWrite teknolojisi ile değiştirildi. Karşılaştırmak:

04.TTF veya OTF?

TrueType ve PostScript başlangıçta farklı yazı tipi biçimleriydi. TrueType, ikinci dereceden Bezier eğrileri kullanırken PostScript, Illustrator ve Photoshop tasarımcılarının aşina olduğu kübik eğriler kullanır. Bugün, eğrileri tanımlamanın her iki yöntemi de aynı OpenType formatının parçası olarak kullanılmaktadır; tek fark, TrueType dosyalarının TTF uzantısına ve PostScript dosyalarının OTF uzantısına sahip olmasıdır. Teknolojilerin her birinin kendi ipucu özellikleri ve uygulama özellikleri vardır.

Resme bak. TrueType yazı tipi küçük boyutta çok daha okunabilirse, ancak büyük boyutta karakteristik dişler görürsek, PostScript yazı tipi için her şey tam tersidir. Bunun nedeni, tarayıcıların PS ve TT için farklı tarama yöntemleri seçmesidir. PS için, tarayıcı olağan tek renkli kenar yumuşatma uyguladı ve TT, ClearType tarafından işlendi. Böylece, metin yazı tipleri için TrueType'ın tercih edildiği ve PostScript'in başlıklar ve büyük yazılar için daha uygun olduğu ortaya çıktı.

Ayrıca henüz tüm tarayıcıların DirectWrite kullanmadığını görüyoruz. Yani, hala Google Chrome'da değil.

05. Ekranı başka neler etkiler?

Bazen rasterleştirme yöntemini manuel olarak ayarlamak daha iyidir. Örneğin, Webkit motoruna sahip tarayıcılarda CSS özelliğini kullanabilirsiniz - webkit-yazı tipi yumuşatma ve alt piksel kenar yumuşatma yerine normal kenar yumuşatmayı manuel olarak etkinleştirin veya tam tersi. Tarayıcının rasterleştirme yöntemini değiştirmesini sağlamanın önemsiz olmayan yolları da vardır, Habré'de bir zamanlar text-shadow ile bir hack kullanılması önerildi.

Yazı tipi boyutunu (yazı tipi boyutu) unutmamalıyız. Anahat şekli, kontur kontrastı ve okunabilirlik boyuttan boyuta büyük ölçüde değişebilir. Grafik düzenleyiciyi bırakın ve savaşta web yazı tipinin tarayıcıda nasıl göründüğüne bakın.

Kenar yumuşatma kusurlarını düzeltmenin başka bir yolu da renk ve kontrastı yönetmektir. Kromatik konturlamanın etkisini azaltmak için (ClearType kullanılırken sarı ve macenta kenarlar görünür), arka plan rengini metnin rengine yaklaştırarak ton kontrastını azaltmayı deneyebilirsiniz. Kendinizi fazla kaptırmayın, görme engelli kullanıcılara dikkat edin.

06. Web yazı tiplerinin ipucuna ihtiyacı var mı?

ipucu Özel Talimatlar yazı tipinin soyut eğrilerini monitördeki piksellere sabitleyen . Yazı tiplerinin büyük çoğunluğu (ticari olanlar dahil) ima edilmemiştir, çünkü bu oldukça zahmetli ve karmaşık bir işlemdir. TrueType ve PostScript ipucu farklı şekilde yapılır. Ucuz bir yazı tipi alırsanız, OTF formatı daha güvenlidir, çünkü TT'de prosedür siyah beyaz tarama günlerinden beri değişmeden kalmıştır ve tamamen yeterli değildir, ancak PS için prosedür daha basittir ve yazarın fırsatı vardır. otomatik ipucu yapın.

İpucu içermeyen bir yazı tipi, rasterleştirildiğinde bulanıklaşır ve harflerin yüksekliği atlayabilir.

Bir yandan ima edilen yazı tipi oldukça açık, zıt ve tekdüze iken, diğer yandan harflerin şekilleri boyuta bağlı olarak bozulmakta ve aralıklar gerçeklerden farklılık gösterebilmektedir. Harfler kesinlikle piksellere uyar.

Windows'ta belki de en radikal yaklaşımı görüyoruz: Tahoma, Verdana, Arial ve Georgia gibi popüler yazı tipleri özellikle GDI ClearType için ima edildi ve DirectWrite göründüğünde, işletim sistemindeki ana yazı tiplerinin ima edilmesi ve güncellenmesi gerekiyordu.

Microsoft'tan farklı olarak, Apple tam tersi bir yaklaşım benimsiyor, bu nedenle işletim sistemleri Herhangi bir yazı tipinin az çok yüksek kaliteli çıktısına izin veren algoritmalar kullanılır ve ipucu hiç dikkate alınmaz.

Soruyu yanıtlamak: 300 DPI monitör çağı hızla yaklaşıyor ve büyük miktar mobil cihazlar zaten bu izne sahip ve yakında ima etmeye hiç gerek kalmayacak. Ancak Windows hala ipucuna bağımlı olduğundan ve düşük çözünürlüklü monitörlere odaklandığından, metin fontları olarak yüksek kaliteli ipuculu veya standart fontları seçmeye çalışın, aksi takdirde metin okunamaz ve okunması zor olacaktır.

07. @font-face veya Cufon?

Kulağa ne kadar garip gelse de, hala bu soruyu kendilerine soran insanlar var. Tarayıcılar @font-face özniteliğini desteklemeye başladıktan sonra, diğer tüm font gömme teknolojilerinin (Cufon, sIFR, Flash) alakasız hale gelmesi gerekirdi. Ancak, örneğin sitede vektör eğrileri değil, yalnızca bir baskı, bir yazıcının bir kağıda nasıl yazdırdığı veya Photoshop'un düzenlenemez bir JPG gösterdiği zaman, bir yazı tipini bir görüntüyle değiştirmenin bir yolu hala bazı anlamlar olarak kalır. Buna birçok normal (masaüstü) yazı tipi lisansı izin verir. Bazı yazı tipi üreticileri (Adobe gibi), korumalı kaldıkları ve indirilemedikleri sürece masaüstü yazı tiplerinin (programlara ve sunucuya) gömülmesine izin verir. Ayrı bir web lisansı satın alma seçeneğiniz yoksa, yazı tipi flash nesnelerle gömülü olduğunda bunun için uygun bir sIFR kullanabilirsiniz. Dezavantajı, tüm cihazlar tarafından desteklenmeyen Flash kullanılmasıdır. Lisans izin veriyorsa Cufon teknolojisini de kullanabilirsiniz (Tuval kullanılır). Tabii ki, içinde bu durum komut dosyası hantal olacak ve metin seçimi çalışmayacak, ancak umutsuz durum Uygun.

Ancak @font-face kullanmak en iyisidir, hem teknolojik olarak daha gelişmiş hem de daha kullanışlıdır, ayrıca onunla çalışmak için yeterli deneyim birikmiştir. Tek dezavantajı, tüm üreticilerin yazı tiplerinin web'de kullanılmasına izin vermemesidir.

08. Yazı tipi dosyaları hangi formatlarda olmalıdır?

Bugün, siteye gömmek için hazırlanan yazı tipleri (@font-face) aynı anda birkaç formatta olmalıdır:

TTF veya OTF- bize tanıdık gelen, ancak sitede gezinirken sunucudan yüklenen bir yazı tipi dosyası;
WOFF- korumasız bir OTF veya TTF kaynak arşivi, belki de en popüler tarayıcıların desteklediği en önemli formattır ve WOFF'taki dosyalar genellikle orijinal olanlardan 2-2,5 kat daha hafiftir;
EOT- eski tarayıcıları desteklemek için gereken koruma mekanizmalarına sahip gömülü TT OpenType arşivi Internet Explorer(IE8'den beri TrueType eğrilerine ek olarak PostScript de desteklenmektedir);
SVG- Safari tarayıcısını desteklemek için.

09. Web yazı tipleri dönüştürülebilir mi?

Size ne söylenirse söylensin, sadece dosyayı dönüştüremez ve kaydedemezsiniz. orjinal kalite yazı tipi, özellikle orijinal olarak OpenType biçimindeyse. Bu süreçte, yazı tipi dosyasına gömülü bazı verileri kaybetme şansı vardır (derlenmiş talimatlar, ek işaretler, metrikler). Bunu, dönüştürme sırasında dosya aniden "incelediğinde" fark edeceksiniz, TrueType'ı PostScript'e dönüştürmek özellikle koşer değildir ve bunun tersi de geçerlidir.

Ek olarak, dönüştürme işlemi, değişikliği yasaklayan bir lisansın şartlarını neredeyse her zaman ihlal eder. Başka bir deyişle, aynı hırsızlık. Dosyaları dönüştürücüye attığınızda, dosyaların bunları kaçırmayacağından ve dosya içerdiği için bir uyarı vereceğinden emin olun. dijital imzalarüretici ve ilgili değişiklik yasakları.

10. Web yazı tiplerinin ağırlığı ne kadar olmalıdır?

Tarayıcı, sayfayı oluşturmadan önce yazı tipi dosyalarını tam olarak indirmelidir. Kısa bir süre için egzotik yazı tipleri yerine standart sistem yazı tipleri yanıp söndüğünde “yazı tipi flaşı” (veya FOUT) etkisini görmüş olabilirsiniz. TTF (OTF) 100 kb'ye ve WOFF (EOT) 50 kb'ye sığıyorsa normaldir. Her zaman standart dışı yazı tiplerini kullanmanız gerekip gerekmediğini düşünün, 1 kısa başlıkta kullansanız bile, yine de tüm yazı tipi dosyasını indirmeniz gerekir.
Tasarımınız ne kadar mükemmeliyetçi olursa, yazı tipi dosyaları o kadar küçük olabilir ve basit şekiller seçmeye çalışın. Bu anlamda ideal form, çok az kontrast içeren açık bir geometrik grotesktir. Bir yazı tipinin yüklenmesini hızlandırmak için, onu data:uri ile stil sayfasına dahil etmek de faydalı olabilir.

11. Web'de kaç tane yazı tipi stili kullanılabilir?

Bir tasarımcının bakış açısından, birçok yazı tipi havalı. Ve gerçekten de, başlık için - Kalın ve orada, kenar çubuğu için - ExtraLight için, genellikle gereksiz metinleri dolduracağız ve bunları Yoğun Kalın'a basacağız. İşte burada - gerçek zenginlik ve stil çeşitliliği. Ancak tüm bu “zenginlik” siteye aktarılmaya başladığında, her şeyin çok yavaş olduğu ortaya çıkıyor. Ve böyle bir siteyi bir mobil cihazdan açmaya çalışmamak bile daha iyidir. Ayrıca, her bir stilin bir miktar paraya mal olduğunu ve müşterinin sizden pahalı bir yazı tipi satın almamak için bir font eşanlamlısı bulmanızı veya stil sayısını azaltmanızı isteyeceğini unutmayın. Bir veya farklı yazı tiplerinin maksimum 2-3 stilini kullanmak normaldir.

12. Karakter setini sınırlamam gerekir mi?

Bu sorunun cevabı ne tür bir site olduğuna ve nasıl kullanılacağına bağlıdır. Dosyaların boyutunu önemli ölçüde azaltmak mümkün olduğundan, kısıtlamalar yararlı olabilir. Bazen, cehalet nedeniyle, geliştiriciler siteye tam karakter kümesiyle ağır yazı tipi dosyaları yükler ve hiyeroglif olmaması iyidir (bilgi için Arial Unicode yazı tipi şunları içerir: çoğu Unicode tablosundaki karakterler 22 mb ağırlığındadır).

İngilizce siteleri en kolay hale getirenler, ek karakterler yüklemelerine gerek yoktur, yalnızca Temel Latince (veya ASCII) olanlardır. Yazı tipini yalnızca Rusça + İngilizce eklentilerdeki başlıklar için kullanırsanız, ASCII (Temel Latin) kümeleri ve Rus alfabesinin 64 karakteri sizin için yeterli olacaktır, Kiril Genişletilmiş 420 karakter kümesini yüklemek hiç gerekli değildir. Sitenizin çok dilli olması tamamen farklı bir hikaye, bu durumda karakterlerin yanlış görüntülenmesini önlemek için kullanılan tüm dilleri kapsamaya çalışmalısınız.

13. Yazı tipi klonları kullanılabilir mi?

Orijinal yazı tipini satın almanın ya çok pahalı olduğu ya da hiç imkansız olduğu ortaya çıkar, o zaman bir yazı tipi eşanlamlısı (klon) seçmek uygun olacaktır. Tabii ki, ünlü bir Rus şirketi tarafından yapılmış olsalar bile, onlardan inanılmaz kalite beklememelisiniz. Kendini yeni bir alanda denemeye karar veren isimsiz bir okuryazarla karşılaştığınızda her şey kötü, bu tür yazı tiplerine dikkat edin. İşte klon örnekleri (orijinal parantez içinde belirtilmiştir): FreeSet (Frutiger), Pragmatica ve Helios (Helvetica). Harf şekillerinin değişebileceğini lütfen unutmayın. Çok sayıda klonlar Paratype'ın Yazı Tipi Eşanlamlıları Dizinindedir.

14. Bir yazı tipi nasıl test edilir?

Tasarımcılar, yazı tiplerini yalnızca photoshop pencerelerinden görmeye alışmayın, resim düzenleyiciler kendi metin yumuşatma yöntemlerini kullanırlar ve aldanabilirsiniz. güzel resim. Bunları nasıl test edeceğinizi ve tarayıcılarda nasıl izleyeceğinizi öğrenmek çok daha faydalıdır. Bir demo sayfası varsa, render sırasında her türlü artefakt ve ani çıkmadığından emin olun. Typecast gibi birçok yazı tipini kontrol edebileceğiniz ve ardından sayfayı müşteriye gösterebileceğiniz bir araç da var. seçenler için yeni yazı tipi hazır bir site için - sizin için vazgeçilmez olan Web Fonts Previewer hizmeti, herhangi bir yazı tipini daha önce uygulamış gibi canlı bir çalışma sitesinde test edebilirsiniz.

15. Bilgisayarımda font var sitede kullanabilir miyim?

İlk olarak, hırsızlık hakkında biraz. Bilgisayarlarında kökeni bilinmeyen binlerce yazı tipi olan birçok tasarımcı tanıyorum. Kural olarak, sadece İnternet'ten indirdiler. Ama nedense hiç kimse iyi yazı tipleri oluşturmanın aylar, hatta bazen yıllarca ciddi bir çalışma gerektirdiğini düşünmüyor! Ama sadece bu yüzden singed kullanamazsınız, fontların nereden alındığı belli olmadığı için geliştirme aşamasında ciddi zorluklarla karşılaşabilirsiniz.

İşletim sistemi ile birlikte gelen bir fontu sitenize gömmek istiyorsanız bunu ancak rasterleştirerek veya görsellerde kullanarak yapabilirsiniz. Gerçekten inşa etmeniz gerekiyorsa, satın almanız gerekecek ayrı lisans, tıpkı normal yazı tipleri gibi (hem Georgia hem de Tahoma mevcuttur).

16. Web yazı tipi nasıl satın alınır?

"Bir yazı tipi satın aldığınızda", yazılım satın almaya en yakın olduğunuz an, program dosyasının haklarından ziyade onu kullanmak için bir lisans aldığınız zamandır. Yasal olarak derlenmiş bir yazı tipi dosyasının bir program olduğu ortaya çıktı. Lisans izin vermiyorsa, değişiklik ve değişiklik telif hakkı ihlali olarak kabul edilir.

Yazı tipi satın almanın uygun bir yolu, yazı tipi kataloglarıdır (Fonts.com, MyFonts, Ascender, Typekit). Mevcut kartla ödeme seçeneklerinden birini görüntüleyebilir, karşılaştırabilir ve seçebilirsiniz. Şirketler için, stüdyo yapımcısıyla doğrudan iletişime geçmek veya müşteriye yazı tipi satın almasını sağlamak en kolayı olacaktır.

Ya da belki bir yazı tipine hiç para harcamamak daha iyidir? birçok harika var ücretsiz yazı tipleri, hiçbir şekilde ücretli olanlardan daha düşük olmayan!

17. Lisanslar nelerdir?

Farklı tipte yazı tipi lisansları vardır ve web yazı tiplerinin ortaya çıkmasıyla birlikte çeşitlilikleri artmıştır. AT gerçek hayat, her şirket oyunun kurallarını kendisi belirler ve yazı tipi lisansı diğer çeşitli özellikleri içerebilir. Tipik ile ilgileneceğiz

Genel Ticari Lisans, kullanımı aşağıdakilerle sınırlandırır: bir miktar cihazlar ve yazı tipi kullanılarak oluşturulan eserlerin dağıtımına izin verir. Bunlar dergiler, gazeteler, el ilanları, kartvizitler, rasterleştirilmiş tip resimler olabilir - hepsine birlikte baskı diyebilirsiniz. Bu lisans film, televizyon, web ve uygulama ve programlara yerleştirme için uygun değildir, bu tür haklar ayrıca satın alınmalıdır.

Ayrıca belirli lisanslar da vardır, örneğin: münhasır haklara sahip bir lisans. Bu durumda firma tüm hakları font tasarımcılarından satın alır ve fontun yazarı bile hiçbir yerde kullanma hakkına sahip değildir. Bu tür yazı tiplerinin torrentlerde olması veya bazı üçüncü taraf tasarımcıların bunları kullanması özellikle şaşırtıcıdır.

Ücretsiz lisanslar (kamu malı) - yazı tipinin yazarı, adını (Creative Commons) veya onsuz (örneğin, OFL, GPL, Apache 2.0) belirtmek koşuluyla ücretsiz dağıtıma izin verir. Bu tür bir lisans bile izin verir ticari kullanım satış ve ücretli dağıtım hariç. Örnekler: PT Sans, Opensans, Droid. Bazen bir yazı tipi değişikliğine (GPL) izin verilir, ancak oluşturduğunuz değişiklik otomatik olarak aynı lisansı devralır (yani çatallanabilirsiniz). Özgürlük, dahil olmak üzere herhangi bir medyada kullanılabileceğini ima eder. ve ağ.
Ticari olmayan kullanım için ücretsiz - yani, para kazanmadığınız her durumda kullanabilirsiniz. Örneğin, eğitim, hobiler ve topluluk projeleri için. Bazen üreticiler, tasarımcının şanslı müşterisinin yazı tipinin ticari bir versiyonunu satın alacağı umuduyla tasarımcıların onu kullanmasına izin verir.

18. Web yazı tipleri için lisanslar arasındaki fark nedir?

Web lisansları bizim favorimizdir ve ya ana lisansa ek olarak gelir ya da ayrı olarak gelir. düzenler özel durum- web sitelerinde yazı tipi kullanımı. Kural olarak, en önemli sınırlama sayfa görüntüleme sayısıdır. Örneğin ayda 10 bin, 100 bin veya 1 milyon yani Daha fazla insan sitenizi ziyaret edin, lisans için o kadar fazla ödersiniz. Ayrıca bir yazı tipi için 1 kez ödeme yaptığınızda sınırsız seçenek vardır, ancak bunlar kat kat daha pahalıdır. Muhtemelen birinin görüntüleme sayısını izleyip izlemediğini merak ettiniz mi? Çoğu zaman değil. Ancak, çok sayıda sayacın sitenizin trafiğini izlediğini ve satıcının şüphesini uyandırarak lisansınızı kaybedebileceğinizi unutmayın.

Yine de, ayrı bir web lisansı üzerinde kullanıma izin vermez. geleneksel bilgisayarlar. Bazen bir web lisansı ücretsiz olarak verilir, yani bir masaüstü yazı tipinin satın alınmasıyla birlikte web sürümünü kullanma hakkınız olur. Ancak bu hala nadirdir, üreticilerin büyük çoğunluğu ek bir ücret talep eder.

Satın aldıktan sonra alacaksınız özel dosyalar Siteye gömdüğünüz , (TTF, OTF, WOFF, EOT) ve bazı yazı tipleri, bu dosyaların siteye korumasız bir biçimde yerleştirilmesine izin vermez, çünkü teorik olarak üçüncü şahıslar yazı tipi dosyalarını kendileri alabilirler. Üçüncü seçenek, Adobe'nin Typekit gibi bir yazı tipi üreticisinden özel bir web hizmeti kullanmanız ve bir abonelik ücreti ödemenizdir.

19. İyi web yazı tiplerini nereden bulabilirim?

Google'dan ücretsiz yazı tipi kataloğu
Fontsquirrel, ünlü bir web yazı tipi dönüştürücü ve dizinidir.
Myfonts - uygun bir ödeme sistemine sahip büyük bir yazı tipi mağazası
Fonts.com- Birincil rakip Yazı Tipleri
Typekit - Adobe'den yazı tipi kiralama hizmeti
Typecast - test hizmeti ile yukarıda belirtilen mağaza
not ilyaerin tarafından önerilen başka bir faydalı kaynak, WebFont.ru Form Üzerinden İşlevsellik: Okuyucu için Tasarlama
Maria Doreuli. Lisanslama. açıklığa kavuşturmak için
Tim Brown. Web'de işleme yazın
Tim Brown. Tür oluşturmayı etkileyen CSS özellikleri
Tim Brown. Tür oluşturma: işletim sistemleri
Tim Ahrens. Yazı Tipi Oluşturmaya Daha Yakından Bir Bakış
Tim Ahrens (Typekit). TrueType ipucuna daha yakından bir bakış
OpenType/CFF'nin TrueType'a Göre Avantajları

Ildar Kinyabulatov, ADV/web mühendisliği web tasarımcısı

Herkese selam! Bugün sizlere web tasarım başlığı altında web sitesi geliştirirken kullanılması gereken fontlardan bahsetmek istiyorum.

Kural olarak, herkes sitenin içerik kısmı için hangi yazı tiplerinin kullanılması gerektiğini düşünmez. seçim güzel yazı tipleri site için tasarım geliştirmenin en önemli parçasıdır. Site bilgilerinin okunabilirliği bu kısma bağlı olduğundan ve bu bildiğiniz gibi sitedeki en önemli şeydir. Bu sebeple bu konu çok ciddiye alınmalıdır.

Ancak sitenin tasarımında yalnızca gelecekteki site ziyaretçilerinin sahip olduğu yazı tiplerini kullanabilirsiniz. Bu, sayfaların farklı işletim sistemlerine ve tarayıcılara sahip Tüm kullanıcılar için doğru şekilde görüntülenmesi için yapılır. Aksi takdirde, standart olmayan yazı tiplerini kullanırsanız, çoğu ziyaretçi her şeyi farklı ve çoğu durumda çirkin bir şekilde görecektir. Bu nedenle aşağıda listelenen standart yazı tiplerinin kullanılması tavsiye edilir. Yazı tipleri listesi, işletim sisteminde yüklü olan yazı tiplerini içerir. Windows sistemi XP ve üstü.

Bu yazıda diğer işletim sistemlerinden gelen yazı tiplerini dikkate almıyorum. Deneyimli bir layout tasarımcısı çeşitli işletim sistemlerindeki font eşleşmesini bilmeli ve layout esnasında bu anı css stillerinde yazacaktır.

Temel olarak, tasarımın içerik kısmını geliştirirken iki tür yazı tipi kullanılır:

• serif yazı tipleri
• sans-serif yazı tipleri (sans-serif yazı tipleri)

Serif yazı tipleri- (İngilizce serif - serif) ana hatları vuruşlarla başlayan ve biten yazı tipleri. Örneğin Times New Roman.

Sans serif yazı tipleri(sans serif yazı tipleri) — (İngilizce sans-serif - sans-serif) serif içermeyen katı, eşit satırlı yazı tipleri. Örneğin Ariel.

Aşağıda serif ve sans-serif yazı tiplerinin ekran görüntüsünü görebilirsiniz.

Web tasarımı için yazı tipleri:

• Arial
• Arial Siyah
• Arial Dar
• Kitap Antika
• Yüzyıl Gotik
• Komik Sans MS
• Kurye Yeni
• Franklin Gotik Orta
• Gürcistan
• Darbe
• Lucida Konsolu
• Lucida Sans Unicode
• Microsoft Sans Serif
• Palatino Linotipi
• Silfaen
• Tahoma
• Times New Roman
• Trebuchet MS
• Verdana
• Webdings (çeşitli semboller ve işaretler)
• Kanatlar (çeşitli semboller ve işaretler)

Bazı yazı tiplerinde italik olmaması gibi bir anı da belirtmek isterim, italik yerine eğim kullanırlar, bu da metnin okunmasını zorlaştırır.

Windows'taki standart yazı tiplerinden italik yoktur:

• Arial Siyah
• Komik Sans MS
• Franklin Gotik Orta
• Darbe
• Lucida Konsolu
• Lucida Sans Unicode
• Microsoft Sans Serif
• Silfaen
• Tahoma

İtalik olmayan yazı tiplerinden daha önce bahsettiğim için, orijinalinde kalın yazı tipleri olan yazı tiplerinin de bulunduğunu belirtmek isterim. Bu nedenlerle, işaret eden stillerin kullanımı kalın yazı tipi anlamı yok, çünkü sonuç olarak ihtiyacımız olanı alamayacağız.

İletişim tasarımda hayati bir rol oynar - web sitesi ile kullanıcı arasında net bir bağlantı kurmak ve hedeflerine ulaşmalarına yardımcı olmak önemlidir. Web tasarımı bağlamında iletişimden bahsettiğimizde genellikle metinden bahsediyoruz. Tipografi bu süreçte hayati bir rol oynar:

İnternetteki bilgilerin %95'inden fazlası yazılı dildedir.

İyi tipografi okumayı kolaylaştırırken, kötü tipografi kullanıcıları uzaklaştırır. Oliver Reichenstein'ın “Web tasarımı %95 tipografidir” yazısında belirttiği gibi:

Tipografi optimizasyonu, okunabilirliği, erişilebilirliği, kullanılabilirliği (!), genel grafik dengesini optimize etmekle ilgilidir.

Başka bir deyişle, tipografiyi optimize ederek kullanıcı arayüzünüzü de optimize etmiş olursunuz. Bu yazıda, sayfanızın okunabilirliğini ve okunabilirliğini artırmaya yardımcı olacak bir dizi kural sunacağım. Metin içeriği.

Üçten fazla kullanma farklı yazı tipleri sitenin yapılandırılmamış ve profesyonellikten uzak görünmesini sağlar. Aynı anda çok fazla yazı tipi boyutu ve stilinin de herhangi bir düzeni bozabileceğini unutmayın.

Bu durumu önlemek için yazı tipi ailelerinin sayısını en aza indirmeyi deneyin.

Genel olarak, yazı tipi ailelerinin sayısını minimumla sınırlayın (iki çok, bir genellikle yeterlidir) ve web sitenizde bunlara bağlı kalın. Birden fazla yazı tipi kullanıyorsanız, yazı tipi ailelerinin karakterlerinin genişliğine göre birbirini tamamladığından emin olun. Aşağıda yazı tipi kombinasyonlarına bir örnek verilmiştir. Georgia ve Verdana (solda) kombinasyonu, uyumlu bir bağlantı oluşturan benzer anlamlara sahiptir. Bunu, Impact'in ağırlığının diğer yazı tipini büyük ölçüde gölgede bıraktığı Baskerville ve Impact (sağda) eşleştirmesiyle karşılaştırın.

2. Deneyin kullanmak standart yazı tipleri

Yazı tipi yerleştirme hizmetleri (Google Web Yazı Tipleri veya Typekit gibi), projelerinize yeni, taze ve beklenmedik bir şey verebilecek birçok ilginç yazı tipine sahiptir. Ayrıca kullanımı çok kolaydır. Örneğin Google'ı ele alalım:

1. Open Sans gibi herhangi bir yazı tipi seçin.
2. Kod oluştur ve yapıştır HTML belgeniz.
3. Hazır!

Peki ne yanlış gidebilir?

Aslında bu yaklaşımın bir ciddi problem– Kullanıcılar standart yazı tiplerine daha aşinadır ve bunları daha hızlı okuyabilir.

Web sitenizin özel bir kullanım ihtiyacı yoksa özel yazı tipi, örneğin, marka bilinci oluşturma veya etkileyici bir deneyim oluşturma amacıyla, genellikle kullanmak en iyisidir. sistem yazı tipleri. Güvenli bir bahis, sistem yazı tiplerini kullanmaktır: Arial, Calibri, Trebuchet, vb. İyi bir tipografinin okuyucuyu yazının kendisine değil içeriğe çektiğini unutmayın.

Her satırda doğru sayıda karaktere sahip olmak, metninizin okunabilirliğinin anahtarıdır. Metninizin genişliğini tasarımınız belirlememelidir. Bu aynı zamanda bir okunabilirlik meselesi olmalıdır. Bu okunabilirliğe ve satır uzunluğu ipucuna şuradan göz atın:

"Almak istiyorsanız, satır başına yaklaşık 60 karaktere sahip olmalısınız. iyi deneyim okuma. Her satırda doğru sayıda karaktere sahip olmak, metninizi okunabilir hale getirmenin anahtarıdır.”

Satır çok kısaysa, gözün çok sık dönmesi gerekir ve bu da okuyucunun ritmini bozar. Metin satırı çok uzunsa, kullanıcının metne odaklanması zor olacaktır. Resim: malzeme tasarımı

Mobil cihazlar için satır başına 30-40 karakter kullanmalısınız. Aşağıda, bir mobil cihazda görüntülenen iki siteye bir örnek verilmiştir. İlki satır başına 50-75 karakter kullanır (yazdırma ve bilgisayar için satır başına en uygun karakter sayısı) ve ikincisi en uygun 30-40 karakter kullanır.

Resim: Kullanıcı testi

Web tasarımında, metin kutularınızın genişliğini em (göreceli ölçü birimi) veya pikselleri kullanarak sınırlayarak satır başına en uygun karakter sayısını elde edebilirsiniz.

4. Farklı boyutlarda iyi çalışan bir yazı tipi seçin

Kullanıcılar sitenize farklı ekran boyutlarına ve çözünürlüklere sahip cihazlardan erişecektir. Çoğunluk Kullanıcı arayüzleri gerekmek metin öğeleriçeşitli boyutlar (düğme metni, alan etiketleri, bölüm başlıkları vb.). Her boyutta okunabilirlik ve kullanılabilirlik sağlamak için her boyutta iyi çalışan bir yazı tipi seçmek önemlidir.

Seçtiğiniz yazı tipinin daha küçük ekranlarda okunabilir olduğundan emin olun! Vivaldi (aşağıdaki örnekte) gibi el yazısı kullanan yazı tiplerinden kaçınmaya çalışın: güzel olmalarına rağmen okunması zordur.

Birçok yazı tipinde, özellikle "i" ve "L" (aşağıdaki resimde görüldüğü gibi) gibi benzer harf biçimlerini ve "r" ve "n" gibi göründüğünde olduğu gibi harfler arasındaki küçük boşlukları karıştırmak çok kolaydır. "m". Bu nedenle, bir yazı tipi seçerken, kullanıcılarınız için sorun yaratmadığından emin olmak için onu farklı bağlamlarda test ettiğinizden emin olun.

Tamamen büyük harflerle yazılmış metin - okumayı içermeyen bağlamlarda harika(ör. kısaltmalar veya logolar), ancak mesajınızın okunması gerektiğinde, kullanıcılarınızı büyük harflerle yazılmış metni okumaya zorlamayın. Miles Tinker tarafından daha önce de belirtildiği gibi, çığır açan çalışmasında Yazma Kolaylığı, tüm büyük harfli metinler, küçük harflere kıyasla tarama ve okuma hızını önemli ölçüde yavaşlatır.

Tipografide, iki metin satırı arasındaki boşluk için özel bir terimimiz vardır - satır aralığı veya satır aralığı. Artan satır aralığı, metin satırları arasındaki dikey boşluğu artırarak, genellikle değerli ekran alanı karşılığında okunabilirliği iyileştirirsiniz. Genel bir kural olarak, iyi okunabilirlik için satır aralığı karakter yüksekliğinden %30 daha büyük olmalıdır.

İyi seçilmiş satır aralığı okunabilirliği artırır. Resim: Microsoft

Kanıtlanmıştır ki doğru kullanım Dmitry Fadeev'in belirttiği gibi, paragraflar arasındaki boşluklar anlamayı %20'ye kadar artırır. kullanma yeteneği Boş alan kullanıcılara kolayca sindirilebilir miktarda içerik sağlamak ve ardından gereksiz ayrıntıları kaldırmaktır.

Sol: Neredeyse örtüşen satırlara sahip metin. Sağ: İyi seçilmiş boşluk, okunabilirliğe katkıda bulunur. Resim: Elma

8. Yeterli renk kontrastına sahip olduğunuzdan emin olun

Metin ve arka plan için aynı veya benzer renkleri kullanmayın. Metin ne kadar görünür olursa, kullanıcılar o kadar hızlı görüntüleyebilir ve okuyabilir. W3C, bir görüntüdeki metin ve metin için aşağıdaki karşıtlık oranlarını önerir:

• Küçük metin, arka plana karşı en az 4,5:1 kontrast oranına sahip olmalıdır.
• Büyük metin (14 punto kalın / 18 punto normal), arka plana karşı en az 3:1 kontrast oranına sahip olmalıdır.

Bu metin satırları, renk kontrastı yönergelerine uygun değildir ve arka plan renklerinden ayırt edilmesi zordur.
Bu metin satırları, renk kontrastı yönergelerine uygundur ve arka plan renklerine karşı okunması kolaydır.

Bir renk seçtikten sonra, çoğu cihazda gerçek kullanıcılarla test etmeniz zorunludur. Testlerden herhangi biri metninizi okumakla ilgili bir sorun gösteriyorsa, kullanıcılarınızın da benzer bir sorunla karşılaşacağından emin olabilirsiniz.

Renk körlüğü özellikle erkeklerde sık görülen bir durumdur (erkeklerin %8'i renk körüdür), işaretlemek için renge ek olarak başka sinyallerin kullanılması tavsiye edilir. önemli bilgi. Kırmızı ve yeşil renk körlüğü, renk körlüğünün en yaygın biçimi olduğundan, bilgileri iletmek için yalnızca kırmızı ve yeşilleri kullanmaktan kaçının.

Yanıp sönen veya titreyen içerik, duyarlı kişilerde nöbetlere neden olabilir. Bu sadece bir nöbete neden olmakla kalmaz, aynı zamanda genel olarak kullanıcıları rahatsız eder veya dikkatini dağıtır.

Metin yanıp sönmekten kaçının!

Çözüm

Tipografi önemlidir. Doğru tipografiyi seçmek sitenize canlılık ve parlaklık hissi verebilir. Öte yandan, kötü tipografi seçenekleri kullanıcının dikkatini dağıtır ve dikkati kendilerine çekme eğilimindedir. Tipografi çok önemli okunabilir, anlaşılabilir ve okunaklı.

Tipografi içerik sağlamak için vardır.

Tipografi, içeriği kullanıcıya hiçbir zaman bilişsel yük getirmeyecek şekilde sağlamalıdır.

Web tasarımında tipografi için kendi ipuçlarınız var mı? yoksa daha fazlasını mı istiyorsun detaylı bilgi Yukarıda belirtilen sorular hakkında? Aşağıdaki yorumlarda bana bildirin!

Abone olmakkullanıcı deneyimi Gezegen:

Siteniz için doğru yazı tipini bulmanın birçok yolu vardır. Örneğin, ücretli abonelik gerektiren devasa yazı tipi kitaplıklarına sahip hizmetleri kullanabilirsiniz.

Bütçeniz sınırlıysa veya küçük bir proje deniyorsanız, ücretsiz olarak sunulan ücretsiz web yazı tiplerini kullanabilirsiniz. Siteniz için doğru web yazı tipini bulmak zaman alabilir, bu nedenle sizin için en iyilerini bir araya getirdik.

1. Montserrat

Tipografi geliştikçe eski şehir afişlerinden ve tabelalarından uzaklaşıyor. Bu yazı karakterinin yaratıcısı, Buenos Aires sokaklarında gördüğü şehir afişlerinin tipografisinin güzelliğini korumaya çalışmıştır.

2. abrıl şişman surat

Abril Fatface, çeşitli amaçlar için tasarlanmış 18 stili içeren geniş bir yazı tipi ailesinin bir parçasıdır. Bu yazı tipinin güçlü ve zarif bir duruşu vardır, bu da onu göz alıcı başlıklar için mükemmel bir seçim haline getirir. Çoğu zaman Lato, Open Sans ve Droid Sans ile birleştirilir.

3. oyun fuarı ekranı

Önemli x yüksekliği ve küçük karakter abonelikleri göz önüne alındığında, Playfair Display, özellikle alan sınırlıysa, bir başlık yazmak için de uygundur. Georgia ile iyi eşleşir ve genellikle Oswald, Lato ve Arvo ile kullanılır.

4. GT Walsheim

Günümüzde birçok blogda kullanılan GT Walsheim, geometrik sans seriflerin temsilcisidir ve Grilli Type ailesinin bir parçasıdır. Tüm yazı tipleri için ödeme yapmanız gerekir, ancak Grilli Type ücretsiz Deneme sürümü GT Walsheim'ın fotoğrafı.

5. Merriweather

Projeniz için ekran okunabilirliği bir öncelikse, bu amaçla oluşturulmuş Merriweather'ı kullanın. Ayrıca, bu yazı tipi sürekli geliştirilmektedir.

6. Josephine Sans

Josefin Sans, eski İsveç tasarımından ilham almıştır ve zarif bir geometrik estetiğe sahiptir.

7. Gravitas Bir

Gravitas One, "İngiltere şişman yüzüne" dayanmaktadır - cesur reklam yazı tipiİngiltere'de sanayi devrimi sırasında ortaya çıktı. Bu yazı tipi orta ila büyük ölçekte harika görünür ve başlıklar, başlıklar ve sekmeler için uygundur.

8. Jura

Bu fontun harfleri Kaya-li yazı biçimlerini tekrarlar. Ayrıca Kiril glifleri içerir ve Yunan alfabesi. Hafif, normal, orta ve kalın ağırlıklarda mevcuttur.

9. Lig Gotik

İlk olarak 1903'te American Type Founders Company için Morris Fuller Benton tarafından tasarlanan League Gothic, bir güncelleme ve yeni gliflerin eklenmesinden sonra yeni bir kullanım alanı buldu.

10. Fiyort

Fiyort, orijinal olarak basılı kitaplar için oluşturulmuş ve özellikle yerleştirme için uygun bir serif yazı tipidir. uzun metinler küçük basılı formatta. Yazı tipi net bir yapıya, belirgin seriflere ve uzun, zarif inişlere ve inişlere sahip olduğu için sitede büyük miktarda metin içeriği oluşturmak için kullanılabilir.

11. solmayan çiçek

Amaranth yazı tipi ailesi, çok az kontrast ve göze çarpan eğriler ile eğimli olmayan italik bir tasarıma sahiptir. Her üç Amaranth stili de hemen hemen tüm diğer yazı tipleriyle iyi uyum sağlar. Bu yazı tipiyle oynayabilirsiniz - deneyin ve en iyisini seçin.

12. Poli

Bu orta kontrastlı yazı tipi, orijinal olarak geniş glifler gerektiren bir ana dil olan Wayuunaiki için oluşturuldu. Küçük belirtme çizgileri ve büyük x yüksekliğine sahip olması, özellikle daha küçük boyutlarda kullanışlı olmasını sağlar.

13. Gentium Temel

Bu yazı tipi, Latin ve Yunanca karakterlerin yanı sıra Kiril alfabesi ve Gentium Plus sürümünde gelişmiş destek de dahil olmak üzere çok dilli bir yazı tipi olarak oluşturulmuştur. Gentium Basic ve Gentium Book Basic şurada mevcuttur: ücretsiz web sürümü, ancak yalnızca Latin alfabesi ile sınırlıdır.

14. Açık Sans

Open Sans, hümanist grotesklerin bir temsilcisidir. Bu yazı tipi son derece okunaklı ve hem web hem de mobil arayüzler için uyarlanmıştır. Çeşitli amaçlar için kullanılmasına izin veren nötr ama hoş bir görünüme sahip, eğimli olmayan, basit bir yazı tipidir.

15. Defter Düzenli

Büyük x yüksekliğinde, güçlü, çok işlevli bir yazı tipidir. renk kontrastı, metnin okunabilirliğine katkıda bulunan iyi tanımlanmış serifler. Bu yazı tipi hem basılı hem de düşük çözünürlüklü ekranda iyi görünüyor.

16. Signika

Bu ücretsiz web yazı tipi, groteskin temsilcisidir. Düşük kontrast oranı ve büyük x yüksekliği Signika'nın ekranda iyi görünmesini sağlar. Geniş simge yelpazesi, sembolleri, piktogramları ve okları içerir.

17. Josephine Döşeme

Geçen yüzyılın 30'lu yıllarına özgü geometrik tipin kanonlarına göre, İskandinav özelliklerinin eklenmesiyle oluşturulan Josefin Slab, bir levha tipinin özelliklerine sahiptir ve bir daktiloyu andırır. İlginç bir şekilde, x yüksekliği büyük harfin yüksekliğinin yarısıdır.

18. Forum

Adından da anlaşılacağı gibi, bu, büyük harfli başlıklar için iyi olan, aynı zamanda metinleri görüntülemek için de uygun olan bir Roma yazı tipidir. Bu yazı tipinin zarif oranları, yarım daire kemerleri, yatay kornişleri ve dikey sütunlarıyla klasik mimariyi andırıyor.

Adını en ünlü Maya şehirlerinden biri olan Tikal Sans, Güney Amerika uygarlığının yazılarında kullanılan gliflerin özelliklerine sahiptir. Yaratıcısı, yazı tipini veren büyük bir x yüksekliği seçti modern görünüm ve okunaklılığı üzerinde olumlu bir etkisi oldu ve çok çeşitli stil türleri, çeşitli amaçlar için kullanılmasına izin veriyor.

20. Arvo

Hem baskı hem de web için uygun olan bu geometrik levha yazı tipi, Roman, İtalik, Roman Kalın ve Kalın İtalik olarak mevcuttur. Arvo'nun hafif kontrastı, ekranda okunabilirliğini artırır.

21. bevan

Bevan, 30'ların geleneksel slab tipine göre oluşturuldu. Harfler dijitalleştirildi, yeniden şekillendirildi ve web versiyonu için optimize edildi. Bu, web siteleri için uygun olan birkaç süper kalın yazı tipinden biridir.

22. Eski Standart TT

Eski Standart TT, 19. yüzyılın sonlarında ve 20. yüzyılın başlarında popüler olan ve daha sonra unutulan Modern serif yazı tipine dayanıyordu. uzun zamandır. Bu yazı tipi, aşağıdakiler gibi belirli bir içerik türünün stilini oluşturmak için uygundur: bilimsel araştırma veya Yunanca veya Kiril alfabesindeki metinler.

23. Kreon

Haber siteleri ve bloglar için mükemmel olan bu serif yazı tipi aynı zamanda levha benzeri özelliklere sahiptir, ancak dengesi ve düşük kontrastı Kreon'u çok daha kişisel kılmaktadır.

24. Droid Sans

Droid Sans, ekranlardaki menüler gibi küçük arayüzlerde bile maksimum okunabilirlik için optimize edilmiştir cep telefonları. Basit, açık harf formlarına sahip, nötr, eğimli olmayan bir yazı tipidir.

25. italyanca

Bu fontun yaratıcısı, klasik İtalyan kaligrafisinden esinlenmiştir, bu nedenle font, şıklık eklemeniz gereken projeler için çok faydalı olacaktır. Italiana, hem basılı hem de elektronik biçimde haber başlıkları yazmak için de uygundur.

26. Vollkorn

Bu son derece ayrıntılı, çok işlevli serif yazı tipi çok popülerdir. Netliği ve sağlamlığı güven ve enerji iletir, bu da onu başlıklar ve başlıklar için büyük boyutlarda ve daha küçük formatlarda büyük miktarlarda metinler için eşit derecede etkili kılar.

27. Aktör

Bu yazı tipi, oldukça fazla alan gerektiren özellikle büyük bir x yüksekliğine sahiptir. Oyuncu ayrıca, 6 ve 9 sayıları gibi bazı karakterlerin eski moda stiliyle de karakterize edilir.

Kökleri 16. yüzyıla dayanan hümanist yazı tipi Garamond, tipografinin gerçek bir ikonu haline geldi ve EB Garamond da dahil olmak üzere birçok durumda modern yazı tiplerinin temeli olarak hizmet etti.

31. ubuntu

Grotesque Ubuntu, web metnini hem masaüstlerinde hem de mobil cihazlar. Kullanıcıların bu yazı tipini denemeleri, uygun gördükleri şekilde değiştirmeleri ve iyileştirmeleri önerilir.

32. Rosario

Rosario, metin paragraflarını şekillendirmek için harika olan klasik bir hümanist grotesktir.

33. Roboto Döşeme

Roboto Slab, Roboto ailesi yazı tiplerinden biridir. Bar versiyonu özellikle geometrik şekilleri ve açık kıvrımları ile dikkat çekiyor. Gadget ekranları ve metinlerin basılı sürümleri için eşit derecede uygundur.

34. Oswald

Yazı tipi, klasik grotesk Alternatif Gotik'in gözden geçirilmiş bir versiyonudur. Oswald, yakın zamanda çeşitli ağırlıklar, genişletilmiş karakter seti ve daha iyi karakter aralığı ile gelecek şekilde güncellendi.

35. çıkmaz

Çıkmaz, bazı vintage yeteneklere sahip zarif bir el yazısı yazı tipidir. Aksan oluşturmak ve sitenizi kişiselleştirmek için uygundur.

36. Kızıl Metin

Bu özenle hazırlanmış klasik orantılı yazı tipi, hem büyük miktarda metin görüntülemek hem de başlık yazmak için kullanılabilir.