Original by Nathan Ford

Пераклад на беларускую мову Patricia Clausnitzer

©2009 - 2010 Unit Interactive, LLC

Адным з аспектаў праектавання для вэб, што амаль адразу ж абражае дызайнераў з'яўляецца адсутнасць шрыфтоў, якія лічацца бяспечнымі для выкарыстання. Хоць гэта праўда, што ёсць толькі некалькі вэб-бяспечных шрыфтоў, з іх у нас ёсць у нашым распараджэнні, могуць быць досыць магутным і разнастайным карысным. Акрамя таго, CSS дае нам добры шрыфт стэка.

Стэкі шрыфтоў даюць волю

Вы жадаеце выкарыстоўваць Gill Sans? Ідзіце прама наперад. Нішто не павінна спыніць вас. Шрыфт стэкі прыярытэтныя спісы шрыфтоў, вызначаныя ў CSS атрыбут сямейства шрыфтоў, што браўзар будзе цыкл праз пакуль не знаходзіць шрыфта, усталяванага на кампутары карыстача. Гэта азначае, што вы можаце выкарыстоўваць Gill Sans, і калі карыстачы не маюць яго, вы можаце даць ім адэкватную замену, якая не памяншае іх досведу. Як спадар Mr. Richard Rutter ужо казаў, ёсць даволі шмат шрыфтоў, якія могуць сядзець на карыстача, ваша машына гатовая служыць ваш дызайн запатрабаванняў.

На жаль, агульнай практыкі Інтэрнэце і / ці тэхналогій, не ў поўнай меры выкарыстоўваць гэту функцыянальнасць. Там, як уяўляецца, недастатковая ўвага да працэсу стварэння гэтых труб. Напрыклад, па змаўчанні ў Dreamweaver выглядаць наступным чынам:

• Arial, Helvetica, sans-serif
• Courier New, Courier, monospace
• Times New Roman, Times, serif
• Georgia, Times New Roman, Times, serif
• Verdana, Arial, Helvetica, sans-serif
• Geneva, Arial, Helvetica, sans-serif

Як вы можаце бачыць, Ёсць не шмат варыянтаў, і заменнікаў часта не падыходзіць. Гэта прыклад таго, як слабы тыпаграфскіх стандартаў на вэб вядуць да бедных дызайнерскае рашэнне рашэнняў. Я не буду спекуляваць, тут, як і для, хто вінаваты ў тым, што тыпаграфіка ў Інтэрнэце пакідае жадаць лепшага ... Ёсць, верагодна, гэтулькі ж злачынцаў, як Ёсць злачынствы. Скажу, аднак, што шрыфт стэка, у канчатковым рахунку канструктыўных фактараў, а таксама неабходна старанна вывучыць як такі.

Усе ў сям'і

Пры стварэнні стэка, першым разгледзець кантэкст гэтага тэксту. Гэта будзе загаловак, да поўдня ад галавы ці целы копію? Гэта можна вызначыць адпаведны парадак стэка, з улікам вызначаных шрыфтоў добра працаваць для ўсталёўкі блокаў ад капіявання, тады як іншыя лепш працуюць пры вялікіх памерах. Напрыклад, нюансы Helvetica працу і на экране, калі тэкст досыць вялікі, у той час як Helvetica Neue злёгку шырокіх формаў ліста чытаць лепш пры меншых памерах на экране. Arial чытае ледзь лепш, чым Helvetica пры меншых памерах на экране, а таксама. Такім чынам, шрыфт Helvetica стэка, магчыма, запатрабуецца быць рознымі ў залежнасці ад таго, выкарыстоўваецца для капіявання цела ці загалоўка старонкі.

Пасля кантэксце лічыцца, Ёсць некалькі рэчаў, якія неабходна ўлічваць пры стварэнні стэка. Па-першае, абраць ідэальны кандыдат (падрабязней пра гэта пазней). Адтуль шлях ваш выбар можа відэльцам у залежнасці ад кантэксту.

Загалоўкі [ больш чым 12px ]:

font-family: Ideal, Alternative, Common, Generic;

1. Ideal – Ваш выбар не павінны быць злучаны, што лічыцца ўніверсальна "вэб-бяспекі". Ёсць яшчэ вельмі шмат шрыфтоў, якія валодаюць досыць высокім пранікненні на рынак, што вы можаце выбіраць. Проста не атрымаць нічога занадта невыразныя, ці вы будзеце толькі адзін бачыць.
2. Alternative – Пры выбары загалоўка і назвы шрыфты, памятаеце, што нюансы будуць больш прыкметныя, і таму вы павінны абраць альтэрнатыву, якая бліжэй па духу, чым памер ці адносную каштоўнасць. Каб знайсці духоўнага стрыечны брат, вы можаце паглядзець у тым жа класіфікацыі тыпу , ці шукаць штосьці ствараецца па тых жа дызайнерам тыпу . Асноўным, шукаць падабенства ў лісце формы.
3. Common – На гэтым этапе, вам проста трэба штосьці падобнае, што не збіраецца разарваць макета.
4. Generic – Cap яно з агульнай класіфікацыі, для тых фанатыкаў, якія не вераць ва ўсталёўцы шрыфтоў.

Абзацы [ менш ці эквівалентна 12px ]:

font-family: Ideal, Fit, Common, Generic;

1. Ideal – Нават калі вы жадаеце, каб гэта копія супадаюць з назвамі, вы можаце разгледзець чытальнасць шрыфтоў на працягу некалькіх пунктах. Напрыклад: Helvetica Neue і Arial лепш падыходзяць для малых і чытаць на экране, чым Helvetica.
2. Fit – Знайсці штосьці добра ўяўлялі, крос-платформавы, што не паваліцца макета. Напрыклад: Існуе каля 2 pts розніца паміж шырынёй Times New Roman і Georgia. Памножце гэта на колькасць знакаў у вашым блокаў копію, і вы маглі б катастрофай для вашага адваротным выпадку-добра прадуманага дызайну.
3. Common – Штосьці падобнае на густ і добра прадстаўлена.
4. Generic – Ізноў жа, скончыць з агульнай класіфікацыі.

Майце на ўвазе, што калі ваш ідэальны шрыфт толькі шырока прадстаўлены на Mac, напрыклад, вы можаце выкарыстоўваць альтэрнатыўныя, больш распаўсюджанай на кампутарах Windows. Для атрымання дадатковай інфармацыі пра распаўсюджанасць вызначаных шрыфтоў на некаторых аперацыйных сістэмах, зірнуць на codestyle.org/css/font-family/.

Стэк вашай палубы

Зараз, выкарыстоўваючы гэтыя кіраўнічыя прынцыпы, і абапіраючыся на досвед больш дасведчаных гуру тыпаграфікі, я склаў спіс шрыфтоў, стэкі, якія як адкрыць больш магчымасцяў шрыфта для вэб-дызайнераў, і мы спадзяемся прапанаваць больш адпаведныя заменнікі:

p – збалансаваны па пунктах ці орган копію
t – збалансавана для загалоўкаў ці назваў

• Arial, “Helvetica Neue”, Helvetica, sans-serif - p, t
• Baskerville, “Times New Roman”, Times, serif - p
  Baskerville, Times, “Times New Roman”, serif - t
• Cambria, Georgia, Times, “Times New Roman”, serif - p, t
• “Century Gothic”, “Apple Gothic”, sans-serif - p, t
• Consolas, “Lucida Console”, Monaco, monospace - p, t
• “Copperplate Light”, “Copperplate Gothic Light”, serif - p, t
• “Courier New”, Courier, monospace - p, t
• “Franklin Gothic Medium”, “Arial Narrow Bold”, Arial, sans-serif - p, t
• Futura, “Century Gothic”, AppleGothic, sans-serif - p, t
• Garamond, “Hoefler Text”, Times New Roman, Times, serif - p
  Garamond, “Hoefler Text”, Palatino, “Palatino Linotype”, serif - t
• Geneva, “Lucida Sans”, “Lucida Grande”, “Lucida Sans Unicode”, Verdana, sans-serif - p
  Geneva, Verdana, “Lucida Sans”, “Lucida Grande”, “Lucida Sans Unicode”, sans-serif - t
• Georgia, Palatino,” Palatino Linotype”, Times, “Times New Roman”, serif - p
  Georgia, Times, “Times New Roman”, serif - t
• “Gill Sans”, Calibri, “Trebuchet MS”, sans-serif - p
  “Gill Sans”, “Trebuchet MS”, Calibri, sans-serif - t
• “Helvetica Neue”, Arial, Helvetica, sans-serif - p
  Helvetica, “Helvetica Neue”, Arial, sans-serif - t
• Impact, Haettenschweiler, “Arial Narrow Bold”, sans-serif - p, t
• “Lucida Sans”, “Lucida Grande”, “Lucida Sans Unicode”, sans-serif - p, t
• Palatino, “Palatino Linotype”, Georgia, Times, “Times New Roman”, serif - p
  Palatino, “Palatino Linotype”, “Hoefler Text”, Times, “Times New Roman”, serif - t
• Tahoma, Geneva, Verdana - p
  Tahoma, Verdana, Geneva - t
• Times, “Times New Roman”, Georgia, serif - p, t
• “Trebuchet MS”, “Lucida Sans Unicode”, “Lucida Grande”,” Lucida Sans”, Arial, sans-serif - p
  “Trebuchet MS”, Tahoma, Arial, sans-serif - t
• Verdana, Geneva, Tahoma, sans-serif - p
  Verdana, Tahoma, Geneva, sans-serif - t

Я наўмысна выключыць некаторыя шрыфты, *кашаль* Comic Sans *кашаль*, таму што я не вельмі зразумела, навошта ў іх, і я не веру, што гэтыя прыклады будуць вырашаць кожны тыпаграфскіх мэты, але мы спадзяемся, гэта толькі пачатак. Не саромейцеся звяртацца вышэй кіравала і стварыць некалькі стэкаў вашых уласных.

Калі вы зацікаўлены ў шырэйшым параўнанні, запампаваць PDF [13,1 мб] . У ёй вы знойдзеце прыклады абедзвюх назваў і капіяваць, усталяваных у розных стэкаў шрыфта.

Зараз, шрыфт стэкі дапамагаюць нам адкрыць яшчэ некалькі тыпаграфскіх варыянтаў для стварэння цікавейшым мець зносіны ў рэжыме анлайн, але як мы можам выбіраць, якія пэўныя твары выкарыстоўваць? І які з гэтых вэб-бяспечных шрыфтоў будзе працаваць, як добры камплімент? Падрабязней пра гэта ў маім наступным пасце.