Web tasarımcıları arasında iki kamp var gibi görünüyor: web tipografisini benimseyenler, onunla deneyler yapıyorlar ve hemen hemen tüm tasarımlarında yeni şeyler deniyorlar; ve standart ve web güvenli font yığınlarını çok az çeşitlilikle kullanmayı tercih eden, vebadan hoşlananlar.

Aynı zamanda, ikinci gruba giren bir çok tasarımcının, ilkine daha çok benzediğini dile getiriyor.

Aşağıdaki kaynaklar, hangi kampta olduğunuza bakılmaksızın, web tipografinizi geliştirmenize yardımcı olabilir.

Tipografik prensipleri öğretebilecek referanslar ve makaleler ve web tipografisi konusunda sizi güncel tutmak için bolca ilham ve haber yaratmak için araçlar vardır.

Tipografi Araçları

Typetester
Typetester, istediğiniz herhangi bir örnek metinle birlikte, yan yana, üç yazı tipini karşılaştırmanıza izin verir. Yazı tiplerinin gerçek web sitesinde nasıl görüneceğine ilişkin çok doğru bir resim elde etmek için temel yazı tipi boyutu, yazı karakteri, boyut, lider, izleme, hizalama, sözcük aralığı, dekorasyon, renk ve arka plan rengini belirtebilirsiniz. Sonra, her şeyi istediğin şekilde aradığın zaman, CSS'yi yakalayabilirsin.


HTML Ipsum
HTML-Ipsum, özellikle web tasarımı için bir lorem ipsum üreticisidir. Sadece metin parçalarını vermek yerine, HTML-Ipsum size paragraflar, sıralı listeler, boş tablolar, formlar ve gezinme listeleri gibi önceden biçimlendirilmiş metinler verebilir. Bu şekilde önceden biçimlendirilmiş metin, web sitesi maketlerini ve ilk tasarımları oluştururken zamandan tasarruf etmenin harika bir yoludur.


Typechart
Typechart, önceden biçimlendirilmiş, web güvenli yazı tiplerine göz atmanızı ve bunları hem Windows hem de Mac'te görünecek şekilde görüntülemenizi sağlar. Büyüklük, yazı tipi ve vurgu temelinde bulunan yazı tiplerini sıralayabilirsiniz.


WP-Tipografi
WP-Tipografi, standart WP tipografinizi daha çekici hale getirmeye yardımcı olan bir WordPress eklentisidir. Heceleme, boşluk kontrolü, akıllı karakter değiştirme (alıntı işaretleri, tire işaretleri, elipsler ve matematik sembolleri dahil) ve belirli şeyleri şekillendirmek için CSS kancalarını (ampersanlar, kısaltmalar ve sayılar dahil) destekler.


CSS Tipi Set
CSS Tipi Kümesi, bir metin bloğu oluşturmanıza ve ardından CSS'yi kopyalamanıza olanak tanır. Bir seferde bir yazı tipi şekillendirmek için harika olan basit bir CSS jeneratörü. Yazı, boyut, boşluk, lider, dekorasyon ve rengi kontrol etmenizi sağlar.


Tipik Saygısız
Saygılı Tipik, metni, bilgisayarınıza yüklediğiniz çeşitli yazı tiplerinde örneklemi gösterir. Bir grup yazı tipini bir kerede yan yana karşılaştırmanın harika bir yolu. Tek uyarı: gösterilen yazı tiplerinden sadece bazıları web uyumludur.


Tipografik Izgara
Yerleşik bir dikey ritim, iyi tipografiden iyi tipografiyi ayıran şeylerden biridir. Tipografik Izgara sizin için dikey ritim oluşturmanıza yardımcı olur. Ayrıca, hem tipografi hem de diğer öğeleri konumlandırmak için bir kılavuz olarak dikey bir ızgara içerir.


Yazı tipi ne
WhatTheFont, belirli bir yazı tipinin ne olduğunu bulmak için kolay bir yol sağlar. Sadece bir resim yükleyin (veya bir URL belirtin) ve WhatTheFont hangi fontun kullanıldığını belirler. Bu, resimlerde veya Flash dosyalarında kullanılan yazı tiplerini bulmanın harika bir yoludur.


Dikey Ritim ile CSS
Daha önce de belirtildiği gibi, tutarlı bir dikey ritim, sadece “iyi” olandan ayrı olarak harika bir tipografi kurar. Bu araç, tutarlı bir dikey ritim içeren tipografi için CSS oluşturmanıza yardımcı olabilir. Sadece tutarlı bir dikey ritim için CSS almak için yazı tipi ailesini, temel yazı tipi boyutunu, taban çizgisi yüksekliğini ve hedef yazı tipi boyutlarını girin ve hesaplayın.


Temel Ritim Hesaplayıcısı
Bir başka harika dikey ritim hesaplayıcısı. Bununla birlikte, bu, yerleşik dikey ritminizle oluşturulduğunda birbirinizin yanında farklı yazı tipi boyutlarının nasıl göründüğünü gösterecektir. Kullanmakta olduğunuz tüm yazı tipi boyutlarının iyi görüneceğinden emin olmanın harika bir yoludur.


Yazı Brülörü
Font Burner, grafik arayüz kullanarak sIFR kullanarak web sitelerinize yazı tipi yerleştirmenize izin verir. Şu anda Font Burner'da 1000'den fazla yazı tipi bulunmaktadır ve ayrıca mevcut bir WordPress eklentisi bulunmaktadır. Kullanmak için tek yapmanız gereken kullanmak istediğiniz yazı tipini bulmak, yerleştirme kodunu kopyalamak ve daha sonra web sitenizin koduna yapıştırmaktır.


Kör Metin Oluşturucu
Bu kukla metin oluşturucu, sadece lorem ipsum'u değil, aynı zamanda bir dizi diğer kukla metin türlerini de oluşturmanızı sağlar. Aynı zamanda, bu metni jeneratörü içinde de biçimlendirebilirsiniz (Gelişmiş Seçenekler'e tıklayın) ve ardından CSS'yi kopyalayabilirsiniz.


Temel
Temel, tarayıcı varsayılanlarını sıfırlamak ve temel bir tipografik düzen oluşturmak için dosyaları içeren bir kılavuz ve tipografi çerçevesidir. Bir ızgara düzeni kullanmak isteyen ve aynı zamanda sitenin tipografisini tasarlama konusunda yardım isteyen tasarımcılar için iyi bir seçenek. Tipografi kurulumu, başlıkları, listeleri, paragrafları, blok tırnakları ve tabloları ve diğer bazı biçimlendirme kodlarını içerir.


Yazı Tipi Matrisi
Yazı Tipi Matrisi, Mac ve Windows işletim sistemleri, Microsoft Office ve Adobe Creative Suite ile birlikte gelen yazı tiplerini, hangi tür bilgisayarlarda hangi yazı tiplerinin bulunabileceğini görmeyi kolaylaştıran bir kılavuzda gösterir. Örneğin, siteniz daha çok tasarımcıya hitap ediyorsa, Adobe Creative Suite ile birlikte gelen yazı tiplerinde ilk yazı tipini oluşturabilirken, site iş kullanıcılarını hedefliyorsa, ilk yazı tipi Microsoft Office'ten bir şey olabilir.


Typograph
Tipograf, farklı ölçekler ve dikey ritim diğer unsurları ile denemenizi sağlar. Diğer düzen seçeneklerinin yanı sıra çeşitli geleneksel ölçekleri (Le Corbusier ve Fibonacci dahil) içerir.

Web Yazı Hizmetleri

Typekit
Typekit, Hareketli Tip Ligi, FontFont ve Veer de dahil olmak üzere çeşitli türdeki satıcı ve dökümhanelerin yazı tiplerini sunmaktadır (bir hesap için kaydolmadan tüm font listesini görebilirsiniz). Ayrıca, fontlarınızı şekillendirmek için gelişmiş kontrol seçenekleri, sonsuz ölçeklenebilirlik ve ziyaretçilerinize sitenizin hangi fontları kullandığını söyleyen bir colofon sunarlar. Typekit için fiyatlandırma, yüksek trafikli siteler için 100 $ / yıl'a kadar kısmi erişim için ücretsiz arasında değişmektedir.


Kernest
Kernest, OFL, GPL, GUST ve Creative Commons yazı tiplerinin yanı sıra ticari lisansa sahip olan bir web font hizmetidir. Onların yazı tiplerinin birçoğunun kullanımı ücretsizdir (hizmetin kendisi ücretsizdir), diğerleri ise birkaç dolardan başlayan abonelik ücretlerine sahiptir.


Yazı Tipleri Ascender'den Canlı
Ascender kendi web font hizmeti, Fontlar Live sunuyor. Monotype, Microsoft, Bigelow & Holmes ve diğerlerinin yanı sıra kendi yazı tiplerinin yazı tipleriyle birlikte 110'dan fazla yazı tipine sahipler.


Google Yazı Tipi API'sı
Google, sınırlı sayıda açık kaynaklı web yazı tipi sunmaktadır. Seçim büyük olmasa da, ücretsiz ve Google tarafından desteklenir. Bu, kapasite sorunları veya gecikme süresiyle karşılaşmanızın mümkün olmadığı anlamına gelir.


TypeFront
TypeFont web yazı tiplerine biraz farklı yaklaşıyor. Web uyumlu yazı kütüphanesi sunmak yerine, web uyumlu bir lisans taşıyan kendi yazı tiplerini yüklemenizi sağlar. Kullanmak istediğiniz yazı tipleri şu anda diğer web yazı tipi hizmetlerinden herhangi biri tarafından sunulmuyorsa, bu harika bir seçenektir. Düşük trafikli sitelerin yanı sıra ücretli planlar için ücretsiz bir plan var.


Typotheque Web Yazı Tipleri
Typotheque, fontlarını @ font-face uygulamalarında kullanabilmek için kendi web font hizmetini sunar. Bunun avantajı, hem baskı hem de web uygulamalarını kapsayabilecek tek seferlik bir lisans maliyeti olmasıdır. Olumsuz yanı, seçim sadece yazı tipleriyle sınırlı olmasıdır.

Tipografi Kaynakları ve Makaleler

Web'e Uygulanan Tipografik Stilin Unsurları
Bu sadece iyi web tipografinin temellerini değil, aynı zamanda daha ileri teknik ve prensipleri öğrenmek isteyen herkes için çok kapsamlı bir referans kılavuzdur. Yatay ve dikey hareket, bloklar ve paragraflar, sayfalama, boyut ve çok daha fazlası dahil olmak üzere bölümlere ve alt bölümlere ayrılmıştır. Devam eden bir çalışma, bu yüzden gelecekte ortaya çıkacak daha fazla bilgi bekliyoruz.


Güzel Web Türü
Güzel Web Türü, web tipografi uygulaması hakkında bilgi sahibidir. Web tipografi ile başlayıp CSS @ font-yüzünü kullanmaya kadar her şey hakkında “notlar” oluşturuyorlar. Ayrıca eğilimleri ve yeni fikirleri düzenli olarak tartışıyorlar ve orada en iyi yazı tiplerini düşündükleri bir sayfaya ayrılmışlar.


12 Paragraf Tipografisi örnekleri
Jon Tan'ın bu örnek paragraf formatı koleksiyonu, metin yoğun bir site tasarlayan herkes için harika bir başlangıç ​​noktasıdır. Birçok tasarımcı, paragraf stiliyle gelen tüm olasılıkları gözden kaçırır ve daha geleneksel, muhafazakar seçenekleri tercih eder. Bu makale, kutunun dışına çıkmanın ve tasarımlarınızdaki paragraflarla ilginç bir şey yapmanın zor olmadığını kanıtlıyor.


Tipografik Kontrast ve Akış
WebDesignerWall'dan web tipografisinde akış ve kontrast ilkeleri hakkında harika bir rehber. Bu prensipleri boyut, yazı tipi / sınıflandırma, renk ve ağırlık gibi çeşitli bölümlere ayırır.


Düzeltilmiş Yazı Tipi Yığını
Bu makalede, yaygın olarak kullanılan diğer yazı tiplerini keşfederek ortak web güvenli CSS yazı tipi yığınlarını genişletme anlatılmaktadır. Ayrıca, bazı popüler web sitelerinin font yığınlarını ve bunların yığınlarını nasıl geliştirebileceklerine ilişkin önerileri de araştırıyor.


Web Tipografisinde
Jason Santa Maria'nın A List'de yer alan bu makalesi, web sitesi tasarımlarınızdaki eşleme yazı tiplerine çok kapsamlı bir bakış niteliğindedir. Çok sık tartışılmayan, ancak web üzerinde harika tipografik tasarımlar oluşturmak için çok önemli bir konu.


Türü ile Düşünmek
Type ile düşünmek, Ellen Lupton tarafından aynı başlıktaki kitabın arkadaşıdır. Tipografi hakkında birçok temel bilgi sunar. Birçoğu baskı tipografisine odaklanmış olsa da, web tipografisine çok sayıda bilgi eklenebilir.


Web Tipografinizi Geliştirmek İçin 10 Mükemmel İpucu
Web sitenizin tasarımlarında tipografiyi geliştirmek için yapabileceğiniz on basit şeyin listesi. Yazı tipi, boyut, ölçek ve hiyerarşi, önde gelen ve daha fazlası hakkında bilgi içerir.

Tipografi İlham, Eğilimler ve Haberler

Typophile
Typophile, yazı karakteri meraklıları ve tipograflar için bir forumdur. Tipografi dünyasında neler olup bittiğini öğrenmek istiyorsanız, Typophile bakmak için harika bir yerdir. Ayrıca tipografi ile ilgili sorunlarınızda yardım almak için iyi bir yer.


Tipografiyi severim
ILT tamamen tipografiye ayrılmış bir blog. Hem tasarım hem de iş konularını profesyonel bir bakış açısıyla tartışır. Arşivleri çok büyük, bu nedenle sizi meşgul edecek güncel ve geçmiş haberler ve trendler hakkında bol miktarda bilgi var.


tipografiyi seviyoruz
WLT tipografi, yazı, tabela ve diğer tip bir galeridir. Kullanıcılar sevdikleri tipte görüntüler gönderebilir ve bir sonraki projeniz için tipografi ilham almak için harika bir yerdir.


Başlıklar için tipografi
Tasarımın Unsurları 120'den fazla başlık tipografisi örneği içeren harika bir galeriye sahiptir. Gamutu, çeşitli yazı karakterleri ve stillerinde basitten karmaşıklığa doğru çalıştırırlar. Biraz ilham almak için gitmek için mükemmel bir yer. Onlar da bir galeri var çekme teklifleri 20'den fazla örnekle.


Typographica
Typographica, tip yorumları, yorum ve tipografi kitabı incelemeleri sunuyor. İyi bir yazı karakteri sağlayan şeyleri öğrenmek istiyorsanız, onların tür yorumları özellikle bilgilendiricidir.


Nefis Web Tipografisinin Sahnelerinin Arkası
Bu aslında beş bölümlük bir dizide ilk. Bu yazı, A List Apart'ın arkasındaki tipografiye bakmakta, sitenin farklı bölümleri için kullanılan yazı tiplerini ve stilleri kırmaktadır. Sonraki mesajlar şunlara bakar: Jesús RodrÃguez Velasco , Jon Tan , Designr.it , ve Codex Transportica .


Typesites
Typesites, düzenli olarak büyük web tipografi tasarımlarını sergileyen bir blog. Öne sürdüğü siteler çeşitlidir, ancak hepsi ilham kaynağı türünü içerir.

Webdesigner Deposu için özel olarak derlenmiş Cameron Chapman