Web yazı tipi paketi oluştur
WOFF2 dosyaları, CSS ve HTML önizlemesi oluşturmak için TTF, OTF, WOFF veya WOFF2 yazı tiplerini seçin. Web sitesine eklemeden önce örnek metni, CSS adını, kalınlığı, stili ve yükleme sırasındaki görüntüyü kontrol edin; ardından paketi ZIP olarak kaydedin. Karakter alt kümesi oluşturulmaz.
Yapabilecekleriniz
Web için dosyaları paketleyin
TTF, OTF, WOFF veya WOFF2 biçimlerinden WOFF2, CSS ve HTML önizlemesi oluşturun. Birden fazla yazı tipini birlikte seçebilirsiniz.
Glifleri ve CSS ayarlarını kontrol edin
Dönüştürülen yazı tiplerinin görünümünü kontrol edin. Web'de kullanılan adları, kalınlıkları ve stilleri ve yüklenirken görüntüleme biçimini gerektiği gibi değiştirebilirsiniz.
Seti ZIP olarak paylaşın
Fonts klasörünü, fonts.css dosyasını ve preview.html dosyasını bir set olarak kaydedin. Göreli konumlarını koruyarak kullanın.
Nasıl kullanılır
Yazı tiplerini birlikte seçin
Web'de kullanabileceğiniz yazı tiplerini seçin. Birden fazla yazı tipi kullanacaksanız hepsini birlikte seçin.
Görünümü ve web ayarlarını kontrol edin
Önizleme metni girip her yazı tipini kontrol edin. Adını, kalınlığını veya diğer seçeneklerini ayarlamak için o yazı tipinin CSS ayarlarını açın.
Paketi oluşturup ZIP'i kaydedin
“Web yazı tipi paketi oluştur” seçeneğine tıklayın ve oluşturulan webfont-kit.zip dosyasını kaydedin.
Dosyaları çıkarıp web sayfasına ekleyin
Fonts klasörünün, fonts.css dosyasının ve preview.html dosyasının konumlarını koruyarak dosyaları çıkarın. CSS'yi yazı tiplerini kullanacağınız sayfaya ekleyin ve belirtilen yazı tipi adlarını kullanın.
Ne zaman kullanışlıdır
Bir web sitesini yayıma hazırlayın
Entegrasyon için gereken dosyaları hazırlamak üzere yazı tiplerinizi web biçimlerinde ve CSS ile paketleyin.
Tam seti üretim ekibine teslim edin
Normal ve kalın gibi birden fazla yazı tipini, kontrol metni içeren HTML ile birlikte paketleyip teslim edin.
Yazı tipleri ve CSS birlikte nasıl çalışır
WOFF2 web için bir yazı tipi biçimidir
Özgün karakterleri içeren WOFF2 hazırlayın. Karakter alt kümesi oluşturulmaz. Dosya boyutu yazı tipine göre değişir.
Adları, kalınlıkları ve stilleri CSS'de kaydedin
Bu ayarlar, web'de istenen stillerin hangilerinde bu yazı tipinin kullanılacağını belirler. Yazı tipi gliflerini kalın veya italik hale getirmez.
Aynı adı kalınlık ve stille ayırt edin
Normal ve kalın stiller aynı adı kullanabilir; ancak ad, kalınlık ve stil birleşimi yinelenemez.
Yükleme sırasındaki görüntülemeyi seçin
Varsayılan olarak önce yedek yazı tipi görüntülenir, yazı tipi hazır olduğunda ona geçilir. Gerekirse bekleme ve geçiş davranışını CSS ayarlarından değiştirebilirsiniz.
Göreli dosya konumlarını koruyun
fonts.css, fonts/font-1.woff2 gibi dosyalara başvurur. Klasörü veya CSS dosyasını taşırsanız başvuru yollarını buna göre ayarlayın.
Sıkça sorulan sorular
Oluşturulan dosyaları nereye yerleştirmeliyim?
ZIP'i çıkarın; fonts klasörünü, fonts.css dosyasını ve preview.html dosyasını göreli konumları korunacak şekilde yerleştirin. Sayfanızdan fonts.css dosyasını yükleyin ve CSS'de belirtilen yazı tipi adını kullanın.
Bu, yalnızca biçim dönüştürmeden nasıl farklıdır?
Bu ekran WOFF2 dosyalarını CSS ve HTML önizlemesiyle birlikte paketler. Yalnızca yazı tipi biçimini değiştirmek istiyorsanız “Yazı tipi biçimi dönüştürücü” aracını kullanın.
Yalnızca kullandığım karakterleri tutabilir miyim?
Bu ekran karakter alt kümesi oluşturmaz. Özgün karakterleri koruyan yazı tiplerini hazırlar.
Kalınlığı değiştirmek karakterleri daha kalın yapar mı?
Bu ayar, CSS'de kullanılan kalınlık değerini belirtir. Yazı tipi dosyasındaki glifleri değiştirmez. Kalın veya italik kullanmak için bu glifleri içeren bir dosya sağlayın.
Aynı yazı tipi adıyla birden fazla dosya kullanabilir miyim?
Farklı kalınlık veya stillerde dosyalar kaydedebilirsiniz. Ad, kalınlık ve stil birleşimi yineleniyorsa ilgili ayarları gözden geçirin.
Yazı tiplerini yeniden seçtiğimde ne olur?
Geçerli yazı tipi kümesi ve oluşturulan ZIP kaldırılır, ardından yeni seçilen küme yüklenir. Yenileriyle birlikte kullanmaya devam etmek istediğiniz dosyaları yeniden seçin.
Örnek karakterlerin tümü görüntülenmiyorsa ne olur?
Yazı tipinde bulunmayan karakterler başka bir yazı tipi kullanılarak gösterilebilir. Desteklenen karakterleri ve yazı tipinin kullanılacağı yerde nasıl göründüklerini kontrol edin.
Bir yazı tipi yüklenemezse ne olur?
Desteklenen biçimdeki yazı tiplerini yeniden seçin. Kümedeki herhangi bir dosya dönüştürülemez veya yüklenemezse kısmen başarılı bir küme kaydedilmez.
Girdi ve sonuçlar
- Girdi
- TTF, OTF, WOFF ve WOFF2. Birden fazla dosyayı birlikte seçebilirsiniz.
- Koşullar
- Web'e gömme dahil, girdi yazı tiplerinin kullanım koşullarını kontrol edin.
- Ayarlar
- CSS'de kullanılan adlar, kalınlıklar, stiller ve yükleme sırasındaki görüntüleme.
- Çıktı
- webfont-kit.zip. WOFF2, fonts.css ve preview.html içerir.