Standart şriftlər və onların adları. Windows-un bütün (cari) versiyaları və onların Mac ekvivalentləri üçün ümumi olan şriftlər

Şriftlər veb-sayt dizaynının ayrılmaz və çox vacib hissəsidir və onun fərdiliyini vurğulayır. Məqalədə standart şriftlərin veb səhifəyə qoşulmasından danışılacaq, onlara sistem şriftləri də deyilir və növbəti məqalədə şriftləri seçmək və birləşdirməyə ətraflı baxacağıq. Google Şriftləri WordPress saytına.

Sistem, standart, təhlükəsiz şriftlər

İstənilən brauzer yalnız kompüterin əməliyyat sistemində mövcud olan şriftləri göstərir. Buna görə də onlar sistem adlanır və əməliyyat sistemi ilə birlikdə standart olaraq quraşdırılır.

Və onlar təhlükəsiz şriftlər adlanır, çünki onlar sayt ziyarətçilərinin əksəriyyətinin brauzerində göstərilə bilər.

Ancaq bütün problem müxtəlif əməliyyat sistemlərinin quraşdırılmasıdır müxtəlif dəstlərşriftlər. Siz burada əməliyyat sistemi ilə birlikdə təchiz edilmiş şrift dəstlərinə baxa bilərsiniz rəsmi səhifələr Windows, Mac OS. Ancaq Unix/Linux-da yoxdur standart dəst.

İnternet səhifəsinin dizaynerin ideyasına uyğun nümayişi üçün CSS-də font-family adlı şrift xüsusiyyəti quraşdırılmışdır.

font-ailə mülkiyyəti

Şrift ailəsi xüsusiyyəti müəyyən xüsusiyyətlərə görə qruplaşdırılmış şrift ailələridir.

Ümumi ailələr:

  • serif - uclarında serif olan şriftlər;
  • sans-serif - sans-serif şriftləri;
  • kursiv - kursiv şriftlər;
  • fantaziya - dekorativ şriftlər;
  • monospace - monospace şrift (eyni genişlikdə hərflərlə).

Beləliklə, müxtəlif əməliyyat sistemlərinin oxşar şriftləri sadəcə olaraq seçilir və vergüllə ayrılaraq İnternet səhifəsinə qoşulur.

Budur, yalnız vizual qavrayış üçün bir nümunə. Birbaşa şriftləri birləşdirməyi düşündüyümüz zaman bu nümunəyə daha sonra qayıdacağıq.

Sadəcə məntiqə əməl edin və hər şey aydın olacaq.

Bədən (şrift ailəsi: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; )

Nə yazıldığını görək:

  • ƏS Windows - Arial;
  • OC Mac OS - Helvetica CY;
  • OC Unix/Linux - Nimbus Sans L;
  • Ümumi ailə - sans-serif.

Sözdə təhlükəsiz şriftlər

ƏS Windows əsasında bir neçə təhlükəsiz şriftlərin siyahısı tərtib edilmişdir.

  1. Arial
  2. Arial Qara
  3. Komik Sans MS
  4. Kuryer Yenidir
  5. Gürcüstan
  6. Təsir
  7. Times New Roman
  8. Trebuchet MS
  9. Verdana

Bu şriftlərin hamısı Mac OS X, Windows və bir çox Unix/Linux istifadəçilərində quraşdırılıb və onlar Veb paketi üçün əsas şriftləri quraşdırıblar.

Digər istifadəçilər üçün yazışma cədvəli verilir. Müəyyən bir ailəyə aid oxşar şriftləri ehtiva edir.

Yazışmaların və şriftlərin müəyyən bir ailəyə aid olması cədvəli:

WindowsMacOSUnix/Linuxata-baba ailəsi
Arial QaraHelvetica C.Y.Nimbus Sans LSans-serif
ArialHelvetica C.Y.Nimbus Sans LSans-serif
Komik Sans MSMonako CY* (aşağıya bax)kursiv
Kuryer Yenidir* (aşağıya bax)Nimbus Mono LTək fəza
Gürcüstan* (aşağıya bax)Əsrin məktəb kitabı LSerif
TəsirKömür C.Y.* (aşağıya bax)Sans-serif
Times New RomanTimes C.Y.Nimbus Roman No9 LSerif
Trebuchet MSHelvetica C.Y.* (aşağıya bax)Sans-serif
VerdanaCenevrə C.Y.DejaVu SansSans-serif

* Şriftləri birləşdirərkən, ona etibarlı şəkildə etibar edə bilərsiniz. Cədvəl kiril hərflərini və rus əlifbasını dəstəkləyir.
Bu yazıda cədvəlin özünü götürdüm.

Sistem şriftlərinin sayta qoşulması

Sistem şriftlərini veb saytınıza qoşmağın bir neçə yolu var. Bundan əlavə, qoşula bilərsiniz müxtəlif şriftlər müxtəlif paraqraflara. Fərdi sözlərə və ifadələrə müxtəlif şriftlər tətbiq edin. İndi bütün bunları nəzərdən keçirməyə çalışacağam.
Beləliklə, hər şeyi qaydasında edək.

CSS faylında şriftlərin əlaqələndirilməsi

Əgər qoşulmaq lazımdırsa bütün sənəd üçün əsas şrift, sadəcə stil cədvəlinə aşağıdakı kodu əlavə etməlisiniz:

Bədən ( şrift ailəsi: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* şrifti bütün sənədə birləşdirin */ font-size: 16px; /* əlavə olaraq şrift ölçüsünü təyin edin */ şrift -weight: 400 /* şriftin çəkisini təyin edin və ya 400 əvəzinə dəyəri normal olaraq təyin edin */ )

Başlıqlar üçün şriftin təyin edilməsi H1, H2, H3, H4, H5, H6, (burada eynidir, sadəcə başlıqları vurğulamaq üçün qalın dəyər təyin etdik):

H1,h2,h3,h4,h5,h6( şrift ailəsi: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* şrifti başlıqlara birləşdirin */ şrift çəkisi: 600; / * şrift çəkisini təyin edin və ya 600 əvəzinə dəyəri qalın olaraq təyin edin */ )

Biz yalnız paraqraflara şrift təyin edirik:

P( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* şrifti paraqraflara birləşdirin, li siyahılara tətbiq oluna bilər, div blokları, forma və digər elementlər */ font-weight: normal; /* şriftin çəkisini təyin edin və ya 600 əvəzinə dəyəri qalın olaraq təyin edin */ font-size: 16px; /* əlavə olaraq paraqraflar üçün şrift ölçüsünü təyin edin */ )

Kimə şrifti yalnız müəyyən bir paraqrafa təyin edin, və ya blok üçün əvvəlcə HTML sənədində bu bloka sinif təyin etməlisiniz

Budur fərdi şriftlə paraqraf

Və içində CSS cədvəli aşağıdakı kodu yazın:

Font( font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; /* biz şrifti müəyyən abzaslara bağlayırıq, fərdi li siyahılara, div bloklarına, formalara və digər elementlərə tətbiq edilə bilər */ font-weight: normal /* şrift ölçüsünü təyin edin və ya 600 əvəzinə dəyəri qalın */ font-size: 16px /* əlavə olaraq paraqraflar üçün şrift ölçüsünü təyin edin */ )

İndi hər etiket üçün - html elementi class.font ilə (istədiyiniz kimi adlandırın), şriftə normal (400), çəkisi və ölçüsü 16 piksel olan Arial şrifti təyin ediləcək.
Eynilə, siz li siyahılara, cədvəllərə, bütün div bloklarına, ayrı-ayrı sözlərə və ya ifadələrə müxtəlif şriftlər təyin edə bilərsiniz.

HTML sənədində şriftlərin əlaqələndirilməsi

Şriftlər birbaşa HTML sənədinə CSS faylı kimi daxil edilir, yeganə fərq sintaksisdədir. Şriftləri sənədin başlığına - teqlər arasına daxil edə bilərsiniz (CSS faylına bənzər) və ya daxili - xassələri birbaşa html teqlərinə təyin etmək.

Başlıqdakı şriftlər də daxil olmaqla, etiketlər arasında . Bu məqsədlə ildə html sənədi bu kodu əlavə edin:

Mən burada özümü təkrar etməyəcəyəm. Hər şey CSS faylındakı əlaqəyə bənzəyir.

Şriftlərin daxili qoşulması, birbaşa sayt elementlərinə. Sizə bir neçə nümunə verim:

Şriftin paraqrafa qoşulması

Budur mətni olan bir paraqraf

vurğulayırıq qalın şriftlə ayrı söz və əsasdan ayrı bir şrift təyin edin

Budur mətni olan bir paraqraf və bu söz, qalın hərflərlə vurğulanmalıdır

Budur link

Eynilə, biz istənilən html teqinə şriftlər təyin edirik.

Bununla belə, elementlərə üslub təyin etmək ən yaxşısıdır və tövsiyə olunur CSS faylı. Əvvəlcə CSS-də üslubları yalnız bir dəfə yazmalı və sonra HTML-də yalnız tələb olunan sinfi təyin etməlisiniz. İkincisi, daxili üslubların yazılması ilə dublikat məzmun yaradılır. Bu xassələr və siniflər axtarış motorları tərəfindən indeksləşdirilir və eşitdim ki, W3C inline-ı tamamilə ləğv etmək istəyir. Baxmayaraq ki, bəzən üslubları bu şəkildə yazmaq daha asandır.

Hamısı. Sayt yeniləmələri üçün bizi izləyin, mən qeyri-standart və orijinal şriftləri sayta qoşmaq haqqında məqalə hazırlayıram ki, onlar bütün brauzerlərdə düzgün göstərilsin. Mən də sizi bir neçə ilə tanış edəcəm yaxşı xidmətlər, burada xüsusi şriftləri seçə bilərsiniz.

Layout yaratmağa başladıqda, CSS-də səhifədə istifadə olunan şriftləri xüsusi olaraq göstərməlisiniz. Tez-tez müxtəlif şriftlər dizayner yalnız səhifənin əsas mətnini deyil, həm də müxtəlif başlıqları, loqoları və monoqrammaları yazır.

Yaxşı dizayner, yaxşı tərtibat dizayneri kimi, brauzerin səhifəni göstərmək üçün yalnız istifadəçinin kompüterində quraşdırılmış şriftlərdən istifadə edə biləcəyini bilir. Yəni şriftləri iki kateqoriyaya bölmək olar:

  1. İstifadəçilərin böyük əksəriyyəti tərəfindən problemsiz göstəriləcək şriftlər.
  2. Kifayət qədər malik olduğunuz şriftlər böyük qrup istifadəçilər yoxdur.

Dizayner, məsələn, loqo və ya böyük statik başlıqlar yaratmaq üçün ikinci kateqoriyalı şriftlərdən istifadə edərsə, mətni şəkil ilə əvəz etmək texnikasından istifadə etməkdən çəkinə bilməzsiniz. Bu texnikadan istifadənin dezavantajı çeviklikdir. Mətndə dəyişikliklər olduqda, şəkli yenidən düzəltməli və CSS-i dəyişdirməli olacaqsınız (məsələn, ölçülər yeni şəkil köhnə ilə uyğun gəlməyəcək).

Bir texnikadan istifadənin təhlükəsinin mətnin dəyişdirilməsi ehtimalından birbaşa asılı olduğunu söyləyə bilərik. Buna görə də, məsələn, qeyri-standart şriftlərdə səhifənin ümumi mətnindən istifadə edə bilməzsiniz! Bacarıqlı bir dizayner heç vaxt bunu etməz. Dizayner yaşıl birinə rast gəlsə, yaxşı bir tərtibatçı səhvini düzəltməyə borcludur - onu tərtibatda dəyişdirin. bu şrift standart birinə mümkün qədər oxşardır.

Bəs birinci qrupun şriftlərini ikincidən necə ayırd etmək olar? Aydındır ki, siz birbaşa kompüterinizdə quraşdırılmış şriftlər dəstinə etibar edə bilməzsiniz! Gəlin bunu anlayaq.

Standart şriftlər

Standart şriftlər əməliyyat sistemi ilə quraşdırılmış şriftlər toplusudur. Əməliyyat sistemləri fərqli olduğundan, onların şrift dəsti fərqlidir. Standart şriftlərin siyahısı Windows versiyaları Siz, məsələn, Standart Windows şriftləri məqaləsində və Mac OS-a daxil olan Şriftlər səhifəsində standart Mac OS şriftlərinin siyahısını görə bilərsiniz. Unix/Linux əməliyyat sistemlərinə gəlincə, onların tək şrift dəsti yoxdur. Çox Linux istifadəçiləri DejaVu şrift dəstindən istifadə edin, xüsusən Ubuntu-da onlar standart olaraq quraşdırılıb. http://www.codestyle.org saytından statistik məlumatlara görə, bir çox Unix/Linux istifadəçilərində URW, Free və digər şrift dəstləri quraşdırılıb. Eyni statistikaya görə, Unix/Linux istifadəçilərinin 60%-dən çoxunun kompüterində şriftlər var. Əsas dəst 2002-ci ilə qədər rəsmi olaraq mövcud olan İnternet üçün şriftlər pulsuz yukle Microsoft saytında.

Səhifənin hər hansı bir əməliyyat sistemində nəzərdə tutulmuş dizayner kimi göstərilməsi üçün bunu etmək mümkündür CSS mülkiyyəti font-family vergüllə ayrılmış çoxlu şriftləri təyin edir.

Bu xüsusiyyət şrift soyadlarının və/və ya ümumi ailə adlarının prioritetləşdirilmiş siyahısını müəyyən edir. CSS2 spesifikasiyasına əsasən, şrift soyadlarının iki növü var:

  1. Seçdiyiniz şrift soyadı. Məsələn, “Times new Roman”, “Arial” və s. Boşluqdan ibarət şrift soyadları dırnaq içərisində olmalıdır. Sitatlar yoxdursa, şrift adından əvvəl və sonra hər hansı boşluq simvolu nəzərə alınmır və şrift adındakı boşluqların ardıcıllığı tək boşluğa çevrilir.
  2. Ümumi (ümumi) ailə. Spesifikasiya aşağıdakı ümumi ailələri müəyyənləşdirir:
    • serif - uclarında serif olan şriftlər;
    • sans-serif - sans-serif şriftləri;
    • kursiv - kursiv şriftlər;
    • fantaziya - dekorativ şriftlər;
    • monospace - monospace şrift (eyni genişlikdə hərflərlə).

Ata-baba ailələrinin adları belədir açar sözlər və dırnaq içərisində qeyd edilməli deyil.

Beləliklə, dizayn üçün alırıq standart şrift OS Windows-dan Mac OS və Unix/Linux üçün oxşarı seçin, ümumi şrift ailəsi təyin edin və işiniz bitdi.

Amma bu o qədər də sadə deyil. Gəlin daha ətraflı qazaq.

Veb Təhlükəsiz Şriftlərin Tapılması

İnternetdə "təhlükəsiz" Veb şriftləri anlayışı tarixən inkişaf etmişdir. Təhlükəsiz şrift bütün əməliyyat sistemləri üçün standart olan şriftdir. Biz yalnız belə bir vəziyyəti xəyal edə bildiyimiz üçün tamamilə təhlükəsiz şriftlər yoxdur!

Bəzi şriftləri bəzi rezervasiyalarla təhlükəsiz adlandırmaq olar.

"Təhlükəsiz" şriftləri müəyyən etmək üçün əsas ən çox yayılmış şriftlər idi əməliyyat sistemi Windows, digər əməliyyat sistemlərində də istifadə olunur. Belə istifadəyə misal olaraq Web şrift paketi üçün artıq qeyd olunmuş Əsas şriftləri göstərmək olar ki, statistikaya görə, bu şriftlər bir çox Unix/Linux istifadəçiləri tərəfindən endirilib.

Bu paketə aşağıdakı şriftlər daxildir: Andale Mono, Arial Black, Arial, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, Webdings. Onların hamısı Runet üçün vacib olan kiril əlifbasını dəstəkləyir.

Mac OS X ilə standart olaraq daxil edilmiş şriftlər dəsti (bu ƏS ən çox yayılmışdır Mac istifadəçiləri OS) Veb üçün Əsas şriftlərdən bütün şriftləri ehtiva edir.

Beləliklə, əsaslanır Windows şriftləri, digər əməliyyat sistemlərində istifadə edilən "təhlükəsiz" veb şriftlərinin aşağıdakı siyahısı yaradılmışdır:

  1. Arial
  2. Arial Qara
  3. Komik Sans MS
  4. Kuryer Yenidir
  5. Gürcüstan
  6. Təsir
  7. Times New Roman
  8. Trebuchet MS
  9. Verdana

Webdings şriftində nişanlar var və məzmun üçün istifadə edilə bilməz. Andale Mono geniş istifadə edilmir, çünki gündəlik ekran oxumaq üçün uyğun deyil və bütün Windows istifadəçiləri buna malik deyil.

Hər kəsin bütün bu şriftləri var Windows istifadəçisi, Mac OS X və Unix/Linux istifadəçilərinin böyük əksəriyyəti (yəni Veb paketi üçün Core şriftlərini quraşdırmış şəxslər).

Bəs qalanları? Axı siz dizaynerin planının mümkün qədər görünməsini istəyirsiniz daha böyük rəqəm istifadəçilər!

Kiril əlifbasını dəstəkləyən şriftlər

RuNet-in spesifik xüsusiyyəti səhifə kodlaşdırması və şriftlərdə kiril əlifbasının dəstəyi ilə bağlı problemdir. Müxtəlif simvol kodlaşdırmaları ilə bağlı problemlərin qarşısını almaq üçün, ağıllı insanlar bir neçə dildən simvolları bir şriftdə birləşdirməyə imkan verən Unicode icad etdi. Beləliklə, rusdilli səhifələr üçün yalnız kiril əlifbasını dəstəkləyən Unicode şriftlərindən istifadə etməlisiniz.

Aşağıda şrift yazışmaları cədvəli verilmişdir.

Windows MacOS Unix/Linux ata-baba ailəsi
Arial Qara Helvetica C.Y. Nimbus Sans L Sans-serif
Arial Helvetica C.Y. Nimbus Sans L Sans-serif
Komik Sans MS Monako CY * (aşağıya bax) kursiv
Kuryer Yenidir * (aşağıya bax) Nimbus Mono L Tək fəza
Gürcüstan * (aşağıya bax) Əsrin məktəb kitabı L Serif
Təsir Kömür C.Y. * (aşağıya bax) Sans-serif
Times New Roman Times C.Y. Nimbus Roman No9 L Serif
Trebuchet MS Helvetica C.Y. * (aşağıya bax) Sans-serif
Verdana Cenevrə C.Y. DejaVu Sans Sans-serif

* şriftlə qarşı-qarşıya olan sütunda yerli kiril yazısı deməkdir Windows ekvivalentləriƏməliyyat sistemində şrift yoxdur. Ancaq eyni zamanda, bu şriftin özünün birbaşa əməliyyat sistemində quraşdırılması ehtimalı yüksəkdir.

Məsələn, tərtibatın əsas mətni Arialdırsa, cədvəldə bu şrifti tapırıq və CSS-də müvafiq sətri yazırıq:

bədən (şrift ailəsi: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif; )

bədən(

şrift - ailə: Arial, "Helvetica CY", "Nimbus Sans L", sans - serif;

Bu giriş o deməkdir ki, əgər istifadəçinin Arial şrifti varsa (və bütün Windows istifadəçiləri və bütün Mac OS X istifadəçiləri buna malikdirsə), o zaman səhifə bu şriftdə göstəriləcək. Əgər istifadəçidə bu şrift yoxdursa, o zaman rusdilli Mac OS 9 istifadəçisinin səhifəsi Helvetica CY standart sistem şriftində dəqiq göstəriləcək, Unix/Linux istifadəçisi üçün isə Nimbus Sans L şriftində göstəriləcək. , Unix/Linux istifadəçilərinin 90%-də quraşdırılıb. Unix/Linux istifadəçisi bu şriftə malik olmayan 10%-də olarsa, o zaman səhifə Veb səhifələrə baxmaq üçün standart olaraq təyin edilmiş serif şriftində göstəriləcək.

Cədvəldə Unix/Linux şriftlərinin nəzərə alınmasından əlavə, adi Helvetica-dan sonra bəzi qəribə CY simvolu da var. Gəlin bunun nə olduğunu anlayaq!

Mac OS X-in buraxılmasından əvvəl bu xətt var idi növbəti dəyər: Windows istifadəçiləri səhifəni Arial, Mac OS 9 istifadəçiləri onu standart Helvetica şriftində, digərləri isə səhifəni standart brauzer şrifti kimi təyin edilmiş sistem sans-serif şriftində görürlər. Amma yenə mühüm nüans! U standart Mac OS 9 Helvetica şrifti kirilsiz! Rusdilli səhifə üçün bu, aşağıdakıları nəzərdə tuturdu: Windows istifadəçiləri üçün Arial səhifəsini, Mac OS 9 istifadəçiləri üçün - oxunmayan məlumatları göstərən standart Helvetica şriftində, qalanları isə sans-serif sistemi ilə səhifəyə baxın. brauzerdə standart olaraq konfiqurasiya edilmiş şrift.

Mac OS 9 istifadəçiləri üçün bu dəsti düzgün göstərmək üçün kiril olmayan Helvetica əvəzinə eyni standart Mac OS 9 şrift Helvetica CY-ni daxil etmək məqsədəuyğundur.

Mac OS X-in buraxılışından sonra hökmdarların oxunuşu dəyişdi. İndi Windows/Mac OS X üçün müəyyən edilmiş bir ümumi standart şrift var. Mac OS 9 istifadəçilərinin dizaynerin niyyətini görə bilməsini istəyiriksə, şrift xəttinə kiril əlifbası olan şrifti daxil etməliyik.

Beləliklə, təhlükəsiz şriftlər olmasa da, təhlükəsiz şrift ailələri var. Onlara da deyilir şrift CSS yığınları. Standart Windows/Mac OS X şriftlərinə əlavə olaraq, bu sətirlərə Mac OS 9-un standart dəstindən (standart olaraq “təhlükəsiz” şriftləri ehtiva etmir) və ümumi Unix/Linux şriftlərindən ekvivalent şriftlər də daxil ola bilər.

İstənilən layout dizayneri gec-tez dizaynerin “təhlükəsiz” şriftlər siyahısına daxil edilməyən tərtibatda şriftdən istifadə etdiyi anla qarşılaşır; Ancaq bu hələ həyəcan təbili çalmaq üçün bir səbəb deyil! Məsələn, dizaynerlər çox vaxt Tahoma şriftini bu siyahıya daxil olmayan planlarda istifadə edirlər. Düzgün qurulmuş şrift xətti təkcə Tahoma-dan deyil, digər şriftlərdən də istifadə etmək imkanını açır. Hamısı daha çox dizaynerlər bu fürsətdən istifadə edirlər və səlahiyyətli layout dizayneri bu barədə bilməlidir.

Aşağıdadır əlavə masa"təhlükəsiz" olanlar siyahısına daxil edilməyən, lakin tərtibatlarda istifadə edilə bilən şriftlər.

Windows MacOS ata-baba ailəsi
Lucida Konsolu Monako Tək fəza
Lucida Sans Unicode Lucida Grande Sans-serif
Tahoma Cenevrə C.Y. Sans-serif

Kiril əlifbası olmasa nə olar?

İngilis dilli mətnlər üçün yuxarıdakı cədvəllər bir qədər fərqli görünüşə malikdir.

Windows MacOS Unix/Linux ata-baba ailəsi
Arial Qara Qadcet Nimbus Sans L Sans-serif
Arial Helvetica Nimbus Sans L Sans-serif
Komik Sans MS Monako TSCu_Comic kursiv
Kuryer Yenidir kuryer Nimbus Mono L Tək fəza
Gürcüstan * (aşağıya bax) Əsrin məktəb kitabı L Serif
Təsir kömür Rekha Sans-serif
Times New Roman Vaxt Nimbus Roman No9 L Serif
Trebuchet MS Helvetica Garuda Sans-serif
Verdana Cenevrə DejaVu Sans Sans-serif

Arial, Courier New və Times New Roman şriftləri üçün xətkeşlər yaradarkən əvvəlcə Unix/Linux şriftini, sonra isə Mac OS şriftini təyin etmək daha yaxşıdır. Bu, Linux X11 əsas şrift dəstinin bəzi əyriliyi ilə əlaqədardır.

"Təhlükəsiz" siyahıya daxil edilməyən, lakin tərtibatlarda istifadə oluna bilən şriftlər bu cədvəl əsasında CSS şrift yığınları ilə daha yaxşı müəyyən edilir.

Windows MacOS Unix/Linux ata-baba ailəsi
Lucida Konsolu Monako - Tək fəza
Lucida Sans Unicode Lucida Grande Garuda Sans-serif
Palatino Linotipi Palatino Garuda** Sans-serif
Tahoma Cenevrə Kalimati Sans-serif

Unix/Linux sütunundakı tire göstərir ki, bu əməliyyat sistemlərinin istifadəçiləri çox güman ki, səhifədə standart şrifti görəcəklər.

** Bu sətirdə Garuda şriftini Palatinodan əvvəl yerləşdirməyin mənası var (yuxarıdakı izahata bax).

Nəticələr:

  1. Tamamilə təhlükəsiz şriftlər yoxdur. Aşağıdakı şriftlər şərti olaraq təhlükəsiz hesab edilə bilər:
    • Arial
    • Arial Qara
    • Komik Sans MS
    • Kuryer Yenidir
    • Gürcüstan
    • Təsir
    • Times New Roman
    • Trebuchet MS
    • Verdana
  2. Şriftlərdə kiril əlifbasının dəstəyini nəzərə alan təhlükəsiz CSS yığınlarını məqalədə tapa bilərsiniz.
  3. Səhifədə kiril əlifbasına dəstək vacib deyilsə, məqalədəki CSS yığınlarından istifadə edirik.
IN bu siyahı bütün cari üçün ümumi olan şriftləri sadalayır hal-hazırda Windows əməliyyat sistemləri (əslində Windows 98-dən bəri) və onların Mac OS-dəki ekvivalentləri. Belə şriftlər bəzən "brauzer üçün təhlükəsiz şriftlər" adlanır ( brauzerin təhlükəsiz şriftləri). Bu, Web səhifələri hazırlayarkən istifadə etdiyim kiçik bir istinad kitabıdır və məncə sizin üçün də faydalı olacaq.

Veb dizaynında yenisinizsə, belə bir şey düşünə bilərsiniz: “Niyə özümü bununla məhdudlaşdırmalıyam? kiçik dəstşriftlər? Gözəl şriftlərdən ibarət böyük kolleksiyam var!” Fakt budur ki, ziyarətçinin brauzeri yalnız quraşdırılmış şriftləri göstərə bilər onun içindəəməliyyat sistemi ( təqribən. tərcüməçi: Hal-hazırda, səhifələrin və onun yeni xüsusiyyətinin dizaynı zamanı faktiki olaraq istənilən şriftdən istifadə etmək artıq mümkündür @font-face; lakin hələ bütün brauzerlər bu funksiyanı dəstəkləmir), bu o deməkdir ki hər səhifənizin ziyarətçisi seçdiyiniz şriftlərin sahibi olmalıdır. Buna görə də, yalnız hər bir əməliyyat sistemində mövcud olan şriftlərdən istifadə etməlisiniz. Xoşbəxtlikdən, CSS-nin bir xüsusiyyəti var @font-ailəsi, bu işi asanlaşdırır.

Siyahı

@font-ailə mənası Windows Mac Ailə
Arial, Helvetica, sans-serif Arial Arial, Helvetica sans-serif
"Arial Qara", Gadget, sans-serif Arial Qara Arial Qara, Gadget sans-serif
"Komik Sans MS", kursiv Komik Sans MS Comic Sans MS 5 kursiv
"Kuryer Yeni", Kuryer, monospace Kuryer Yenidir Kuryer Yeni, Kuryer 6 monospace
Gürcüstan, Serif Gürcüstan 1 Gürcüstan serif
Zərbə, Kömür, sans-serif Təsir Zərbə 5, Kömür 6 sans-serif
"Lucida Console", Monako, monospace Lucida Konsolu Monako 5 monospace
"Lucida Sans Unicode", "Lucida Grande", sans-serif Lucida Sans Unicode Lucida Grande sans-serif
"Palatino Linotype", "Book Antiqua", Palatino, serif Palatino Linotype, Kitab Antiqua 3 Palatino 6 serif
Tahoma, Cenevrə, sans-serif Tahoma Cenevrə sans-serif
"Times New Roman", Times, serif Times New Roman Vaxt serif
"Trebuchet MS", Helvetica, sans-serif Trebuchet MS 1 Helvetica sans-serif
Verdana, Cenevrə, sans-serif Verdana Verdana, Cenevrə sans-serif
Simvol Simvol 2 Simvol 2 -
Webdings Webdings 2 Webdings 2 -
Wingdings, "Zapf Dingbats" Qanadlar 2 Zapf Dingbats 2 -
"MS Sans Serif", Cenevrə, sans-serif MS Sans Serif 4 Cenevrə sans-serif
"MS Serif", "Nyu York", serif MS Serif 4 Nyu York 6 serif

1 Georgia və Trebuchet MS şriftləri Windows 2000/XP ilə göndərilir və IE şrift paketinə daxildir (və həqiqətən də bir çox Microsoft proqramları ilə birlikdə gəlir), ona görə də onlar bir çox Windows 98 kompüterlərində quraşdırılır.

2 Simvol şriftləri yalnız ekranda göstərilir Internet Explorer, digər brauzerlərdə onlar adətən standart şriftlə əvəz olunur (baxmayaraq ki, məsələn, Symbol şrifti Opera-da, Webdings isə Safari-də göstərilir).

3 Kitab Antiqua şrifti Palatino Linotype ilə demək olar ki, eynidir; Palatino Linotype Windows 2000/XP, Book Antiqua isə Windows 98 ilə gəlir.

4 Nəzərə alın ki, bu şriftlər TrueType deyil, bitmapdır, ona görə də bəzi ölçülərdə onlar pis görünə bilər (onlar 96 DPI-da 8, 10, 12, 14, 18 və 24 pt-da göstərmək üçün nəzərdə tutulub).

5 Bu şriftlər yalnız Safari-də standart üslubda işləyir, lakin qalın və ya kursivlə işləmir. Comic Sans MS də qalın hərflərlə işləyir, lakin kursivlə deyil. Digər Mac brauzerləri öz-özlüyündə çatışmayan şrift xüsusiyyətlərini təqlid etməkdə yaxşı görünür (məsləhət üçün Christian Fecteau sayəsində).

6 Bu şriftlər yalnız Klassik quraşdırma ilə Mac-da quraşdırılır

Ekran görüntüləri

  • Mac OS X 10.4.8, Firefox 2.0, ClearType aktivləşdirilib (ekran görüntüsü üçün Juris Vecvanags sayəsində)
  • Mac OS X 10.4.4, Firefox 1.5, ClearType aktivləşdirilib
  • Mac OS X 10.4.11, Safari 3.0.4, ClearType aktivləşdirilib (ekran görüntüsünə görə Nolan Gladiusa təşəkkürlər)
  • Mac OS X 10.4.4, Safari 2.0.3, ClearType aktivləşdirilib (ekran görüntüsü üçün Erik Zaveskiyə təşəkkürlər)
  • Windows Vista, Internet Explorer 7, ClearType aktivləşdirilib
  • Windows Vista, Firefox 2.0, ClearType aktivləşdirilib (ekran görüntüsü üçün Michiel Bijl sayəsində)

Layout yaratmağa başladıqda, CSS-də səhifədə istifadə olunan şriftləri xüsusi olaraq göstərməlisiniz. Çox vaxt müxtəlif şriftlərdə dizayner yalnız səhifənin əsas mətnini deyil, həm də müxtəlif başlıqları, loqoları və monoqramları yazır:

Yaxşı bir dizayner, yaxşı tərtibat dizayneri kimi, brauzerin yalnız bir səhifəni göstərmək üçün istifadəçinin kompüterində quraşdırılmış şriftlərdən istifadə edə biləcəyini bilir. Yəni şriftləri iki kateqoriyaya bölmək olar:

  1. İstifadəçilərin böyük əksəriyyəti tərəfindən problemsiz göstəriləcək şriftlər.
  2. Kifayət qədər böyük bir istifadəçi qrupunda olmayan şriftlər.

Dizayner, məsələn, bir loqo və ya böyük statik başlıqlar yaratmaq üçün ikinci kateqoriyadan olan şriftlərdən istifadə edərsə, texnikadan istifadə etməkdən çəkinə bilməzsiniz. Bu texnikadan istifadənin dezavantajı elastiklikdir. Mətndə dəyişikliklər olarsa, şəkli yenidən düzəltməli və CSS-ni dəyişdirməli olacaqsınız (məsələn, yeni şəklin ölçüləri köhnə ilə uyğun gəlmirsə).

Bir texnikadan istifadənin təhlükəsinin mətnin dəyişdirilməsi ehtimalından birbaşa asılı olduğunu söyləyə bilərik. Buna görə də, məsələn, bir səhifənin ümumi mətni qeyri-standart şriftlərlə yazıla bilməz! Bacarıqlı bir dizayner heç vaxt bunu etməz. Dizayner yaşıl birinə rast gəlsə, yaxşı tərtibat dizayneri sadəcə səhvini düzəltməyə borcludur - tərtibatda bu şrifti ən oxşar standartla əvəz edin.

Bəs birinci qrupun şriftlərini ikincidən necə ayırd etmək olar? Aydındır ki, siz birbaşa kompüterinizdə quraşdırılmış şriftlər dəstinə etibar edə bilməzsiniz! Gəlin bunu anlayaq.

Standart şriftlər

Standart şriftlər əməliyyat sistemi ilə quraşdırılmış şriftlər toplusudur. Əməliyyat sistemləri fərqli olduğundan, onların şrift dəsti fərqlidir. Standart şriftlərin siyahısı müxtəlif versiyalar Windows-u, məsələn, Standart Windows şriftləri məqaləsində və standart Mac OS şriftlərinin siyahısını Mac OS-ə daxil olan Şriftlər səhifəsində tapa bilərsiniz. Unix/Linux əməliyyat sistemlərinə gəlincə, onların tək şrift dəsti yoxdur. Bir çox Linux istifadəçisi DejaVu şrift dəstindən istifadə edir, xüsusən Ubuntu-da onlar standart olaraq quraşdırılır. http://www.codestyle.org saytından statistik məlumatlara görə, bir çox Unix/Linux istifadəçilərində URW, Free və digər şrift dəstləri quraşdırılıb. Eyni statistik məlumatlara görə, Unix/Linux istifadəçilərinin 60%-dən çoxu 2002-ci ilə qədər rəsmi olaraq Microsoft veb-saytında pulsuz yükləmək üçün mövcud olan İnternet üçün əsas şriftlər toplusundan şriftlərə malikdir.

Səhifənin dizaynerin hər hansı bir əməliyyat sistemində nəzərdə tutduğu şəkildə göstərilməsi üçün CSS xassəsində vergüllə ayrılmış bir neçə şrift təyin etmək olar.

Bu xüsusiyyət şrift soyadlarının və/və ya ümumi ailə adlarının prioritetləşdirilmiş siyahısını müəyyən edir. CSS2 spesifikasiyasına əsasən, şrift soyadlarının iki növü var:

  1. Seçdiyiniz şrift soyadı. Məsələn, "Times new Roman", "Arial" və s. Boşluqdan ibarət şrift soyadları dırnaq içərisində olmalıdır. Sitatlar yoxdursa, şrift adından əvvəl və sonra hər hansı boşluq simvolu nəzərə alınmır və şrift adındakı boşluqların ardıcıllığı tək boşluğa çevrilir.
  2. Ümumi (ümumi) ailə. Spesifikasiya aşağıdakı ümumi ailələri müəyyənləşdirir:
    • serif - uclarında serif olan şriftlər;
    • sans-serif - sans-serif şriftləri;
    • kursiv — kursiv şriftlər;
    • fantaziya - dekorativ şriftlər;
    • monospace - monospace şrift (eyni genişlikdə hərflərlə).
    Klan soyadları açar sözlərdir və dırnaq işarəsinə daxil edilməməlidir.

Beləliklə, dizayn üçün Windows OS-dən standart şrift götürülür, Mac OS və Unix/Linux üçün oxşarı seçilir, ümumi şrift ailəsi müəyyən edilir və işiniz bitdi.

Amma bu o qədər də sadə deyil. Gəlin daha ətraflı qazaq.

Veb Təhlükəsiz Şriftlərin Tapılması

İnternetdə "təhlükəsiz" Veb şriftləri anlayışı tarixən inkişaf etmişdir. Təhlükəsiz şrift bütün əməliyyat sistemləri üçün standart olan şriftdir. Çünki belə bir vəziyyət yalnız xəyal edilə bilər Tamamilə təhlükəsiz şriftlər yoxdur!

Bəzi şriftləri bəzi rezervasiyalarla təhlükəsiz adlandırmaq olar.

"Təhlükəsiz" şriftləri təyin etmək üçün əsas ən çox yayılmış əməliyyat sisteminin şriftləri idi. Windows sistemləri, digər əməliyyat sistemlərində də istifadə olunur. Belə istifadəyə misal olaraq Web şrift paketi üçün artıq qeyd olunmuş Əsas şriftləri göstərmək olar ki, statistikaya görə, bu şriftlər bir çox Unix/Linux istifadəçiləri tərəfindən endirilib.

Bu paketə aşağıdakı şriftlər daxildir: Andale Mono, Arial Black, Arial, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, Webdings. Onların hamısı Runet üçün vacib olan kiril əlifbasını dəstəkləyir.

Mac OS X ilə standart şəkildə gələn şriftlər dəsti (bu ƏS Mac OS istifadəçiləri arasında ən çox istifadə olunandır) Veb dəsti üçün Əsas şriftlərdən olan bütün şriftləri ehtiva edir.

Beləliklə, digər əməliyyat sistemlərində istifadə olunan Windows şriftləri əsasında "təhlükəsiz" veb şriftlərinin aşağıdakı siyahısı formalaşdırıldı:

  • Arial
  • Arial Qara
  • Komik Sans MS
  • Kuryer Yenidir
  • Gürcüstan
  • Təsir
  • Times New Roman
  • Trebuchet MS
  • Verdana

Webdings şriftində nişanlar var və məzmun üçün istifadə edilə bilməz. Andale Mono geniş istifadə edilmir, çünki gündəlik ekran oxumaq üçün uyğun deyil və bütün Windows istifadəçiləri buna malik deyil.

Hər bir Windows, Mac OS X istifadəçisi və Unix/Linux istifadəçilərinin böyük əksəriyyəti (yəni, Veb paketi üçün Core şriftlərini quraşdırmış şəxslər) bütün bu şriftlərə malikdir.

Bəs qalanları? Axı siz dizaynerin planının mümkün qədər çox istifadəçi tərəfindən görülməsini istəyirsiniz!

Bu barədə nəşrin ikinci hissəsində oxuyun.