Sistem yazı tiplerini indirin. Sistem yazı tipleri, bağlantı. Sistem, standart, güvenli yazı tipleri

Harici
Bu liste, mevcut tüm Windows işletim sistemlerinde (aslında Windows 98'den beri) ortak olan yazı tiplerini ve bunların Mac OS'taki eşdeğerlerini içerir. Bu tür yazı tiplerine bazen "tarayıcı için güvenli yazı tipleri" adı verilir ( tarayıcı güvenli yazı tipleri). Bu, Web sayfaları yaparken kullandığım küçük bir referans kitabıdır ve sizin için de faydalı olacağını düşünüyorum.

Web tasarımında yeniyseniz şöyle bir şey düşünüyor olabilirsiniz: “Neden bu kadar küçük bir yazı tipi grubuyla sınırlı olayım ki? Çok güzel yazı tiplerinden oluşan geniş bir koleksiyonum var!” Gerçek şu ki, ziyaretçinin tarayıcısı yalnızca yüklü olan yazı tiplerini görüntüleyebilir onun içinde işletim sistemi ( yaklaşık. çevirmen:Şu anda, CSS 3'ü ve onun yeni özelliğini kullanarak sayfaları tasarlarken neredeyse tüm yazı tiplerini kullanmak zaten mümkün. @yazı tipi yüzü; ancak tüm tarayıcılar henüz bu işlevi desteklememektedir), bu da şu anlama gelir: Her sayfanıza gelen ziyaretçinin seçmiş olduğunuz yazı tiplerinin sahibi olması gerekmektedir. Bu nedenle yalnızca her işletim sisteminde bulunan yazı tiplerini kullanmalısınız. Neyse ki CSS'nin bir özelliği var @font ailesi bu da bu görevi kolaylaştırır.

Liste

@font-ailesi anlamı pencereler Mac Aile
Arial, Helvetica, sans-serif Arial Arial, Helvetica sans Serif
"Arial Black", Gadget, sans-serif Arial Siyah Arial Siyah, Gadget sans Serif
"Comic Sans MS", el yazısı Komik Sans MS Komik Sans MS 5 el yazısı
"Yeni Kurye", Kurye, tek aralıklı Kurye Yeni Kurye Yeni, Kurye 6 tek aralıklı
Gürcistan, Serif Gürcistan 1 Gürcistan serif
Etki, Kömür, sans-serif Darbe Etki 5, Kömür 6 sans Serif
"Lucida Konsolu", Monako, tek uzay Lucida Konsolu Monako 5 tek aralıklı
"Lucida Sans Unicode", "Lucida Grande", sans-serif Lucida Sans Unicode Lucida Grande sans Serif
"Palatino Linotype", "Book Antiqua", Palatino, serif Palatino Linotype, Kitap Antiqua 3 Palatino 6 serif
Tahoma, Cenevre, sans-serif Tahoma Cenevre sans Serif
"Times New Roman", Times, serif Times New Roman Zamanlar serif
"Trebuchet MS", Helvetica, sans-serif Mancınık MS 1 Helvetika sans Serif
Verdana, Cenevre, sans-serif Verdana Verdana, Cenevre sans Serif
Sembol Sembol 2 Sembol 2 -
Webdings Ağlar 2 Ağlar 2 -
Wingdings, "Zapf Dingbats" Kanat Kanatları 2 Zapf Dingbats 2 -
"MS Sans Serif", Cenevre, sans-serif MS Sans Serif 4 Cenevre sans Serif
"MS Serif", "New York", serif MS Serif 4 New York 6 serif

1 Georgia ve Trebuchet MS yazı tipleri, Windows 2000/XP ile birlikte gelir ve IE yazı tipi paketine dahil edilir (ve aslında birçok Microsoft uygulamasıyla birlikte gelir), dolayısıyla birçok Windows 98 bilgisayarına yüklenir.

2 Sembol yazı tipleri yalnızca Internet Explorer'da görüntülenir; diğer tarayıcılarda genellikle standart bir yazı tipiyle değiştirilirler (örneğin, Sembol yazı tipi Opera'da ve Webdings Safari'de görüntülenir).

3 Book Antiqua yazı tipi Palatino Linotype ile neredeyse aynıdır; Palatino Linotype, Windows 2000/XP ile birlikte gelir ve Book Antiqua, Windows 98 ile birlikte gelir.

4 Lütfen bu yazı tiplerinin TrueType değil, bitmap olduğunu ve bu nedenle bazı boyutlarda kötü görünebileceğini unutmayın (bunlar 96 DPI'da 8, 10, 12, 14, 18 ve 24 pt'de görüntülenecek şekilde tasarlanmıştır).

5 Bu yazı tipleri yalnızca Safari'de standart tarzda çalışır, ancak kalın veya italik olarak çalışmaz. Comic Sans MS de kalın harflerle çalışır ancak italik harflerle çalışmaz. Diğer Mac tarayıcıları eksik yazı tipi özelliklerini kendi başlarına taklit etmekte başarılı görünüyor (ipucu için Christian Fecteau'ya teşekkürler).

6 Bu yazı tipleri Mac'e yalnızca Klasik yüklemeyle yüklenir

Ekran görüntüleri

  • Mac OS X 10.4.8, Firefox 2.0, ClearType etkin (ekran görüntüsü için Juris Vecvanags'a teşekkürler)
  • Mac OS X 10.4.4, Firefox 1.5, ClearType etkin
  • Mac OS X 10.4.11, Safari 3.0.4, ClearType etkin (ekran görüntüsü için Nolan Gladius'a teşekkürler)
  • Mac OS X 10.4.4, Safari 2.0.3, ClearType etkin (ekran görüntüsü için Eric Zavesky'ye teşekkürler)
  • Windows Vista, Internet Explorer 7, ClearType etkin
  • Windows Vista, Firefox 2.0, ClearType etkin (ekran görüntüsü için Michiel Bijl'e teşekkürler)

Web tasarımının ana görevlerinden biri doğru seçimi yapmaktır. standart yazı tipleri. Google Web Fonts veya Typekit gibi yazı tipi yerleştirme hizmetleri, yeni bir şey sağlama hedefiyle alternatif olarak oluşturuldu.

Kullanımı çok kolaydır. Örnek olarak Google Web Yazı Tiplerini ele alalım.

Open Sans, Droid Serif veya Lato yazı tipini seçin. Kodu yazın ve öğeye yapıştırın HTML belgesi. CSS'de buna referans vermeye hazırsınız! Tüm süreç 60 saniyeden fazla sürmedi. Ve her şey tamamen ücretsizdir.

Yanlış olan ne olabilir?

Bazı yazı tipleri herkes tarafından kullanılamayabilir. Bu da sorunların olabileceği anlamına geliyor. Site için güzel bir yazı tipi seçtiğiniz için mutlusunuz, ancak web sayfasını ziyaret eden kişi bunun yerine çirkin bir yazı görüyor.

Bir yedekleme seçeneği uygularsanız bu gerçekleşmeyecektir.

Güvenli web yazı tiplerini kullanmak ne kadar önemlidir?

Her cihazın önceden yüklenmiş kendi yazı tipi seti vardır. Hangisi işletim sistemine bağlıdır. Sorun şu ki aralarında küçük farklılıklar var.

Peki ya web siteleri? Bunun gibi? Gördüğünüz yazı tipi, site için orijinal olarak belirtilen yazı tipi olmayabilir.

Bu ne anlama geliyor? Tasarımcının site için bazı ücretli yazı tipi ailesini seçtiğini varsayalım. Eğer bunları yüklemediyseniz ve özel bir web servisi tarafından sağlanmıyorsa, gördüğünüz yazı tipi standart seçeneklerden biridir. Mesela Times New Roman.

Bu nedenle ekranınızdaki metin çok kötü görünebilir.

Ve burada site için standart yazı tipleri tüm işletim sistemlerinde mevcuttur. Bu, Windows, Mac, Google'ın yanı sıra Unix ve Linux'ta kullanılabilen küçük bir koleksiyondur.

Bu seçimin yardımıyla tasarımcıların yanı sıra web sitesi sahipleri de hangi yazı tipinin yedek yazı tipi olarak kullanılması gerektiğini belirleyebilir. Bu size sayfanın farklı cihazlarda nasıl görüneceğini kontrol etme yeteneği verir.

Geri dönüş seçeneği olarak geliştirici, orijinaline çok benzeyen bir yazı tipi seçer ve kullanıcıya bu yazı tipi gösterilir.

En popüler olanlardan bir seçkiye göz atalım standart yazı tipleri HTML.

En İyi 15 Web Güvenli Yazı Tipi

  1. Arial

Çoğu durumda standart olarak kabul edilir. En yaygın yazı tipi " sans Serif"veya sans serif yazı tipleri ( harflerin sonunda serif bulunmayanlar). Genellikle Windows'ta diğer karakterleri değiştirmek için kullanılır.

  1. Helvetika

Helvetica tasarımcılar için cankurtarandır. Bu standart web yazı tipi neredeyse her zaman çalışır ( en azından diğer yazı tipleri için bir güvenlik ağı olarak).

  1. Times New Roman

Arial'ın sans serif yazı tipleri için yaptığı gibi serif yazı tipleri için aynı rolü görür. Bu en popüler olanlardan biridir Windows cihazları. Bu eski Times yazı tipinin güncellenmiş bir sürümüdür.

  1. Zamanlar

CSS standart yazı tipi The Times çoğu kişiye tanıdık geliyor. Birçok kişi onu eski gazetelerin dar sütunlarındaki küçük harflerle hatırlıyor. Gelenek haline gelmiş en yaygın baskı türüdür.

  1. Kurye Yeni

Times New Roman'a benzer ve eski klasiklerin bir çeşidi olarak kullanılır. Aynı zamanda tek aralıklı bir yazı tipi olarak kabul edilir. Serif ve sans serif yazı tiplerinin aksine, tüm karakterleri aynı genişliğe sahiptir.

  1. Kurye

Hemen hemen tüm cihazlarda ve işletim sistemlerinde yedek olarak kullanılan eski, sabit genişlikli bir yazı tipi.

  1. Verdana

Verdana haklı olarak gerçek bir web yazı tipi olarak kabul edilebilir ( gerçek web yazı tipi) serif görevi gören basit çizgiler ve büyük boyut sayesinde. Harfleri biraz uzun olduğundan ekranda okunması kolaydır.

  1. Gürcistan

Standart web yazı tipi Georgia, şekil ve boyut olarak Verdana yazı tipine benzer. Karakterleri aynı boyuttaki diğer yazı tiplerinden daha büyüktür. Ancak bunu başkalarıyla birlikte kullanmamak daha iyidir. Aynı Times New Roman, kıyaslandığında bir cüceye benziyor.

  1. Palatino

Palatino'nun tarihi Rönesans dönemine kadar uzanmaktadır. Şaka yok. Bu, web için mükemmel olan başka bir büyük yazı tipidir. Genellikle manşetlerde ve reklamlarda kullanılır.

  1. Garamond

16. yüzyılda Paris'te ortaya çıkan bir başka eski yazı tipi. Yeni ve geliştirilmiş sürümü çoğu Windows cihazında standart olarak gelir. Daha sonra bu yazı tipi diğer işletim sistemleri tarafından da benimsendi.

  1. Bahisçi

Kitapçı ( veya Bookman Eski Stil) - biri en iyi standart yazı tipleri başlıklar için. Karakteristik özelliği, küçük boyutlu kullanıldığında bile okunabilir olmasıdır.

  1. Komik Sans MS

Comic Sans MS, serif yazı tiplerine eğlenceli bir alternatiftir.

  1. Trebuchet MS

Bu, orijinal olarak Microsoft tarafından doksanlı yılların ortalarında geliştirilen, ortaçağ temalı bir yazı tipidir. Windows XP'de kullanıldı. Günümüzde ana metnin oluşturulmasında kullanılmaktadır.

Bu yazıda Windows 7'de yazı tiplerinin hatalı görüntülenmesi sorununa çözümümü paylaşacağım. tüm standart yazı tiplerinin restorasyonuWindows 7. Sorunun arka planı şu: Geçenlerde bir grafik editöründe kullanmak için yeni orijinal fontlar arıyordum, bir sürü indirdim ama sonra farkettim ki, sisteme yeni bir font eklendiğinde, eğer varsa. eşleşirse, orijinal yazı tipi yenisiyle değiştirilir (windows 7'de yazı tiplerinin nasıl kurulacağına ilişkin talimatlar). Bu aktivite sonucunda sistem panellerinin ve uygulamaların yarısında bana yabancı dillerde konuşulduğu için çalışmak imkansız hale geldi :).

" için hızlı bir Google araması sistem yazı tiplerini geri yükleWindows 7" Ve " için standart yazı tipleriWindows 7", pek sonuç vermedi, önerilen çözümler fkb'ye yardımcı olmadı (doğal olarak sistemi yeniden kurmak bana yakışmadı). Bu nedenle, kendi yoluma gitmeye karar verdim ve başlangıçta, orijinal yazı tiplerini bilinen normal bir sistemden kopyaladım (yazı tiplerinin dizinde saklandığını hatırlatmama izin verin). %windir%\fonts) ve sistemimdeki yazı tiplerini bunlarla değiştirdim. Çözüm yalnızca kısmen yardımcı oldu, sistemde çalışmak mümkün hale geldi, yerel Kiril karakterlerim ortaya çıktı, ancak yazı tipi parametreleri arzulanan çok şey bıraktı. İlk olarak, bazı yazı tiplerinin boyutları değişti veya yazıları artık orijinaline uymuyor veya bazı nedenlerden dolayı yazı tipi kalınlaştı.

Ancak bu sorunun üstesinden nasıl gelebileceğimi bulmayı başardım. Bunu yapmak için, Windows 7'de standart yazı tipleri için ilişkileri geri yüklemenize olanak tanıyan, aşağıda ekli dosyayı indiren kayıt defterindeki yazı tipi ayarlarını sıfırlamanız gerekir. İndirebilirsiniz:

Bu dosya, kayıt defteri kovanının dışa aktarılan içeriğini temsil eder HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Fonts Win 7'de. Bu .reg dosyasını uyguladıktan sonra sistemin yeniden başlatılması gerekiyor, bakın! Yazı tipleriyle ilgili sorun ortadan kalkmalı!

Onlar. Windows 7'de standart sistem yazı tiplerini geri yüklememe yardımcı olan sıra şuydu:

  • %windir%\fonts dizinindeki yazı tiplerini “temiz” sistemdeki yazı tipleriyle değiştirmek
  • kayıt şubesini dışa aktar HLM\SOFTWARE\Microsoft\Windows NT\CurrentVersion\Fonts

Umarım yazı tipleriniz de çöktüyse bu çözüm size de yardımcı olacaktır. Her durumda, durumunuza yardımcı olan alternatif bir yöntem bulursanız, yorumlarınızı paylaşmaktan çekinmeyin. Teorik olarak talimatlar, istenen yazı tipinin yanlışlıkla silindiği ve bulunup geri kopyalandıktan sonra aksaklıkların kaybolmadığı durumlarda da uygundur.

PS. Elinizde temiz Windows 7 yoksa, standart yazı tiplerini içeren arşivi buradan indirebilirsiniz: http://narod.ru/disk/52061075001.99f42303cf1a0ac70dc978dd20406657/original_fonts.zip.html, arşiv boyutu yaklaşık 350 MB'tır.

Bir düzen oluşturmaya başladığınızda, sayfada kullanılan yazı tiplerini CSS'de özel olarak belirtmeniz gerekir. Tasarımcı genellikle sayfanın ana metnini değil aynı zamanda çeşitli başlıkları, logoları ve monogramları da farklı yazı tipleriyle yazar:

İyi bir tasarımcı, tıpkı iyi bir düzen tasarımcısı gibi, tarayıcının bir sayfayı görüntülemek için yalnızca kullanıcının bilgisayarında yüklü olan yazı tiplerini kullanabileceğini bilir. Yani yazı tipleri iki kategoriye ayrılabilir:

  1. Kullanıcıların büyük çoğunluğu tarafından sorunsuz bir şekilde görüntülenecek yazı tipleri.
  2. Oldukça büyük bir kullanıcı grubunun sahip olmadığı yazı tipleri.

Tasarımcı, örneğin bir logo veya büyük statik başlıklar oluşturmak için ikinci kategorideki yazı tiplerini kullanmışsa, bu tekniği kullanmakta tereddüt edemezsiniz. Bu tekniği kullanmanın dezavantajı esnek olmamasıdır. Metinde değişiklikler varsa, görüntüyü yeniden yapmanız ve CSS'yi değiştirmeniz gerekecektir (örneğin, yeni görüntünün boyutları eskisiyle eşleşmiyorsa).

Bir tekniği kullanmanın tehlikesinin doğrudan metnin değiştirilme ihtimaline bağlı olduğunu söyleyebiliriz. Bu nedenle örneğin bir sayfanın genel metni standart olmayan yazı tipleriyle yazılamaz! Yetenekli bir tasarımcı bunu asla yapmaz. Ve eğer tasarımcı yeşil bir yazı tipiyle karşılaşırsa, iyi bir düzen tasarımcısının hatasını düzeltmesi gerekir - düzende bu yazı tipini en benzer standart yazı tipiyle değiştirin.

Ancak birinci grubun yazı tiplerini ikinciden nasıl ayırt edebiliriz? Doğrudan bilgisayarınıza yüklenen bir dizi yazı tipine güvenemeyeceğiniz açıktır! Hadi çözelim.

Standart yazı tipleri

Standart yazı tipleri, işletim sistemiyle birlikte yüklenen bir dizi yazı tipidir. İşletim sistemleri farklı olduğundan yazı tipleri de farklıdır. Windows'un farklı sürümleri için standart yazı tiplerinin bir listesini, örneğin Standart Windows yazı tipleri makalesinde ve standart Mac OS yazı tiplerinin bir listesini Mac OS'de bulunan Yazı Tipleri sayfasında bulabilirsiniz. Unix/Linux işletim sistemlerinde tek bir yazı tipi kümesi yoktur. Birçok Linux kullanıcısı DejaVu yazı tipi setini kullanır, özellikle de varsayılan olarak yükledikleri Ubuntu'da. http://www.codestyle.org'daki istatistiklere göre, birçok Unix/Linux kullanıcısı aynı zamanda URW, Free ve diğer yazı tipi setlerini de yüklüyor. Aynı istatistiklere göre, Unix/Linux kullanıcılarının %60'ından fazlasının bilgisayarında, 2002 yılına kadar resmi olarak Microsoft web sitesinden ücretsiz olarak indirilebilen Web için Çekirdek yazı tiplerinden yazı tipleri bulunmaktadır.

Sayfanın herhangi bir işletim sisteminde tasarımcının amaçladığı gibi görüntülenmesi için CSS özelliğinde virgüllerle ayrılmış birkaç yazı tipi belirtmek mümkündür.

Bu özellik, yazı tipi ailesi adlarının ve/veya genel aile adlarının önceliklendirilmiş bir listesini belirtir. CSS2 spesifikasyonuna göre iki tür yazı tipi ailesi adı vardır:

  1. Seçtiğiniz yazı tipi ailesi adı. Örneğin, "Times new Roman", "Arial" ve diğerleri. Boşluk içeren yazı tipi ailesi adları tırnak işaretleri içine alınmalıdır. Tırnak işaretleri eksikse, yazı tipi adından önceki ve sonraki boşluk karakterleri dikkate alınmaz ve yazı tipi adı içindeki boşluk dizisi tek bir boşluğa dönüştürülür.
  2. Genel (ortak) aile. Spesifikasyon aşağıdaki genel aileleri tanımlar:
    • serif - sonunda serif bulunan yazı tipleri;
    • sans-serif - sans-serif yazı tipleri;
    • el yazısı - italik yazı tipleri;
    • fantezi - dekoratif yazı tipleri;
    • tek aralıklı - tek aralıklı yazı tipi (aynı genişlikte harflerle).
    Klan aile adları anahtar kelimelerdir ve tırnak işaretleri içine alınmasına gerek yoktur.

Böylece tasarım için Windows işletim sisteminden standart bir yazı tipi alınır, Mac OS ve Unix/Linux için benzer bir yazı tipi seçilir, ortak bir yazı tipi ailesi belirlenir ve işlem tamamlanır.

Ama bu o kadar basit değil. Daha ayrıntılı olarak inceleyelim.

Web Güvenli Yazı Tiplerini Bulma

İnternette “güvenli” Web yazı tipleri kavramı tarihsel olarak gelişmiştir. Güvenli yazı tipi, tüm işletim sistemlerinde standart olan bir yazı tipidir. Böyle bir durumu ancak hayal edebileceğimize göre, o zaman Kesinlikle güvenli yazı tipleri yoktur!

Bazı yazı tipleri bazı çekincelerle güvenli olarak adlandırılabilir.

"Güvenli" yazı tiplerini tanımlamanın temeli, diğer işletim sistemlerinde de kullanılan en yaygın Windows işletim sisteminin yazı tipleriydi. Bu tür kullanıma bir örnek, istatistiklere göre birçok Unix/Linux kullanıcısı tarafından indirilen Web yazı tipi paketi için daha önce bahsedilen Çekirdek yazı tipleridir.

Bu paket şu yazı tiplerini içerir: Andale Mono, Arial Black, Arial, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, Webdings. Hepsi Runet için önemli olan Kiril alfabesini destekliyor.

Mac OS X ile standart olarak gelen yazı tipleri seti (bu işletim sistemi, Mac OS kullanıcıları arasında en yaygın kullanılanıdır), Web seti için Çekirdek yazı tiplerinin tüm yazı tiplerini içerir.

Böylece, diğer işletim sistemlerinde kullanılan Windows yazı tiplerine dayanarak, "güvenli" Web yazı tipleri olarak adlandırılan aşağıdaki liste oluşturuldu:

  • Arial
  • Arial Siyah
  • Komik Sans MS
  • Kurye Yeni
  • Gürcistan
  • Darbe
  • Times New Roman
  • Trebuchet MS
  • Verdana

Webdings yazı tipi simgeler içerir ve içerik için kullanılamaz. Andale Mono, günlük ekran okuma için pek uygun olmadığından ve tüm Windows kullanıcılarında bulunmadığından yaygın olarak kullanılmamaktadır.

Her Windows, Mac OS X kullanıcısı ve Unix/Linux kullanıcılarının büyük çoğunluğu (yani Web paketi için Core yazı tiplerini yükleyenler) bu yazı tiplerinin tümüne sahiptir.

Peki ya geri kalanı? Sonuçta tasarımcının planının mümkün olduğu kadar çok kullanıcı tarafından görülmesini istiyorsunuz!

Bu konuyu yayının ikinci bölümünde okuyun.

Yazı tipleri, bir web sitesinin tasarımının ayrılmaz ve çok önemli bir parçasıdır ve bireyselliğini vurgular. Makale standart yazı tiplerini bir web sayfasına bağlamaktan bahsedecek, bunlara sistem yazı tipleri de denir.

Sistem, standart, güvenli yazı tipleri

Herhangi bir tarayıcı yalnızca bilgisayarın işletim sisteminde bulunan yazı tiplerini görüntüler. Bu nedenle bunlara sistem olanları denir ve varsayılan olarak işletim sistemiyle birlikte yüklenirler.

Çoğu web sitesi ziyaretçisinin tarayıcısında görüntülenme olasılıkları yüksek olduğundan bunlara güvenli yazı tipleri denir.

Ancak sorun, farklı işletim sistemlerinde farklı yazı tipi kümelerinin kurulu olmasıdır. Sağlanan yazı tipi setlerini işletim sistemiyle birlikte Windows ve Mac OS'nin resmi sayfalarında görüntüleyebilirsiniz. Ve Unix/Linux'ta hiçbir standart seti yoktur.

İnternet sayfasının tasarımcının fikrine uygun olarak görüntülenmesi için CSS'ye font-family adı verilen bir font özelliği yüklenmiştir.

yazı tipi ailesi özelliği

Font-family özelliği, belirli özelliklere göre gruplandırılmış font aileleridir.

Genel aileler:
  • serif - sonunda serif bulunan yazı tipleri;
  • sans-serif - sans-serif yazı tipleri;
  • el yazısı - italik yazı tipleri;
  • fantezi - dekoratif yazı tipleri;
  • tek aralıklı - tek aralıklı yazı tipi (aynı genişlikteki harflerle).

Bu şekilde, farklı işletim sistemlerinden benzer fontlar kolayca seçilir ve virgüllerle ayrılarak internet sayfasına bağlanır.

İşte sadece görsel algı için bir örnek. Yazı tiplerini doğrudan bağlamayı düşündüğümüzde bu örneğe daha sonra döneceğiz.

Sadece mantığı takip edin ve her şey netleşecektir.

Body ( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; ) Ne yazıldığını analiz edelim:

  • İşletim Sistemi Windows - Arial;
  • OC Mac OS - Helvetica CY;
  • OC Unix/Linux - Nimbus Sans L;
  • Genel aile - sans-serif.

Güvenli yazı tipleri olarak adlandırılan

İşletim sistemi Windows'a dayanarak, birkaç güvenli yazı tipinin bir listesi derlenmiştir.

  1. Arial
  2. Arial Siyah
  3. Komik Sans MS
  4. Kurye Yeni
  5. Gürcistan
  6. Darbe
  7. Times New Roman
  8. Trebuchet MS
  9. Verdana

Bu yazı tiplerinin tümü Mac OS X, Windows ve Web paketi için Çekirdek yazı tipleri yüklü olan birçok Unix/Linux kullanıcısında yüklüdür.

Diğer kullanıcılar için bir yazışma tablosu sağlanır. Belirli bir aileye ait benzer yazı tiplerini içerir.

Yazı tiplerinin belirli bir aileye yazışmaları ve ait olma tablosu:

pencerelerMac os işletim sistemiUnix/Linuxata ailesi
Arial SiyahHelvetica C.Y.Nimbus Sans LSans Serif
ArialHelvetica C.Y.Nimbus Sans LSans Serif
Komik Sans MSMonako CY* (aşağıya bakınız)el yazısı
Kurye Yeni* (aşağıya bakınız)Nimbus Mono LTek uzay
Gürcistan* (aşağıya bakınız)Yüzyıl Ders Kitabı LSerif
DarbeKömür C.Y.* (aşağıya bakınız)Sans Serif
Times New RomanTimes C.Y.Nimbus Roma No9 LSerif
Trebuchet MSHelvetica C.Y.* (aşağıya bakınız)Sans Serif
VerdanaCenevre C.Y.DejaVu SansSans Serif

* Yazı tiplerini bağlarken ona güvenle güvenebilirsiniz. Tablo Kiril karakterlerini ve Rus alfabesini desteklemektedir.

Sistem yazı tiplerini siteye bağlama

Bağlanmanız gerekiyorsa tüm belgenin ana yazı tipi CSS stil sayfasına aşağıdaki kodu eklemeniz yeterlidir:

Gövde ( /* yazı tipini tüm belgeye bağlayın */ font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* ayrıca yazı tipi boyutunu ayarlayın */ font-size: 16px; / * kalın yazı tipini ayarlayın veya 400 yerine - normal */ font-weight: 400 değerini ayarlayın; )

Bootstrap 4 çerçevesinde sistem yazı tipleri şu şekilde bağlanır: Yazı tipleri mobil cihazlar dikkate alınarak eklenmiştir.

Body ( font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji""Segoe UI Emoji""Segoe UI Sembolü"; )

Başlıklara yazı tipi atama

H1, H2, H3, H4, H5, H6 - işte aynı, sadece başlıkları vurgulamak için kalınlık değerini ayarladık:

H1, h2, h3, h4, h5, h6 ( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* fontu başlıklara bağlayın */ font-weight: 600; / * yazı tipi ağırlığını ayarlayın veya 600 yerine değeri kalın olarak ayarlayın */ )

Yazı tipini yalnızca paragraflara atarız:

p ( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; font-weight: normal; font-size: 16px; ) Satır satır şöyle görünür:
  1. Yazı tipini paragraflara bağlarız; li listelerine, div bloklarına, formlara ve diğer öğelere uygulanabilir;
  2. Yazı tipi ağırlığını ayarlayın veya 600 yerine değeri kalın olarak ayarlayın;
  3. Ayrıca paragrafların yazı tipi boyutunu da ayarlıyoruz.

İle yazı tipini yalnızca belirli bir paragrafa atama, veya blok, önce HTML belgesinde bu bloğa bir sınıf atamanız gerekir:

İşte eklenti yazı tipine sahip bir paragraf

Ve CSS tablosuna aşağıdaki kodu yazın:

Ana yazı tipi ( yazı tipi ailesi: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; yazı tipi ağırlığı: normal; yazı tipi boyutu: 16 piksel; )

Artık, .font sınıfına sahip bir html öğesine (buna ne ad verirseniz verin) her etikete normal (400), kalın ve 16 piksel boyutunda bir Arial yazı tipi atanacaktır.
Benzer şekilde, li listelerine, tablolara, div bloklarının tamamına, tek tek kelimelere veya ifadelere farklı yazı tipleri atayabilirsiniz.

Yazı tiplerini doğrudan bir HTML belgesine bağlama

Yazı tipleri, CSS dosyasıyla aynı şekilde doğrudan bir HTML belgesine eklenir; tek fark sözdizimindedir. Yazı tiplerini belge başlığına - etiketlerin arasına ekleyebilirsiniz (bir CSS dosyasına benzer) veya satır içi - özellikleri doğrudan html etiketlerine atama.

Yazı tiplerini başlığa dahil etme, etiketler arasında . Bunu yapmak için html belgesine aşağıdaki kodu ekleyin:

Her şey CSS dosyasındaki bağlantıya benzer.

Yazı tiplerini satır içi bağlama

Doğrudan site öğelerine. Size birkaç örnek vereyim:

Yazı tipini paragrafa bağlama

İşte metin içeren bir paragraf

Ayrı bir kelimeyi kalın harflerle vurgularız ve ana yazı tipinden ayrı bir yazı tipi atarız

İşte metin içeren bir paragraf ve bu kelime kalın harflerle vurgulanması gereken

Bağlantıyı kalın harflerle vurgularız ve ana yazı tipinden ayrı bir yazı tipi atarız

Bu basit bir metindir. Buradaki bağlantı da basit bir metindir.

Benzer şekilde, herhangi bir html etiketine yazı tipi atadık.

Not - Bootstrap 4'teki sistem yazı tipleri

Ünlü Framework Bootstrap 4'ün geliştiricileri, hemen hemen her cihazın standart sistem yazı tiplerini kullanabilmesi için yazı tiplerini aşağıdaki şekilde bağlar.

Gövde ( yazı tipi ailesi: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Sembolü"; )